Skip to content

Page tracking for SPA

If you are running your webshop as a Single Page Applications (SPA), the Hello Retail partner script is typically not reloaded automatically when a visitor is triggering a new page view. To ensure Hello Retail is tracking when the visitor views a new page you should call the trackPageView on every page change.

If you want to use our managed product recommendations, search or category pages you will have to ensure that the reload SDK method is called on every page view. This will trigger the following things

  • Remove any content managed that was already injected
  • If provided, replace all existing configuation in the hrq object with provided object
  • Track the page view
  • Inject any product recommendations that are configured to load on the new page
  • Execute all managed search configurations again
  • Execute all managed category pages again

When the script reloads it will look at the DOM to figure out what recoms should be injected. So it is important to call reload after the DOM changes that the visitors navigation triggered have completed.

You trigger a basic reload using by sending the reload command to the command queue:

hrq = window.hrq || [];
hrq.push([
    "reload"
]);

Overwriting existing hrq configuration

Optionally, you can provide a second object containing updated data when triggering the "reload" action. 

hrq = window.hrq || [];
hrq.push([
    "reload",
    {
        websiteUuid: "{{ website uuid }}"
    }
]);

This feature is particularly useful for SPAs that are forcing specific websites, where you are running multiple versions of the same website via Hello Retail. For instance, if your SPA enables users to switch between different regional versions of a website, such as from domain.com/dk to domain.com/sv, the UUID of the new site needs to be added as shown above, this way we can overwrite the previous.