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

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.

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:

  • The <head> tags of specific, individual site pages

  • Before the close of the <body> tag on individual site pages

  • All site pages

Single page

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

Inside the <head> tag

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

  2. Click on the white gear “Page Settings” icon.Screen_Shot_2018-08-15_at_9.00.56_AM.png

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

Before the </body> tag for a single page

Screen_Shot_2018-08-15_at_9.03.26_AM.png

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

All pages

If the tracking code needs to be placed on all pages of your site, follow these steps.

Inside the <head> tag for all pages

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

Screen_Shot_2018-08-15_at_09.04.22.png

Don't forget to click “Update” once you have pasted the code.

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.)

  3. Add an Embed element to the header and paste the code there.

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.

Was this article helpful?
11 out of 14 found this helpful
Have more questions? Submit a request

Comments

2 comments
  • 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.

  • 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!

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