Adding user tracking codes/pixels to your site (or to specific pages)

Avatar
Justin Ober

In this Article

Note: This article applies to Composer users! See "Adding a user tracking code (Page Manager)" for the Page Manager version of this technique.

Many websites, such as Facebook or Hubspot, allow you to monitor your site users' browsing habits so that you can improve your own website to deliver what users are looking for. This is usually done via "tracking code" (sometimes called a "tracking pixel"), short snippets of programming that you can copy from a website and paste onto your own site pages. The page on your site where tracking code(s) are pasted determines what sort of information you can glean about site usage patterns.

Find and copy your tracking code

Start by going to the service or platform whose tracking code you want to use. Often, these sites will have dedicated pages that deliver a unique snippet of code for you to use on your site. Copy this tracking code to your clipboard, then follow these instructions for placing the code in the appropriate location(s) on your own site. The site where you obtain the tracking code will usually tell you exactly where to paste the code on your site pages; this article includes instructions for placing tracking code in:

  • Single Page: Inside the <head> tag or before the close of the </body> tag of specific, individual site pages.

  • All Site Pages: Inside the <head> tag or before or after the <body> tag of all pages.

Place code on single page

If the tracking code needs to be placed only on one page (or a group of specific pages), follow these steps demonstrated in the video and outlined below.

Inside the <head> tag

  1. Click on the page you want to place the tag on.

  2. Click on the  “Page Settings”gear in the bottom right corner of that page.page settings gear.png

  3. Go to the “SEO” tab and paste the code in the “Custom <head> Content” area.

    seo_tab_custom_head_content

Before the </body> tag for a single page

Add an Embed element at the bottom of the page and paste the code in the element settings.

embed_element

Place code on all pages

If the tracking code needs to be placed on all pages of your site, follow these steps demonstrated in the video and outlined below.

Inside the <head> tag for all pages

Use the “External Assets” section under your site's Themes.

themes_with_focus_on_external_assets

Don't forget to click “Update” once you have pasted the code. Note: If there are already assets in this field (as shown above), make sure you enter your code on a new line. 

After the <body> tag for all site pages 

  1. Navigate to the “Banners” section of your site in Composer.

  2. Choose your “default header.” If there are multiple top banners, the code will need to be placed on all of them. (If you only want this to appear on a single page, clone or modify the existing banner on that page.)

  3. Add an Embed element to the header and paste the code there. NOTE: Please ensure that the title of the element is turned OFF, or it could disrupt the layout of the page!

Before the </body> tag for all site pages

Use your site's bottom banner/footer.

  1. Navigate to the “Banners” section of your site in Composer.

  2. Choose your “default footer.” (If there are multiple bottom banners, the code will need to be placed on all of them.)

  3. Add an Embed element to this footer and paste the code there. NOTE: Please ensure that the title of the element is turned OFF, or it could disrupt the layout of the page!

Was this article helpful?
12 out of 16 found this helpful

Comments

2 comments
Sort by Date Votes
  • Avatar
    Jennifer Matascik

    The instructions don't make sense for "After the tag for all site pages -
    Use your site's top banner/header, and follow the steps below."
    If you follow the steps below you're then instructed to "Choose your “default footer.” (If there are multiple bottom banners, the code will need to be placed on all of them.)." It looks like it should use your "default top" if you're going to insert after the tag for all site pages and make sure that you're using the "header" and not the footer.

    0
  • Avatar
    Keegan Soncha

    Hi Jennifer! Thank you so much for your comment. Based on your statements here and what you commented in your ticket to us, we have made some updates and tweaks to the article. Since the article is meant to be used for a few different types of codes, we left the footer option there as well but you will want to go through what method works best for the pixel you are trying to place. Thank you again for your feedback!

    0

Please Sign in to leave a comment if you don't see the comment box below.