Implementing Yotpo Loyalty & Referrals Modules with Single Page Application (SPA)

Article Summary

Share feedback

Thanks for sharing your feedback!

SPA sites and similar setups create a fast and smooth user experience for your shoppers.

Since these setups are built on a single page that only loads once as the customer scrolls through, you’ll need to add a code snippet to Yotpo’s on-site modules so they can keep appearing as necessary even after the initial page load.
Possible use cases may include:

The customer moving across pages
The customer scrolling down a page that dynamically uploads specific elements only
You want the module to appear as a post-purchase popup

Implementing modules on-site

Please note:

This implementation requires the help of a developer.

The following loader code snippet must be added as it appears below with your Loyalty & Referrals modules.
```
<html>
    <head>
        
        <script type="text/javascript" async src="https://cdn-widgetsrepository.yotpo.com/v1/loader/<YOUR GUID GOES HERE>"></script>
    </head>
    <body>
        
    </body>
</html>
```
Make sure to replace the <YOUR GUID GOES HERE>section of the code with your account’s GUID.
To learn how to find your account’s GUID, click here.
Choose the module relevant to you and follow the existing module setup guide.
To see the full list of guides, click here.
Each time a new div element is added to the page, call the following function in order to display the module.
```
yotpoWidgetsContainer.initWidgets()
```
This function will render all the modules that exist on the page and show them on-site once again.

Was this article helpful?

What's Next

Updating Your Module's Version

In this article

Implementing modules on-site

Implementing Yotpo Loyalty & Referrals Modules with Single Page Application (SPA)

Supported plans

eCommerce Platform

Implementing modules on-site

What's Next

PRODUCT

RESOURCES

PARTNERSHIPS

COMPANY

SUPPORT