How to Add a High-Impact Video Banner to Your Shopify Store

I'm a Shopify Expert with 9+ years in this (I don't mean that in an arrogant way). A homepage video banner is one of those things that looks premium when it works, and cheap when an app injects a player on top of Dawn.

Long story short, this section plays an mp4 inside your theme. Title, subtitle, two buttons, overlay, mobile video. No app, no extra JS from a third party.

If you just want the install steps, I also wrote a shorter video banner tutorial. This one covers the settings. Last tested on Dawn in 2026.

Want to see it first? Here's a live demo.

Works on Dawn, Sense, Craft, Spotlight, Taste, Refresh and most OS 2.0 themes. Download a backup of the theme first. If something breaks, you can roll back in about 10 seconds.

How to add it

1. From your Shopify admin, go to Online Store > Themes.
2. Find the theme you want to edit, click the 3 dots > Edit code.
3. Open the sections folder and click Add a new section. Name it exactly ezfy-video-banner. The file name and the section name have to match, otherwise Shopify won't load it.
4. Paste this code, then save. This is the whole section, schema included:
5. Click Save.
6. Click the 3 dots > Customize.
7. Click Add section and look for SJ Video Banner. Add it to the template you want.
8. Paste the desktop mp4 URL. Add a mobile mp4 if you have one.
9. Set title, buttons and overlay, then save.
10. Save the theme.

If you prefer Shopify's own editor docs, they cover Edit code here: Edit your theme code.

How to customize it

Paste an mp4 URL for desktop. Shopify Files works. You can add a second, smaller mp4 for mobile so phones don't download a huge file.

Add a title, a subtitle and up to two buttons. Autoplay is muted by default, which is what you want. If you turn autoplay off, style the play button so people can actually find it.

Overlay color and opacity keep the text readable over busy footage. Set height as a percent of the screen, pick an aspect ratio, and check mobile before you publish. A 16:9 clip on a phone often looks tiny. That's why the mobile video field exists.

Full width looks cinematic. A contained width looks more like a section in the page. Height as a viewport percent is the one I change most. 16:9, 21:9, 4:3, 1:1, 3:4 and 9:16 are all there. Preview both devices before you leave Customize.

If autoplay is off, the play button has its own color, background and size for desktop and mobile. Section margins are separate per device so it doesn't smash into the header.

If the banner doesn't show up

Check the section file name. It has to be ezfy-video-banner.

In Customize, look for SJ Video Banner.

Use a direct mp4 URL, not a YouTube page. YouTube links will not play in this section.

If autoplay does nothing, the file has to be muted. Browsers block unmuted autoplay.

If you get stuck, tell me which theme you're on. That usually solves it.