How to Setup Tracking Code in Duda

Knowledge Base

Responsive Website Builder

How to Setup Tracking Code in Duda

Duda Support > Responsive Website Builder > Advanced

Overview

Setting up tracking code allows for in-depth insight and analysis of visitor activity. There are many different analytics providers and tracking solutions on the web. This article will help explain how to add some of the more commonly used tracking solutions to your responsive Duda site. We will specifically be discussing Google Tag Manager, Google Analytics, Google Ad Words tracking, and Facebook tracking pixels. This is a very advanced setup, so you may want to seek help from developers to implement the code for you.

Important Information

For all of the following guides, you will need to already have the code snippets from these various services. These guides will explain how to implement the code, but will not explain the purpose, best practices, or usability of the code. Duda recommends that you familiarize yourself with these services before implementing them by reviewing the extensive online discussions about these tracking solutions, which you can find on their websites or through web searches.

Google Tag Manager

Adding Google Tag Manager

The Tag Manager code you receive from Google should look something like the below snippets. There are two parts to this code, a 'script' and a 'noscript' section. This difference will become important later in this guide. Note: The below code is just an example - do not copy this directly into your site. Please be sure to obtain the correct code from Google.

1. You will first need to access the global header section. Click "Settings" in the left menu, and then select the "Header HTML" sub-section.

2. Place the 'script' part of the Tag Manager code in the "Header HTML" section and click Save. After saving the "Header HTML" should look like this:

Note: All of the above code is just an example - do not copy this directly into your site. Please be sure to obtain the correct code from Google Tag Manager.

3. Navigate to "Developer Mode" by clicking on the </> symbol in the top bar.

4. Expand the "Site HTML/CSS" section, and click on the "body-end.html" section. Place the 'noscript' part of the code in this section. Then, click Save. This section should now look like this:

Notes and Considerations for Google Tag Manager

Google recommends to place the "noscript" code in the beginning of the "body" section. This is a workaround Google suggests to get around limitations of very old web browsers which do not load header code.

Duda has completed extensive testing and the body-end.html section of developer mode works for adding the "noscript" code.

For information about setting up Tag Manager within your Google account, please seek help from Google.

Google AdWords Tracking

Adding Google AdWords Tracking

The Google AdWords Tracking code you receive from Google should look similar to the below image.

Note: All of the below code is just an example - do not copy this directly into your site. Please be sure to obtain the correct tracking code from Google AdWords.

1. You will first need to access the global header section. Click "Settings" in the left menu, and then select the "Header HTML" sub-section.

2. Place the code provided by Google into this section, then click Save.

Once you have added the tracking code into the header section, you need to add code to the widget that you want to be considered the tracking event.Please note that AdWords does not differentiate between click and load tracking.

3. Next, you need to add Google's tracking on individual links. For example, if you wanted to add tracking to a button click, then you would go to the button within the editor and right-click to bring up the below menu, and then select HTML/CSS

4. Once you are looking at the HTML for the button widget find the <a> tag and add the following snipet to this section.

If you did this correctly the code would look something like the below screenshot.

Note: The above code is just an example - do not copy this directly into your site. Please be sure to obtain the correct code from Google.

Notes and Considerations for Google AdWords

Google recommends to use:

onclick="goog_report_conversion ('http://example.com/your-link')"

The one we use also enables us to track into Duda stats.

Google Analytics

Adding Google Analytics

Adding Google Analytics to individual widgets provides another way for you to track statistics on certain functions.

1. Make sure that Google Analytics is already set up on your website. To do this go to site settings and then click on the "Google Analytics" section. Paste your Google Analytics code in the field provided in the screenshot below.

2. After the code is added, you can set individual widgets to be tracked by modifying the HTML of the widget. To do this, right-click on the widget you want to be tracked and click 'Edit HTML/CSS'.

3. Enter your Google Analytics code.

Note: The code you copy and paste from Google will not work. You need to modify the Google code so that the tracking gets reported to the right analytics. If you do not specify the Google Analytics account to report to by adding the c.,then the event will not be tracked at all.