PrestaShop

PrestaShop is a popular open-source e-commerce platform. Here's how to add Rybbit Analytics to track visitors and conversions on your PrestaShop store.

How to Add Rybbit to PrestaShop

Using a Custom Code Module

PrestaShop's back office has no native option for injecting custom code into the <head>. To add the tracking script without editing template files, install a custom-code / header-injection module.

Install a Custom Code Module

Log in to your PrestaShop Back Office
Go to Modules > Module Catalog (or Module Manager)
Install a module that injects custom code into the page header — for example a "Custom HTML" or "Header/Head code" module from the PrestaShop Addons marketplace

PrestaShop does not ship a built-in head-injection UI, so a third-party module is required for this method. If you prefer not to install one, use the Theme Files tab instead.

Add the Tracking Script

Open the module's configuration and paste the following into its head / header code field:

<script>
(function() {
  var s = document.createElement('script');
  s.src = 'https://app.rybbit.io/api/script.js';
  s.defer = true;
  s.setAttribute('data-site-id', 'YOUR_SITE_ID');
  document.head.appendChild(s);
})();
</script>

Replace YOUR_SITE_ID with your actual Site ID.

Save Changes

Save the module configuration and clear the cache under Advanced Parameters > Performance to apply the tracking code to your store.

Editing Theme Files

For direct control, you can edit your theme's template files.

Create a child theme before editing files to preserve changes during updates.

Access Theme Files

Navigate to your theme folder via FTP/SFTP or file manager:

/themes/your-theme-name/templates/_partials/

Edit the Header Template

Open head.tpl and add the following before the closing </head> tag (or at the end of the file):

<script>
(function() {
  var s = document.createElement('script');
  s.src = 'https://app.rybbit.io/api/script.js';
  s.defer = true;
  s.setAttribute('data-site-id', 'YOUR_SITE_ID');
  document.head.appendChild(s);
})();
</script>

Replace YOUR_SITE_ID with your actual Site ID.

Clear Cache

Go to Advanced Parameters > Performance
Click Clear cache

Tracking E-commerce Events

Track Purchases

To track completed purchases, add a script to the order confirmation page. Create a module or add to your theme's order-confirmation.tpl:

{if isset($order)}
<script>
(function() {
  function waitForRybbit(callback, timeout) {
    var start = Date.now();
    (function check() {
      if (window.rybbit && typeof window.rybbit.event === 'function') {
        callback();
      } else if (Date.now() - start < timeout) {
        setTimeout(check, 100);
      }
    })();
  }

  waitForRybbit(function() {
    window.rybbit.event('purchase', {
      transaction_id: '{$order.details.reference}',
      value: {$order.totals.total.amount},
      currency: '{$order.totals.total.currency}'
    });
  }, 5000);
})();
</script>
{/if}

PrestaShop uses Smarty templating. The {$variable} syntax is processed by PrestaShop to inject order data.

Troubleshooting

Script not loading

Clear PrestaShop cache: Advanced Parameters > Performance > Clear cache
Disable any JavaScript optimization modules temporarily
Check the page source to verify the script is present

Theme updates overwriting changes

Always use a child theme when editing template files. Changes to the parent theme will be lost on updates.

E-commerce events not tracking

Verify the Smarty variables match your PrestaShop version
Check the browser console for JavaScript errors
Test by completing a test order

On this page