Are you looking to make your Shopify product videos more engaging? Looping your videos is an option. A looping video can showcase all its features without your customers having to hit play repeatedly. Let’s find out how to do it.
Important Browser Note: Modern browsers (Chrome, Safari, Firefox, Edge) only allow muted videos to autoplay. Videos with sound require user interaction to play. This guide will show you how to set up muted autoplay with loop functionality that works across all devices.
How to turn on looping videos in Shopify
There are two options for Shopify owners.
Option 1: If your theme supports
Most Shopify 2.0 themes, including Dawn, do not include built-in loop settings in the theme customizer. However, some premium themes may offer this feature. Here’s how to check:
- Log in to your Shopify admin.
- Go to Online Store > Themes.
- Click Customize next to your current theme to open the theme editor.
- In the editor, go to your Product page.
- If your theme has a video block or a media section, click on it.
- Look for settings like Autoplay or Loop. If the option is there, just turn it on.
- Hit Save when you’re done.
If you don’t see a loop option (which is common), don’t worry. You can still make it work with the code method below.
Option 2: Add looping with a small code edit
This method works for any Shopify theme and gives you full control over video behavior.
Important Safety Note: Before making any code changes, duplicate your theme to avoid affecting your live site.
Then, follow this instruction:
- From your Shopify admin, go to Online Store > Themes.
- Click Actions > Edit code next to your current theme.
- Find the file that controls your product media. Common locations include:
sections/main-product.liquid
(Dawn theme)sections/product.liquid
sections/product-template.liquid
(older themes)snippets/product-media.liquid
templates/product.liquid
- Look for existing video tags. They might look like this:
{{ media | video_tag: controls: true }}
or
<video controls>
<source src="{{ media.sources[1].url }}" type="video/mp4">
</video>
Replace the video tag with this enhanced version:
For Liquid video_tag (Recommended):
{{ media | video_tag: autoplay: true, loop: true, muted: true, playsinline: true, controls: true }}
For HTML video tag:
<video autoplay loop muted playsinline controls>
<source src="{{ media.sources[1].url }}" type="video/mp4">
Your browser does not support the video tag.
</video>
Understanding the attributes:
- autoplay: Starts video automatically (only works when muted)
- loop: Repeats video continuously
- muted: Required for autoplay to work in modern browsers
- playsinline: Prevents fullscreen on mobile devices (essential for iOS)
- controls: Shows play/pause/volume controls for user interaction
Now your product videos will play automatically and loop without the customer having to interact.
Conclusion
Setting up your Shopify product videos to loop is a simple yet effective way to showcase your products. It keeps your customers engaged and gives them a better view of what you’re selling. By following these easy steps, you can have your videos playing on repeat in no time.