How to Make Video Autoplay in Shopify?

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
How to Make Video Autoplay in Shopify?

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.


Go to Source of this post
Author Of this post: Rahul Sharma
Title Of post: How to Make Video Autoplay in Shopify?
Author Link: {authorlink}