Using Meta Pixel with Google Tag Manager on Shopify

If you're using Google Tag Manager and the TrackPixel.app to manage tags for your Shopify website, you can add your Meta Pixel to your Google Tag Manager account to measure and optimize the results of your Facebook advertising on Shopfiy.

Follow these instructions to install the Google Tag Manager pixel on your Shopify store. 

Install your Meta Pixel

  1. Log in to your Google Tag Manager account.
  2.  Select your website's container and click Add a new tag.
  3. Click Custom HTML Tag and enter a name for your tag.
  4. Go to Meta Events Manager and select Add Event.
  5. Select From a New Website.
  6.  Select Install code manually.
  7.  Select Copy Code to copy the entire Pixel base code.
  8. Return to Google Tag Manager and paste the code in the HTML container.
  9. Click the Advanced Settings dropdown and select Once per page under Tag firing options.
  10. Under Fire On, select All Pages.
  11. Click Create Tag.

Create action-specific tags

Now that you have your base code installed, you can create specific tags for the different types of pages and events on your website (ex: product page, add to cart button, purchase page).

    1. In Google Tag Manager, select your website's container and click Add a new tag.
    2.  Name your tag, then insert just the snippet of code relating to that event, plus any other variables you want to receive. Keep in mind your variables (ex: product_ids and product_name) may be different from the example below.
    3. Click Custom HTML Tag and enter a name for your tag.
    4. Copy and paste the snippet of code relating to the event and any other variables you want to receive. Keep in mind your variables (ex: product_ids and product_name) may be different from the example below.
    5.  Under Advanced Settings, select Once per event under Tag firing options.
    6.  Under Tag Sequencing check the box and select your base code tag, to ensure this tag fires after your base code.
    7.  Under Fire On, select the trigger that is relevant for your site.
    8.  Click Create Tag.

 

    1.  In the same way, create tags for the other events on your website (ex: add to cart, purchase). See the examples below.

 

    1.  When you're finished creating tags, click Publish.

 

 

Check if your Meta Pixel is working

Once you've uploaded all your events, you should check if your Pixel is working correctly. To check that your Pixel is working properly on your live site:

    1. Navigate to the web page your Pixel was added to. If it's working, your Pixel detail page in Events Manager will show your Pixel's status as Active and you'll see activity reported in the dashboards. Learn more about your Pixel data in Events Manager.

 

 

    1. If your Pixel's status is No activity yet, you can use the Meta Pixel Helper to troubleshoot the problem. Once the Pixel Helper is installed in your Chrome browser, a small icon will appear next to your address bar. Navigate to your website in your Chrome browser and click the Meta Pixel Helper icon. You can see which Pixel events were found on the page and whether they have loaded successfully, or see troubleshooting tips if there are any issues. Learn more.

 

Once you've successfully setup your Pixel, learn how run ads across Meta technologies using conversion optimization.