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 Back Office Settings

PrestaShop allows adding custom code through the back office.

Access Theme Settings

Log in to your PrestaShop Back Office
Go to Design > Theme & Logo
Scroll down to Advanced customization or click on Pages Configuration

Add Custom Code

Depending on your PrestaShop version:

PrestaShop 1.7+:

Go to Design > Theme & Logo > Advanced customization
Click on Add a new HTML element
Select position: head or displayHeader
Add the following code:

<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>

PrestaShop 8.x:

Go to Design > Theme & Logo > Pages Configuration
Select displayHead hook
Add a custom HTML module with the script above

Replace YOUR_SITE_ID with your actual Site ID.

Save Changes

Click Save 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