NEW: Before reading this documentation make sure you check our video tutorial for our new "Word of Mouth Sales" Story that is specifically created for Shopify stores. This way you'll get a more seamless integration with the referral widgets, plus you'll skip the Javascript code installation:

After you create your campaign in Viral Loops using The Milestone Referral template, from your home page on Shopify, you select "Online store":

and then you select "Pages":

Then, you select "Add Page".

After that, you should set a title for your page and on the content area, you select the top right button "Show HTML":

There, you add the Snippets of the Frorm Widget:
<div data-vl-widget="embedForm"></div>
the Milestone's Widget:
<div data-vl-widget="milestoneWidget"></div>
and the Referral's Count Widget:
<div data-vl-widget="referralCountWidget"></div> 

After that procedure, still on the same place, you add your campaign's Snippet:

<script>!function(){var a=window.VL=window.VL||{};return a.instances=a.instances||{},a.invoked?void(window.console&&console.error&&console.error("VL snippet loaded twice.")):(a.invoked=!0,void(a.load=function(b,c,d){var e={};e.publicToken=b,e.config=c||{};var f=document.createElement("script");f.type="text/javascript","vrlps-js",f.defer=!0,f.src="";var g=document.getElementsByTagName("script")[0];return g.parentNode.insertBefore(f,g),f.onload=function(){a.setup(e),a.instances[b]=e},e.identify=e.identify||function(a,b){e.afterLoad={identify:{userData:a,cb:b}}},e.pendingEvents=[],e.track=e.track||function(a,b){e.pendingEvents.push({event:a,cb:b})},e.pendingHooks=[],e.addHook=e.addHook||function(a,b){e.pendingHooks.push({name:a,cb:b})},e.$=e.$||function(a){e.pendingHooks.push({name:"ready",cb:a})},e}))}();var campaign=VL.load("YOUR_CAMPAIGN_ID",{autoLoadWidgets:!0});</script> 

(Make sure to replace YOUR_CAMPAIGN_ID with your campaign ID that you can find in the Installation step of your Campaign Wizard.)

Like so:

Finally, on the right corner, select the template where you want to add your campaign, select "Save" and you're ready!

Did this article help you? Let us know!

Did this answer your question?