How To Add Facebook Pixel To Showit: Two Easy Methods Explained

Want to take your Showit website to the next level? Adding a Facebook Pixel to your Showit website can seem daunting, but it’s actually a breeze. This guide will show you how to easily integrate it using Google Tag Manager, keeping your code clean and your tracking on point.

In this article we focus on adding the pixel, not creating it—here’s a link to Facebook’s guide on how to create a Facebook Pixel.

2x Methods to Add the Facebook Pixel to Showit

When it comes to adding the Facebook Pixel to your Showit site, you have two options:

1. Directly in Custom Head HTML – This involves pasting the pixel code directly into the Custom Head HTML section under Advanced Settings.
2. Using Google Tag Manager (GTM) – My preferred method, which keeps your code neat and tidy by managing all your tags in one place.

Method 1: Adding the Facebook Pixel Directly in Custom Head HTML

Step-by-Step Instructions

1. Get Your Pixel Code: Copy your Facebook Pixel code from the Facebook Ads Manager.
2. Log into Showit: Access your Showit account and open the website you want to add the pixel to.
3. Go to Advanced Settings: Navigate to the “Site Settings” and click on “Advanced Settings”.
4. Paste the Pixel Code: In the “Custom Head HTML” section, paste your Facebook Pixel code.
5. Save and Publish: Click “Save” and then publish your site to apply the changes.

Pros and Cons

Pros:

• Simplicity: Directly pasting the code is straightforward and quick.
• Immediate Implementation: Changes take effect as soon as you publish your site.

Cons:

• Risk of Errors: Manually adding code can lead to mistakes, especially if you’re not familiar with HTML.
• Maintenance Hassle: Any future updates or changes to the pixel code will require you to manually update the code again.
• Cluttered Code: Adding multiple tracking codes this way can clutter your site’s HTML, making it harder to manage.

Method 2: Using Google Tag Manager to Add the Facebook Pixel (Recommended)

What is Google Tag Manager?

Google Tag Manager (GTM) is a free tool that allows you to manage and deploy marketing tags (such as the Facebook Pixel) on your website without having to modify the code directly.

Benefits of using GTM:

• Centralized Management: All your tags are managed from one interface, making it easy to track and control.
• Cleaner Code: Instead of adding multiple scripts to your site, you add GTM once and manage all tags through it, keeping your codebase clean.
• Easier Updates: Updating or adding new tags is a breeze, as you only need to update them in GTM rather than directly in your site’s code.

Why I Recommend Google Tag Manager

Using GTM has several advantages:

• Reduced Risk of Code Errors: By centralizing your tag management, you minimize the risk of accidentally messing up your site’s code.
• Easier Maintenance: Managing tags through GTM is straightforward, reducing the hassle of manually updating or troubleshooting each tag.
• Scalability: As your website grows, you can easily add, update, or remove tags without touching the website’s core code, making it a scalable solution for any business.

Step-by-Step Guide to Adding Facebook Pixel Using Google Tag Manager

Step 1: Setting up Google Tag Manager

1. Create a GTM Account and Container:
   • Go to Google Tag Manager.
   • Click on “Create Account”.
   • Enter your account name and choose your country.
   • Enter your container name (usually your website name) and select “Web” as the target platform.
   • Click “Create” and accept the GTM Terms of Service.
2. Install GTM on Your Website:
   • After creating your container, GTM will provide you with a snippet of code.
   • Copy this code, as you’ll need it for the next step.

For detailed instructions on setting up Google Tag Manager on Showit, check out this guide: How to Add Google Tag Manager on Showit.

Step 2: Adding Google Tag Manager to Your Showit Site

1. Log into Showit:
   • Access your Showit account and open the website you want to add GTM to. I recommend adding the code to all pages.
2. Go to Advanced Settings:
   • Navigate to “Site Settings” and click on “Advanced Settings”.
3. Paste the GTM Code:
   • In the “Custom Head HTML” section, paste the GTM code you copied from Google Tag Manager.
   • Click “Save” and publish your site to apply the changes.

Step 3: Adding Facebook Pixel to Google Tag Manager

1. Log into Google Tag Manager:
   • Access your GTM account and open the container you created.
2. Create a New Tag:
   • Click on “Tags” in the left-hand menu and then click “New”.
   • Name your tag (e.g., “Facebook Pixel”).
3. Configure the Tag:
   • Click on “Tag Configuration” and search for “Facebook Pixel”.
   • Paste your Facebook Pixel code into the ‘Facebook Pixel ID(s)’
4. Set Up Triggers:
   • Click on “Triggering” and select “All Pages” to fire the pixel on every page of your site.
   • Click “Add” to save the trigger.
5. Save the Tag:
   • Click “Save” to save your new tag.

Step 4: Testing and Publishing

1. Test the Tag:
   • In GTM, click on “Preview” to enter preview mode.
   • Open your website in a new tab with the preview mode enabled. This will allow you to see which tags are firing.
   • Verify that the Facebook Pixel tag is firing correctly on your pages.
2. Publish the Container:
   • Once you’ve confirmed the tag is working correctly, go back to GTM and click “Submit” to publish your container.
   • Enter a version name and description for your reference, then click “Publish”.
3. Verify the Pixel on Your Website:
   • Use the Facebook Pixel Helper Chrome extension to check if the pixel is working correctly on your site.
   • Navigate through your site and ensure that the pixel is firing on all desired pages.

Troubleshooting Tips:

• Check Installation: Use tools like the Facebook Pixel Helper Chrome extension to verify that your pixel is firing correctly on all pages.
• Verify Code: Double-check that the pixel code is correctly implemented in GTM or directly in your site’s HTML.
• Test Events: Ensure that all events (e.g., page views, purchases) are set up correctly and firing as expected.

Common Mistakes to Avoid

Frequent Mistakes:

• Wrong Placement: Placing the pixel code in the wrong section of your site’s HTML can prevent it from firing correctly.
• Multiple Pixels: Having multiple pixels on the same site can cause data discrepancies and tracking issues.
• Incorrect Triggers: In GTM, setting up incorrect triggers can result in the pixel not firing on all intended pages or events.
• Ignoring Testing: Skipping the testing phase can lead to unnoticed errors in your pixel setup.

Benefits of Installing the Facebook Pixel Early

Collecting Valuable Data from Day One

The moment you install the Facebook Pixel on your Showit website, it starts collecting valuable data about your visitors. This data includes information on page views, clicks, and conversions, providing insights into how users interact with your site. The earlier you install the pixel, the sooner you start building a rich dataset.

Importance of Early Data for Future Ad Campaigns

Even if you don’t plan on starting ads right away, having the pixel installed means you’re accumulating data that will be invaluable for future campaigns. This data helps you understand your audience better, making it easier to create targeted and effective ads when you’re ready to launch. Think of it as setting up your marketing foundation early to hit the ground running when the time comes.

Advantages for Retargeting Ads and Improved Ad Performance

One of the biggest advantages of installing the Facebook Pixel early is the ability to create retargeting ads. These ads target visitors who have already interacted with your site, making them more likely to convert. With a well-established dataset, your retargeting efforts will be more precise and effective. Additionally, the data collected helps in optimizing ad performance by allowing Facebook to understand which audiences are most responsive to your ads.

Installing the Facebook Pixel on your Showit website is a crucial step in understanding and optimizing your audience’s behavior. By using Google Tag Manager, you ensure that your pixel is managed efficiently and your site remains clutter-free.

So, what are you waiting for? Start setting up your Facebook Pixel today to maximize your website’s data and set the stage for future ad success.