This is an advanced integration so be careful. Normally, on Viral Loops for Shopify, you don't need to add the Referral Page manually, it is created automatically when you install the Viral Loops app.
If you need to add the Referral Page in your store, edit the page where you want to add it and copy-paste in it this HTML code:
<style><!--
.main-content .page-width{padding-left:1px;padding-right:1px;max-width:unset;}
--></style><iframe id="vl_iframe" style="min-width: 100vw; height: 100%; margin: 0; margin-left: -50vw; left: 50%; position: relative;" src="https://app.viral-loops.com/shopify/YOUR_STORE_NAME" allowfullscreen="" frameborder="0"></iframe><script type="text/javascript">// <![CDATA[
var frameWindow=document.getElementById('vl_iframe').contentWindow;var eventMethod=window.addEventListener?'addEventListener':'attachEvent';var eventer=window[eventMethod];var messageEvent=eventMethod=='attachEvent'?'onmessage':'message';eventer(messageEvent,function(e){if(e.data&&e.data.action==='vl_height'&&e.data.height){document.getElementById('vl_iframe').style.height=e.data.height+'px'}else if(e.data&&e.data.action==='vl_request_user'){sendUser();sendReferrer()}},!1);function sendUser(){if(!window.campaign){setTimeout(sendUser,200)}else if(!window.campaign.runStage||window.campaign.runStage==='preIdentify'){window.campaign.addHook('stageChange',sendUser)}else if(window.campaign.runStage==='postIdentify'){frameWindow.postMessage({action:'vl_user',campaign:{user:window.campaign.user}},'*')}};function sendReferrer(){if(!window.campaign||!window.campaign.referrer){setTimeout(sendReferrer,200)}else{frameWindow.postMessage({action:'vl_referrer',campaign:{referrer:window.campaign.referrer}},'*')}};window.logoutVL=function(){if(window.campaign){campaign.logout({callback:function(){frameWindow.postMessage({action:'vl_logout'},'*')}})}};
// ]]></script>
Now go back in the script you pasted and edit this URL to include the name of your store:
https://app.viral-loops.com/shopify/YOUR_STORE_NAME
So if your store domain is the-loopdog.myshopify.com
then the URL will be:
https://app.viral-loops.com/shopify/the-loopdog
And that's it. Save and publish your page and the Referral Page will appear in it.
Do you have any more questions? Let us know!