Install SmartVideo on Shopify

Install the SmartVideo snippet in your storefront’s <head>, then add your videos. Choose either the app method or the theme-code method below, not both.

Get your SmartVideo snippet

Open the Configuration tab in your Swarmify dashboard, follow the on-screen instructions, and copy the snippet.

If you use the example below, replace YOUR_SWARM_CDN_KEY with your Swarm CDN Key from the dashboard. Keep the configuration script before the loader script.

<script data-cfasync="false">
    var swarmoptions = {
        swarmcdnkey: "YOUR_SWARM_CDN_KEY",
        iframeReplacement: "iframe",
        autoreplace: {
            youtube: true
        }
    };
</script>
<script async data-cfasync="false" src="https://assets.swarmcdn.com/swarmcdn.js"></script>

The YouTube setting is preserved in this standard snippet, but YouTube conversion is best-effort. For reliable playback, upload your video to the SmartVideo Library instead.

Install with an app

1. Install XO Insert Code from the Shopify App Store and open it in your Shopify admin.
2. From the app’s Insert code page, click Add new code. Enter Swarmify as the Title, set the code to run on all pages (or at least every page that will show a video), and paste the complete SmartVideo snippet into the header code field. Enable the code and save.
3. In your Shopify theme editor, click App embeds, turn on XO Insert code Header, then save the theme.

Follow the app developer’s current code-entry instructions and app-embed setup.

Install by editing theme code

If you prefer not to use an app, follow Shopify’s theme-code instructions. Duplicate your theme before editing it. A trial version of a paid theme must be purchased before you can edit its code.

1. From your Shopify admin, go to Online Store.
2. Find the theme you want to edit, open its … actions menu, and click Edit code.
3. In the Layout folder, open theme.liquid.
4. Paste the complete SmartVideo snippet on a new line immediately before </head>. Do not remove the existing theme code.
5. Click Save.

If you edited an unpublished theme, preview that theme to check the installation before publishing it. After a theme update or a switch to another theme, check that the snippet is still present.

Add your first video

Installing the snippet does not place a new video on the page. Follow the SmartVideo Library guide to upload a video, open its Media Details page, and copy the ready-to-use SmartVideo tag for your storefront.

To choose where the video appears:

1. From your Shopify admin, go to Online Store and click Edit theme beside your theme.
2. Use the Home page drop-down menu to select the template you want to edit.
3. Click Add section, and choose a section that accepts custom HTML or Liquid if your theme provides one. Paste your video code there and click Save.

Available sections and blocks depend on your theme and its version. If yours has no suitable place for custom code, ask your theme developer to add the video markup. See Shopify’s sections and blocks instructions.

Check playback

Open the storefront page containing your video and check that it plays in SmartVideo. A video usually takes about as long as it runs to convert, and longer when our encoders are busy.

If the player is missing or the video does not play, see How do I know SmartVideo is working? and the video troubleshooting guide.

If you need help installing, email support@swarmify.com and include the storefront page URL.

Evaluating SmartVideo for Shopify? See the Shopify video hosting overview.