How can I add a "floating button" to my store that displays my referral program?

Often, stores will add a "floating button" that appears in the lower left side of the browser window that directs their customers to their referral program. Using Shopify's new "App embeds" feature, you can now add a "floating button" without any technical knowledge or theme editing required.

First, ensure you have created a campaign in Conjured Referrals.

Then, head to your theme's Customize section in Shopify. Click the "Theme settings" button at the bottom of the left column, and then click "App embeds" at the top of the right column. You should see the "Floating Buttton" option under the App Embeds heading, similar to below:

Enable the App embed and enter text for your button. You'll then need to decide whether you want the button to open your referral program as a popup, or simply behave as a link to your referral program's custom landing page.

If you choose to open the referral program as a popup, you'll need to specify your campaign's ID. To find your campaign ID, open the campaign in Conjured and check the URL bar. You should see a number at the end of the URL, before the "?" - that's your campaign ID. For example, in the screenshot below, the campaign ID is 20. 

If you choose to open the referral program as a link, you'll need to specify what link you want that button to direct to. Use the input to either enter your URL directly, or navigate to the landing page where you've added your referral program.

Finally, if you want to add any additional custom CSS to modify the button, you can do so in the Custom CSS field. You can use the button's id, "show_conjured_modal", as a selector. So for example, to change the font size of the button, you could add:

#show_conjured_modal {
  font-size: 30px;
}