Implementing Yotpo Loyalty & Referrals Modules with Single Page Application (SPA)
- DarkLight
Implementing Yotpo Loyalty & Referrals Modules with Single Page Application (SPA)
- DarkLight
Article summary
Did you find this summary helpful?
Thank you for 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.
Make sure to replace the <YOUR GUID GOES HERE>section of the code with your account’s GUID.<html> <head> <!-- rest of your js/css includes --> <script type="text/javascript" async src="https://cdn-widgetsrepository.yotpo.com/v1/loader/<YOUR GUID GOES HERE>"></script> </head> <body> </body> </html>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.
This function will render all the modules that exist on the page and show them on-site once again.yotpoWidgetsContainer.initWidgets()
Was this article helpful?
