Autoplay Video

How to Make Video Autoplay in Shopify?

Did you faced any problem while integrating autoplay video in Shopify Stores? Here is the bottom line on autoplaying video in Shopify themes.

Let’s Get Started.

How to Upload Video in Shopify?

  1. Login to Shopify Store
  2. Go to Settings
  3. Click on Files Sections
  4. Upload Video and Copy Link
Upload Files

Next click on theme settings and find video section. Expand the section and paste video link. Click to see screenshot.

MP4 FILE

Hit Save.

How to Use Better Video?

Audio and video can be a easiest way to engage customers, tell your story and even increase conversion rates, but recent trends by the companies that develop browsers that made it more difficult to use video and audio in your Shopify theme — especially if you want it to autoplay.

Nearly all of the major browsers — Chrome, Firefox, Edge and Safari — have at least some limitations on video, particularly video with audio, that prevents it from autoplaying and the restrictions tend to become even more strict on tablets and smartphones.

Almost all popular Web browsers have an option, whether natively built in or available via a plugin or add on, to block autoplaying video and audio based on the user’s preferences.

This can be done globally — that is the browser might be instructed to block all instances of video from starting automatically. It’s also possible to block this feature on a per site basis or the browser might leverage machine learning and a user’s browsing history to determine if an audio or video file should automatically play or not.

We won’t get into the nuances of which browser does what, not only because it changes all the time, but because there are typically so many variables that it’s difficult to outline hard and fast rules.

It’s also important to note that autoplaying rules are most likely to change — and probably get stricter as time go on — so preparing yourself now with these tips will be a good step toward making your site ready for down the road.

How to Make Video Autoplay in Shopify?

After video embedded in your video section. You have to do some code modifications in theme to make your video autoplay.

Here is the Script that works well.

App Js Liquid

Place the following code in app.js.liquid. Click here to see Screenshot.

After this open include-video.liquid

Video LIquid

Place the following code in include-video.liquid.
Click here to see Screenshot.

That’s It.

Note:  This method is only working with video hosted on Shopify CDN along with Mp4 format.  

If you are not a professional coder don’t try this on your own. This method can be only implemented by developers. Failing that, there are some Shopify Experts that specialize in smaller, theme-related tasks from Kit Shopify that you can check out. Looking for help with Shopify Store Design and Development? Hire Expert Shopify Developers from Kit Shopify.  

If you have any question let us know in comment section.

Hire Shopify Experts Shopify Customisation Shopify Development

Rahul Sharma

Rahul Sharma is a Founder of Logical IDEA and Bee Flirty. He is a Professional WP Developers, UX Designer, and Digital Marketing Expert. Previously, He Worked as a Digital Marketing Head for An eCommerce Startup. He Graduated with honors from Lovely Professional University with a Dual Degree in Information Technology.

215 comments

Leave a Reply

Your email address will not be published. Required fields are marked *

Related Posts