Pearl Diver - How to load the Pearl Diver tracking pixel to your website?

Pearl Diver - How to load the Pearl Diver tracking pixel to your website?

A tracking pixel is a small piece of code that allows you to gather valuable insights about user behavior on your website, and collect this data. By properly implementing your unique Pearl Diver tracking pixel into your website, you can monitor visitor activity, analyze collected data for this visitor, and refine your marketing strategies based on these findings. Here's a step-by-step guide on how to load a tracking pixel into your website, along with instructions for common website hosts.

Step 1: Obtain Your Tracking Pixel Code

Before you begin, you'll need to acquire the tracking pixel code from the Pearl Diver team. Reach out to your Pearl Diver representative or relationship manager with the Website URL you would like to track, and they will create and provide a unique tracking pixel for this website. This code typically consists of a JavaScript snippet that contains the necessary tracking information.

Step 2: Adding the Tracking Pixel to Your Website

The code snippet should be installed in a global location in your site code. This could be a <head> or <body> tag element or placed and deployed using Google Tag Manager (GTM). Successful installation would show the code snippet being visible when inspecting the code in the browser (right click > choose 'inspect' option OR click F12 on keyboard > Expand the Cookies option and see a tag labeled 'trovo' here).

Below are instructions for adding a tracking pixel to websites hosted on different platforms:

WordPress:
  1. Navigate to your WordPress dashboard.
  2. Go to ‘appearance’ in the left menu - hover over this
  3. Click on ‘Theme file editor’ (usually the last option when you hover over appearance)
  4. On the right will be a list of sections - find the option for header.php and click this
  5. Paste the tracking pixel code at the bottom of the header code section, before the <header/> text  - This means the pixel will be inside the header as the above closes the header
  6. Update and/or publish the page to save changes.
  7. Recommend you clear the website cache to ensure the pixel loads immediately - there will usually be a plugin installed for this. Look for Wp rocket at the top for example. See image below.
  8. For more detailed instructions and troubleshooting, refer to the WordPress support guide.


Notes
If loading to a specific page and not the global header, switch to the "Text" or "HTML" editor (not the Visual editor).

Google Tag Manager:
  1. Log in to your Google Tag Manager account.
  2. Create a new Tag by selecting 'Add Tag'
  3. Choose the "Custom HTML" tag type.
  4. Paste the tracking pixel code into the HTML field.
  5. Configure the trigger to fire on the desired pages - recommend all pages
  6. Save and publish the Tag.
  7. For specific guidance, check out the Google Tag Manager help center.
Wix:
  1. Open your Wix website editor.
  2. Go to Site in the right-corner > Settings
  3. Find 'Custom Code'
  4. Add Code- paste the script in the 'Head Code' section. Save and republish your website to put the change into effect.
  5. Find additional assistance in the Wix Help Center.
cPanel:
  1. Log in to your cPanel account.
  2. Look for the "File Manager" and navigate to your website's directory.
  3. Find the HTML file where you want to insert the tracking pixel.
  4. Click on the file and choose "Edit" or "Code Edit."
  5. Paste the tracking pixel code and save the file.
  6. Refer to your hosting provider's documentation for more information on using cPanel.

Shopify:
Info
If you are want to use multiple pixels you will need to set up Google Tag Manager
  1. Access your Shopify admin panel.
  2. Go to "Online Store" > "Themes."
  3. Click on the "Actions" button and select "Edit Code."
  4. Find the appropriate template (e.g., theme.liquid) to add the tracking pixel.
  5. Paste the tracking pixel code and save the file.
  6. Shopify's help center can provide further guidance.

HubSpot Website Manager:
  1. Log in to your HubSpot account.
  2. Navigate to your website dashboard.
  3. Go to "Settings" > "Website" > "Advanced Options."
  4. In the "Head HTML" section, paste the tracking pixel code.
  5. Save your changes.
  6. Detailed instructions are available in the HubSpot knowledge base.

Step 3: Verify and Test

After adding the tracking pixel, it's essential to verify its functionality.  Ensure the pixel has been loaded correctly, is firing and capturing the data and not facing any loading issues by following the below.

  1. Open the  website the pixel was added to in an incognito or private browsing window
  2. Right click and choose the 'inspect' option OR click F12 on keyboard

  3. You may need to click the two arrows at the top of the inspect menu and choose the ‘Applications’ option.

  4. Expand the Cookies option

  5.  If you see your white-labeled tag or a tag labelled 'trovo' here this means the pixel has been loaded correctly



Alert
If your tag is not displaying here, it could be due to 'lazy loading' on the website preventing it from firing for 1-2minutes resulting in much lower traffic being identified. See the below guide for how to correct lazy loading.
https://help.blackpearlmail.com/portal/en/kb/articles/pearl-diver-correct-lazy-loading-on-your-website

By following these steps, you'll be able to effectively load a tracking pixel onto your website, regardless of the hosting platform you use. Remember to always review and test to ensure accurate data collection.

Step 4: Book a session if you need help!

You can book a time with our support team if you need any assistance adding the pixel using the below Calendly link.
Please have your Website admin login on hand and possibly your hosting login as well, as sometimes you will need to clear the cache there!

    • Related Articles

    • Pearl Diver - Correct Lazy Loading for your tracking pixel on your website

      Lazy loading is a technique used in software and website development where resources, such as images or data, are loaded only when they are actually needed or requested. Instead of loading everything upfront, lazy loading delays the loading process ...

    • Pearl Diver for our Partners - FAQ

      Thank you for choosing to partner with us! As part of our commitment to delivering exceptional support tailored to our partners, we'd like to introduce this specialized FAQ document. While our standard Pearl Diver FAQ addresses general queries, this ...

    • Pearl Diver- Detecting Click Fraud and Bot Traffic (non-human traffic) on your website

      In the digital landscape, ensuring human web traffic is a vital metric for the success of any website. However, the presence of click fraud and bot traffic can significantly skew analytics, compromise advertising budgets, and affect the overall ...

    • Pearl Diver - Optimizing Results

      Guide to Utilizing and Increasing your Pearl Diver results. There are a couple of common factors which can reduce this percentage listed below. We typically are able to identify 20%-40% of your websites unique USA based visitors. Consent String set ...

    • Pearl Diver REST API - FAQ

      What is an API? An API, or Application Programming Interface, is like a middleman between different software programs, helping them communicate with each other. It takes requests from one program, tells another program what to do, and brings back the ...