This article describes how to add Facebook Pixel code to X-Cart pages.

Step-by-step guide

Steps involved:

  1. Create a new custom template file (for example, via FTP):


  2. Add your Facebook Pixel Сode to the custom template:

    {* vim: set ts=2 sw=2 sts=2 et: *}
     * @ListChild (list="head", weight="999000")
    <!-- Facebook Pixel Code -->
    !function(f,b,e,v,n,t,s) { if(f.fbq)return;n=f.fbq=function() { n.callMethod?
    n.callMethod.apply(n,arguments):n.queue.push(arguments) }; if(!f._fbq)f._fbq=n;
    t.src=v;s=b.getElementsByTagName(e)[0];s.parentNode.insertBefore(t,s) } (window,
    // Insert Your Facebook Pixel ID below. 
    fbq('init', '<FB_PIXEL_ID>');
    fbq('track', 'PageView');
    <!-- Insert Your Facebook Pixel ID below. --> 
    <noscript><img height="1" width="1" style="display:none"
    <!-- End Facebook Pixel Code -->
  3. (Optional) If you would like to report ViewContent standard event, add the following code to your custom template:

    // ViewContent
    // Track key page views (ex: product page, landing page or article)
    fbq('track', 'ViewContent', {
    content_name: '{product.getName()}',
    content_category: '{product.category.getStringPath()}',
    content_ids: ['{product.getID()}'],
    content_type: 'product',
    value: {product.getPrice()},
    currency: '{xlite.currency.getCode()}' /* Default Store Currency */
  4. (Optional) If you would like to report InitiateCheckout and Purchase standard events, add the following code to your custom template:

    // InitiateCheckout
    // Track when people enter the checkout flow (ex. click/landing page on checkout button)
    fbq('track', 'InitiateCheckout', {
    // Purchase
    // Track purchases or checkout flow completions (ex. landing on "Thank You" or confirmation page)
    fbq('track', 'Purchase', {
    value: {order.getTotal()},
    currency: '{order.currency.getCode()}'
  5. (Optional) If you would like to report Search standard event, add the following code to your custom template:

    // Search
    // Track searches on your website (ex. product searches)
    fbq('track', 'Search');
  6. Apply the following SQL patch to your X-Cart database:

    INSERT INTO xc_theme_tweaker_template (template, date) VALUES ("theme_tweaker/default/en/header/parts/fb_pixel_code.tpl", UNIX_TIMESTAMP());
  7. Re-generate X-Cart cache.

See also: