Would you like to set up an unlimited number of substores for your brand ambassadors and easily pay them based on their referral efforts?
Do your clients want to see the name of the affiliate, consultant, stylist, distributor or representative they are shopping with when they place an order?
You can now easily personalize the shopping experience in Shopify stores with Shoutout's customized announcement bar feature.
Popular with businesses in the direct selling industry, you can now set affiliate links to trigger personalized welcome bars when customers visit your store.
These personalized experiences help your affiliates maintain their following, boost earnings, and can powerfully build your business.
Setup Instructions
To add the referring affiliate's name to your store you will need to be familiar with adding a couple of minor code snippets to your Shopify theme. This is an advanced subject, so you may wish to pass these details onto your developer, or read through first to fully understand the process.
Announcement Bar
If you're wanting to add the affiliate's name into a top announcement bar that appears on pages throughout your store, you will need to be using a theme that includes the option to include an announcement bar.
See Shopify help for more information on how to activate this here.
If your theme doesn't include an announcement bar, there are a number of Apps on the Shopify App Store that may be installed to add this option.
Add Code
Once your announcement bar is activated, or you've decided where in your store you'd like to show the referring affiliates name, you can then add the code below.
Go to: Shopify Admin > Online Store > Themes > Actions > Edit Code
Add the following line between the
... section of the theme.liquid file:<script type="text/javascript" src="https://www.shoutout.global/js/shopping-with.min.js"></script>Press SAVE
Show the Name
If you've decided to add the affiliate's name to an announcement bar, locate and view the header.liquid file. It's usually under the Sections area.
Add the following code into your page under the Announcement bar code:
<script>getAffiliateName("p", function (Affiliate_Name) {if (Affiliate_Name != '') {document.getElementById("shoppingWith").innerHTML = "You're shopping with " + Affiliate_Name;};});</script>
The only remaining thing to do is decide where to show the name. Add the following code to have your message and name appear on the page at the location you wish:
<span id="shoppingWith"></span>
As an example, if you've wanting to show the name in the announcement bar add the code as follows:
Additional Help
We hope you find the above information helpful. As always our team is here to assist if you have any problems or concerns, as are the Shopify Help Centre if you're needing further support.