Shopify video banner: add a looping video made with AI

A Shopify video banner is a video in a theme section on your home page. Upload the MP4 to Files, pick it in the theme editor, and make the loop with AI.

5 min readSume
All posts

A Shopify video banner is a video shown in a theme section, most often at the top of your home page. To add one, upload the MP4 to Content > Files, then open the theme editor, add or pick a section that has a video setting, and select the file. Whether the banner autoplays, loops, or plays muted is decided by that section's settings and code, not by the file.

Shopify's steps and settings come from its Help Center and developer pages listed under Sources, read on 2026-09-28. The AI part uses Sume's Video generation docs.

How do I add a video banner in Shopify?

  • From your Shopify admin, go to Content > Files, click Upload files, and select the video. You can pick up to 20 files at once.
  • Go to Online Store, find your theme, and click Edit theme. You start on the home page; the Home page drop-down menu switches templates.
  • In the sidebar, click Add section and choose a section with a video setting, or click an existing one. Section names differ between themes.
  • In the section's video setting, pick your file. Shopify's theme docs say a video setting is a picker filled with the videos in Files, and you can upload a new one from it.
  • Click Save.

Can a Shopify video banner autoplay and loop?

Only if the section offers it. Shopify's video_tag Liquid filter, which outputs an HTML <video> tag for a Shopify-hosted video, supports all HTML5 video attributes. If your section's settings have no autoplay or loop switch, a developer can pass these attributes in the section's code:

From Shopify's video_tag filter reference, read 2026-09-28.
AttributeWhat Shopify says it doesValues
autoplayPlays the video after it's loadedtrue, false
loopLoops the videotrue, false
mutedMutes the video's audiotrue, false
controlsLets the user control playbacktrue, false
loadingLazy-loads the video, or notlazy, eager

Should a banner video be lazy-loaded or streamed?

Shopify's reference answers both for developers. Without a loading value, video_tag lazy-loads videos in sections further down the page, and Shopify advises against lazy-loading videos above the fold, which is where a banner sits. For uploaded MP4s Shopify also makes an HLS stream, but when loop is on, the HLS source isn't used, so the looping banner downloads as a file.

How do I make a looping banner video with AI?

Start from one wide still, such as your hero product shot, and generate a short image-to-video clip that begins and ends on it. With Sume's POST /v1/videos, send the still twice in frame_images, once as first_frame and once as last_frame, on a model whose supported_frame_images lists both. The full request and the loop check are in Seamless loop AI video.

  • Set aspect_ratio to 16:9 for a wide banner; each model lists what it accepts in supported_aspect_ratios.
  • Send generate_audio: false when the banner will play muted anyway.
  • Keep it short: most catalog models top out at 15 seconds, and a loop repeats it.
  • Download the finished MP4 with your API key, then upload it to Files as above.

What are the limits?

On Shopify's side, a video file in Files can be MOV, MP4, or WEBM, up to 1 GB, 10 minutes, and UHD resolution, and at least 0.25 seconds long. Shopify recommends 16:9 among its aspect ratios and H.264 video. On Sume's side, you choose aspect_ratio and resolution, not exact pixels: size returns 400 unsupported_parameter on every model.

Sources

Related posts

More in Use cases

All Use cases posts

Written by Sume