Add shareable codes to smart links (Non-Shopify / Shopify Headless)

roster's tracking pixel includes an event system that lets brands subscribe to javascript callbacks when a discount code is retrieved from an ambassador's referral link this is for headless shopify stores and non shopify brands that need to apply discount codes through their own cart or session mechanism if you're a standard shopify store, roster applies discount codes automatically see instead how it works when a customer clicks an ambassador's referral link, they land on the brand's storefront where roster's tracking pixel fires on page load the pixel calls roster's shareable endpoint to retrieve the ambassador's discount code associated with that referral link (if one has been assigned to the ambassador ) if a code is returned, the pixel fires the oncoderetrieved callback on the window\ rstr object the brand's storefront code receives the discount code in the callback and applies it through their own cart mechanism — for example, by injecting it into a session, adding it to a cart api request, or pre populating a discount field integration steps edit an existing smart link in the brand portal, navigate to settings for the desired program open the referrals tab locate the existing smart link and click edit see docid\ ambvb at8xje4wy49t9pe for more details on setting up smart links enable shareable codes as the discount open the customer discount section select shareable codes confirm that the program level shareable discount code is displayed (e g , friends and family 15% off) click save see docid\ nu vi 2ka5la8n gukd7g for more details on shareable discount codes define your event callbacks on the storefront source code where you install the roster tracking pixel, define window\ rstr with callback functions before the roster pixel loadds this object tells the pixel what to do when a discount code is retrieved or when an error occurs add the following script block to your storefront's global template \<script type="text/javascript"> window\ rstr = { oncoderetrieved function(discountcode) { console log('discount code retrieved ', discountcode); // replace this with your own logic to apply the code to the cart }, onerror function(error) { console error('roster pixel error ', error); } }; \</script> this script block must appear before the roster pixel script tag in your html if it appears after, the callbacks will not be registered when the pixel fires include the pixel script tag add the roster tracking pixel script tag immediately after the window\ rstr script block the fetch shareable code=true parameter is required to enable the event system \<script async type="application/javascript" src="https //sa getroster com/sa js?token=access token\&fetch shareable code=true">\</script> replace access token with your public access token see in the generic tracking pixel instructions if you don't have one yet test the integration copy an ambassador's referral link from roster — choose an ambassador who has a shareable or leakproof code assigned open the referral link in a new browser tab on your storefront open the browser's developer console ( f12 or cmd+option+i ) verify that discount code retrieved ambassador code appears in the console output, where ambassador code is the ambassador's actual discount code a downloadable interactive testing tool is available to test the pixel event system independently of your storefront event reference callback signature description oncoderetrieved function(discountcode) called when a discount code is successfully returned from roster's shareable endpoint discountcode is a string containing the code to apply onerror function(error) called when an error occurs during the shareable endpoint request error is a string describing what went wrong need help? if you have any questions about integrating roster's pixel event system, contact us at mailto\ support\@getroster com details coming soon