Shopify Guide

Shopify makes it easy to add custom HTML embeds to your store. Follow this guide to integrate Supascribe and start growing your newsletter audience.

Step-by-Step Guide

1. Get your embed code

First, you'll need to create and publish an embed in your Supascribe dashboard:

1. Log into your Supascribe dashboard at supascribe.com
2. Click "Create Embed" to start building your email capture form
3. Customize your embed with your style, colors, and messaging
4. Click "Publish Embed" to generate your unique embed code

After publishing, you'll see your embed code that looks like this:

<!-- Subscribe embed code -->
<div data-supascribe-embed-id="example" data-supascribe-subscribe></div>

<!-- Supascribe Script (Only add this to your site once) -->
<script src="https://js.supascribe.com/v1/loader/example.js" async>< script>

2. Copy your embed code

Copy the embed code that was generated when you published your embed:

We recommend adding the Supascribe Script immediately before your site's closing </body> tag or in your footer. This only needs to be added once to your site. If the script tag is already present, you do not need to add it again.

3. Add the embed to your Shopify store

Option A: Using Custom Liquid (Recommended)

1. Log into your Shopify admin dashboard
2. Go to Online Store > Themes
3. Click "Actions" > "Edit code" on your active theme
4. Navigate to the template where you want to add the embed (e.g., index.liquid, product.liquid)
5. Add the script tag to the before the closing </body> tag (only once)
6. Add the embed div where you want the form to appear
7. Save the changes

Option B: Using Theme Customizer

1. Go to Online Store > Themes > Customize
2. Add a new section or edit an existing one
3. Add a "Custom HTML" block if available
4. Paste your embed code into the HTML block
5. Save and publish the changes

Option C: Using Shopify Apps

1. Search for "Custom HTML" or "Code Injection" apps in the Shopify App Store
2. Install and configure the app
3. Add your embed code through the app's interface

Troubleshooting

Embed not showing up?

• Make sure you've added the script tag before the closing </body> tag
• Check that your embed ID is correct
• Try refreshing the page and clearing your browser cache
• Ensure the Liquid template is properly saved

Styling issues?

• The embed is fully customizable within your Supascribe Embed Dashboard
• Shopify themes may override embed styles - check your theme's CSS
• Test on different devices and screen sizes

Theme updates?

• Custom code may be lost during theme updates
• Consider using a theme app extension for more permanent solutions
• Keep a backup of your custom code

Need Help?

If you're stuck or need help implementing Supascribe on your Shopify store, feel free to reach out using our live chat or contact me directly.

[email protected]

0xGideon

Explore More Features