How to Capture UTM Parameters Using Zapier

This article guides you through a custom workflow that utilizes Zapier & Google Sheets to extract UTM parameters from the embedded widget.

Requirements:

• Roof Quote PRO™ active subscription
• Admin user access
• Zapier account
• Google account

Overview:

RoofQuote PRO is designed to emit Javascript events from the tool making it possible to track your users' interactions from within the tool. If you are trying to track UTM parameters (ex: utm_medium, utm_campaign, etc) and are not leveraging a tool like Google Tag Manager, this setup will allow you to capture these variables.

We will be leaning on the externalUrl variable from our Webhooks feature.

Instructions:

1. To start, login to your Zapier account
2. Click the "+ Create" button
3. Choose "Zaps." Next we will need to add the workflow to the Zap...
4. Create Trigger for Zap
   1. Click the button that says Trigger and select 'Webhooks' from the actions.
      
      
      
   2. Select 'Catch Hook' as the Trigger event.
      
      
      
   3. Copy the Webhook URL under the Test tab.
5. Add Webhook URL to RQP Dashboard
   1. Open up a new tab or window, navigate to app.roofle.com and login
   2. Inside your RoofQuotePRO dashboard, find the Settings or gear icon
   3. Choose Developer on the ensuing pop up menu
   4. Once on the Developer page, select the Webhooks tab
   5. Paste in the Zap Webhook URL to the fielder while under the Contact Form Completed type. 
      
      
      1. NOTE: Be sure to remove the "https://" from the pasted URL
   6. Click Save Changes
6. Test the Zap
   1. Navigate to a deployed version of your RoofQuote PRO widget on your website. 
   2. Ensure that utm_params are being passed after a " ?" in the URL
   3. Enter in a serviceable address and test lead contact info
   4. Select the "See My Prices" (or equivalent) button. This will trigger the webhook and send the data load to Zapier.
   5. Navigate to Zapier.
      1. Find the Catch Webhook action again and select the Test tab
      2. Click on the Test trigger button
      3. Reload the list and the test lead will populate. Ensure that the UTM parameters were passed by finding the External Url in the data list.
         
         
         
7. Add Split Formatter to Zap
   1. Click the button that says Action and select 'Formatter' from the actions.
      
   2. From the Action event dropdown, select 'Text'.
      
      
      
   3. Under the Configure tab, choose 'Split Text' from the Transform dropdown.
   4. In the 'Input' field, enter a backslash " / " and then start typing "External Url". Once it auto populates, select that field.
   5. Under the 'Seperator' field, enter a " ? "
   6. This will divide everything after the ? in your page URL in order to capture the UTM parameters
      
      
      
8. Add Extractor Formatter to Zap
   1. Select 'Add Step' or ' + ' button under the first Formatter. Select Formatter again from the actions.
      
      
      
   2. From the Action event dropdown, select 'Text'.
      
      
      
   3. Under the Configure tab, choose 'Extract Pattern' from the Transform dropdown.
   4. In the 'Input' field, enter a backslash " / " and then select the Formatter from the previous step. Then select the output from that action.
   5. Under the 'Pattern' field, enter the variable you want to isolate and then a Regex pattern to ensure all characters are captured. In the example below, the utm_source parameter is being isolated.
      1. ex: utm_source=([^&]+)
         
         
         
         
9. Repeat Step 4 for Each UTM Parameter
   1. Repeat the Extractor Formatter setup for each parameter in your URL
   2. The only step that needs to be modified is the 'Pattern' field. Ensure you change that to a new UTM parameter. The same Regex pattern can be used.
      1. ex: utm_campaign=([^&]+)
      2. ex: utm_medium=([^&]+)
10. Create New Google Sheet
    1. Under your Google account, navigate to Google Sheets
    2. Create a new blank spreadsheet
    3. Rename the spreadsheet
    4. Next, right click the first row (Row 1)
    5. From the dropdown, navigate to 'View more row actions' and then select Freeze up to row 1. This will prevent the header row from being affected.
       
       
       
    6. In this newly frozen header row, add the UTM parameters name in each column. Start with Column A.
       
       
       
11. Add Google Sheets Injector Action
    1. Select 'Add Step' or ' + ' button under all of the Formatters. Select Google Sheets from the actions.
       
    2. On the 'Setup' tab of the Google Sheets action, choose the Action event dropdown.
    3. Select Create Spreadsheet Row from the list.
       
    4. Next, choose the corresponding Google account that owns the spreadsheet you want to use.
    5. Under the Configure tab, choose the existing Google Sheets document from the Spreadsheets dropdown. Next select the the Worksheet.
       
    6. Once both are selected, you will be able to edit the data source for your UTM parameters.
       1. In the example above, the following parameters are being isolated: utm_source, utm_medium & utm_campaign.
    7. In each applicable utm field, enter a backslash " / " and select the appropriate Formatter for that variable. Then select the output from that action.
    8. Rename each Extractor Formatter as the UTM paramter to make this step easier. Use the pencil icon at the top of each Formatter page.
       
       
       
12. Publish
    1. If setup correctly, the params will be automatically added into their corresponding columns on the Google Sheet.
    2. When ready to publish, simply swipe over on the Google Sheets tab in Zapier and select Publish.