Answered

Google Analytics - Cross Domain Tracking for Embedded Typeform

  • 2 February 2022
  • 20 replies
  • 717 views

Userlevel 1
Badge +1

Hi,

I have viewed some of the threads related to the topic of tracking a user cross domain from my primary URL to my Typeform. However, the threads are difficult to follow and contain references to fixes that Typeform has since put in place. 

Would it be possible to layout clear / concise insturctions on how to ensure that I track one user successfully from my primary domain to the embedded typeform?

Thank you!

Sarah

icon

Best answer by mathio 8 February 2022, 16:54

View original

20 replies

Userlevel 7
Badge +5

Hi @sarahnestanalytics Thanks for stopping by! This will greatly depend on what you have set up on your site and how you’re already tracking respondents. For example, how are respondents being directed to your form? Do you already have their information before they begin filling out the Typeform? 

A great place to start would be through this article here, which walks you through setting up UTM tracking on the form. 

Userlevel 1
Badge +1

Hi,

Thanks for the quick response. 

I have been doing quite a bit of research on this and would appreciate your team’s help. 

I am not interested in setting specific UTM parameters, however I am interested in stitching together the two sessions. 

In the screenshot, you can see that a second session is starting, which we do not want. 

 

Here is what our embed code looks like. This includes my modification to add the data share google analytics instance. Please note i have placed dummy values in both our UA account and type form URL to protect the client.

Please let me know how I can update this so that a new session is not started. Thank you!

 

<html> <head> <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=0"> <title>client main contact form 2021</title> <style type="text/css"> html{ margin: 0; height: 100%; overflow: hidden; } iframe { position: absolute; left:0; right:0; bottom:0; top:0; border: 0; } </style> </head> <body> <iframe id="typeform-full" width="100%" height="100%" frameborder="0" allow="camera; microphone; autoplay; encrypted-media;" src="https://form.typeform.com/to/eeeeaaaa?typeform-medium=embed-snippet" data-share-google-analytics-instance="UA-11111111-1"></iframe> <script type="text/javascript" src="https://embed.typeform.com/embed.js"></script> </body> </html>

Userlevel 1
Badge +1

Hi @Liz - let me know if we could get an answer on this today. Thank you, Sarah

Userlevel 7
Badge +5

Hi @sarahnestanalytics This is expected behavior, so when you have the form embedded, we don’t have a way to prevent both sessions from starting. 

@picsoung do you happen to know of any workarounds? 

Userlevel 1
Badge +1

Hi @Liz - thanks for the reply.

Based on the information in this thread, 

, and based on the information here, https://github.com/Typeform/embed/pull/108 - this should be working,

This is Typeform’s own documentaiton about how cross domain tracking should be working. 

Can @mathio clarify?

I just need to understand if I have my code setup correctly. 

Userlevel 7
Badge +5

Hello @sarahnestanalytics 

This feature is supported by embed lib v1 only and your snippet is using embed lib v0. My guess is you are using quite an old snippet (6+ months old).

Please copy the new snippet from your Typeform share page and add attribute data-tf-share-ga-instance to the DIV with other data-tf- attributes. You don’t need to specify the “UA-XXXX-X” value unless you have multiple Google Analytics codes in your page.

See this Glitch page with demo for reference:
https://glitch.com/edit/#!/angry-free-hell?path=index.html%3A1%3A0

 

 

Userlevel 1
Badge +1

Hi @mathio - thanks!! I wasn’t sure how to know if I was using embed lib v1 versus v0 - so thank you. I’ll give this a try and let you know.

Sarah

Userlevel 7
Badge +5

To easily identify embed lib version: embed v1 (latest one) is using data-tf- attributes and the JS lib has /next/ in the URL.

Userlevel 1
Badge +1

Hi @mathio - I have updated the embed code and unfortunately am still having the same issue. Could you take a look at the page and let me know what the matter is? https://wearehygge.com/soclose/

 

I have tried it with and without the UA ID specific and am still seeing the same results. Interestingly the source / medium is now coming through as xxxx. 

 

 

Userlevel 7
Badge +5

You are defining those values for hidden fields in your embed code:
data-tf-hidden="utm_source=xxxxx,utm_medium=xxxxx,utm_campaign=xxxxx"

 

We will investigate the GA issue and let you know.

 

Userlevel 1
Badge +1

Thanks @mathio - just so I am understanding this correctly. The data-tf-share-ga-instance should pass the cookie from the parent page to the Typeform frame so that a new session is not created, correct? 

If so, then I am confused how the utm source, medium and campaign come into play - since they should not replace the original source, medium and campaign. 

Thanks again for your help.

Sarah

Userlevel 7
Badge +5

just so I am understanding this correctly. The data-tf-share-ga-instance should pass the cookie from the parent page to the Typeform frame so that a new session is not created, correct? 

This is correct.

If so, then I am confused how the utm source, medium and campaign come into play

If you specify data-tf-hidden attribute you will pass explicit values for your typeform hidden fields. UTM parameters work like hidden fields (values passed to your typeform via URL query params). You have the following options:

  1. do not pass any UTM params - remove the data-tf-hidden attribute from your embed snippet
  2. pass custom UTM values - modify the attribute value to pass correct values, for example:
    data-tf-hidden=”utm_source=my-website,utm_medium=my-page,utm_campaign=my-campaign”
  3. dynamically pass UTM values from the URL of the host page that contains the embed snippet via data-tf-transitive-search-params attribute - you only need to pass names of the variables, values will be taken from host page URL:
    data-tf-transitive-search-params=”utm_source,utm_medium,utm_campaign”

 

Userlevel 1
Badge +1

HI @mathio - I wanted to let you know that I was able to successfully set this up and am seeing the data in Google Analytics.

Now, if I want to see the Google Analytics source, medium and campaign data in Typeform - how do I set that up? For example, when viewing results, I would like to see the source, medium, campaign next to the information my form has captured. 

Hi Sarah, jumping in this thread regarding your concern about “how to ensure that I track one user successfully from my primary domain to the embedded typeform”

 

1. I think as you are setup right now (As i checked myself inspecting the request calls) it seems like the Google tracking traffic coming from your website and from the embedded Typeform are registered under the same Client ID. 

  • A manual test you could do (if you wish) to make sure traffic from your website and the Typeform is coming from the same Client ID is to:
    • Go to your website domain https://wearehygge.com/ (in Google Chrome) > Right click > Inspect > Click on Network tab > in the box where it says “Filter”, write “collect”. Right click on the page and click on Reload to refresh the page. Click on the first “collect” request call, click on Payload and search for cid value (It should looks like something like this 1006100324.1645019435) This is the client ID under which the Google Analytics is sent. Keep note of it.
    • Follow the same instruction on the page where the Typeform is embedded (https://wearehygge.com/soclose/) except what you will have to do is to interact with the Typeform (by filling answers) and then click on the last collect call that appeared as you filled in question. Go to Payload and then search for the cid value. It should be the same as on the website.Now you have similar cid value you could even verify on the Google Analytics Dashboard under Audience > User Explorer. Select today’s date in the date picker and in the Search filter in the right you can filter by the client ID we noted earlier.

       

    • If you click on the client ID you should be able to see the traffic from the website and from the Typeform be under the same Client ID.
       

       

  • For extra caution, make sure you are using analytics.js script (I think you are) (https://developers.google.com/analytics/devguides/collection/analyticsjs) The data-tf-share-ga-instance feature only works with analytics.js script

 

2. Now regarding making sure that the traffic from the website and Typeform are registered under the same session, it seems to be a different story. Here are two things that I identified that that could help: 

 

  • It seems that the Referral Exclusion List plays a role in making sure the traffic from your website are registered as Direct and making sure traffic is kept under one session.

    Add your main website domain name (wearehygge.com) to the Referal Exclusion List of your Google Analytics UA property: Admin > [Your UA property] > Tracking Info > Referral Exclusion List.

    Source: https://www.simoahava.com/analytics/troubleshooting-cross-domain-tracking-in-google-analytics/#2-domains-in-the-referral-exclusion-list

    Also, it seems that there is 6month timeout for returning users. It maybe not be reflected right away and if you are testing locally you might want to clear your cookies / try with another browser. See this: https://support.google.com/analytics/answer/2795830?hl=en

     
  • Another thing that I’d like to recommend is to make sure that both the traffic from your website and from the (embedded) Typeform share the same UTM parameters. I am worried that if only the Typeform has UTM parameters, it may confuse Google Analytics that the traffic is coming from another session.
Userlevel 1
Badge +1

Hey @supertinou - thanks so much for the thoughtful reply! I actually have everything set up correctly in Google Analytics, i.e., sessions are stitched together, campaign / source / medium are passing through correctly, etc. Yall were a big help in figuring that out - so thank you!

 

What I am interested in now is seeing that data IN typeform. So when I navigate to my results in Typeform, how can I see the responses I have gotten on my form and then the source, medium, and campaign that they came from?

 

Hey @sarahnestanalytics, The source, medium and campaign fields collected should be available in Responses.

See this https://www.typeform.com/help/a/using-hidden-fields-360052676612/ and the What will it look like when I collect data? section.

Did you find it?

Userlevel 1
Badge +1

HI @supertinou - thanks for the response. I am not seeing source, medium, and campaign in Responses. 

I read the support article that you referenced and this post, https://www.typeform.com/help/a/dynamically-pass-hidden-fields-from-a-url-to-an-embedded-typeform-for-advanced-users-4404652303892/

If the source, medium and campaign were always explicitly specified in the URL, then I believe the solution above would work. 

But we have many instances when there isn’t a utm parameter in the url. Example, when someone comes from Google Search - the url is simply wearehygge.com 

Google Analytics looks at the referrer and is able to determine it is from Google and is organic search. 

We are succesfully passing this information to Google Analytics from the embedded Typeform on this site. Is there a way to see this information in Typeform?

Basically, we dont get the user information in Google Analtyics. So, if we get a strong lead in - I have no way of seeing for a specific person what source they came from. 

Userlevel 1
Badge +1

To put this in a more simplistic ask,

I want to have the referrer/ source of the parent frame in my type form results.

Userlevel 1
Badge +1

@supertinou - any updates here? @mathio  could you help out? It seems that this must be a common data point many users must want. 

Userlevel 3
Badge +3

Hi @sarahnestanalytics if I understand correctly, you want to track the referrer URI that brought the user to your page, but inside Typeform? I am not sure this is possible, you could try to use https://developer.mozilla.org/en-US/docs/Web/API/Document/referrer  

You would have to set the referrer value with Javascript, so it would be better to use the vanilla Embed code directly If you look at the options you can see tracking, which is the UTM_source. But you need to use Javascript for it, it won’t work with html.

Reply