How to Add Video to a Shopify Homepage

Key takeaways

Adding video to your Shopify homepage can help potential customers get a better feel for your products and brand. 

• To add a video to your Shopify homepage, follow these steps after logging in and entering your admin panel: navigate to Settings, select an .mp4 or .mov video, and add it to the URL column on the Files page. Afterward, you’ll navigate to Themes from Sales channels to complete the process. 

• Plugins simplify the process of adding a video. However, many come with an added cost to consider when choosing your method. 

• You can create a customer HTML code while adding a video to your Shopify homepage or use a shortcut that doesn’t require any coding. 

Learn how to add video to your Shopify homepage to boost views and sales. Then, to continue building your skill set, consider enrolling in the Google Digital Marketing and E-commerce Professional Certificate. This beginner-friendly program can help you build and strengthen digital marketing skills to support your e-commerce store or a career in digital marketing. Upon completion, you’ll earn a credential to add to your resume and professional profile for an added boost. 

Why should you add video to Shopify?

When it comes to making online sales, one of the drawbacks of physical shopping is that customers can’t see the product in the same way. An image may not do the product justice or allow you to see it in action. Video is an effective tool that solves these issues and allows customers to get a feel for a brand and its values, which has been shown to improve conversions and sales.

Read more: E-Commerce Trends

How to add video to your Shopify homepage

Here is a brief look at the steps to add video to your Shopify homepage.

1. Log in to your Shopify account.

2. From the admin panel, go to Settings > Files.

3. Click Upload files, select a video, and click Open.

4. Add the video's URL to the URL column on the Files page.

5. Go to Sales channels > Online store > Themes.

6. Find your theme, and click Actions > Edit code.

7. Click Sections > Add new > and name it.

8. Paste the code into the text box and Save.

9. Click Sales channels > Online store > Themes > Customize.

10. Click Add section > Homepage video.

11. Save changes.

Let’s take a look at each step in more detail.

1. Log in to your Shopify account. 

Log in to your Shopify account like you usually do to view your shop or make edits.

2. Find the "File" section.

Find your admin panel, click on Settings, find the File tab, and select it.

3. Upload your video.

From the Files tab, click Upload file, which will create a pop-up. Select a video from the files on your computer and click Open. Shopify has an upload limit of 1 GB and a length of 10 minutes. You can upload .mp4 or .mov video types.

4. Copy the URL.

Copy the uploaded video’s URL from the URL column on the Files page. Paste the URL in a document or note that you can access later.

5. Find your theme.

Go to the Sales Channel tab and find your Online store. From here, go to the Themes tab.

6. Edit the theme.

On the Themes tab, scroll through to find your theme, click Actions, and then Edit theme.

7. Name your video.

Go to the Sections drop-down menu and click Add a new section. Give it a descriptive name, such as “homepagevideo.”

8. Add custom code.

When you create and name your video, a pop-up box appears. Remove the default code from the box, paste it into your custom HTML code, replace https://video.link.goes.here with your video link, and press Save.

Top tip

You can use the following code if you don’t know how to create custom HTML code:

<div class="section-homepage-video">

<video autoplay muted loop playsinline class="video-homepage">

<source src="https://video.link.goes.here" type="video/mp4">

</video>

</div>

{% schema %}

{

"name": "Homepage Video",

"class": "index-section index-section--flush",

"settings": [],

"presets": [{

"name": "Homepage Videos",

"category": "Text"

}]

}

{% endschema %}

{% stylesheet %}

.section-homepage-video{

width:100%;

}

.video-homepage{

width: 100%;

height: auto;

}

{% endstylesheet %}

{% javascript %}

{% endjavascript %}

9. Customize themes.

Click the Sales Channel tab, then click Online store and Themes, and Customize. 

10. Select your video.

From here, click Add section to show where you want the video to go, and select the video that you named earlier from the list. 

11. Save changes

Save your changes, and that’s it! Your video should autoplay on your homepage. 

Using a plugin

If you'd like to add video to your Shopify store more easily, you can use a plugin. However, the majority are not free, so consider whether the cost justifies the gains to your store.

360-degree images

An alternative to adding video to your Shopify homepage is using 360-degree images. Shopify supports this function through its Magic 360 app, which allows you to upload multiple product images. Customers can zoom in and out and view a product from any angle. 

Explore more free e-commerce and digital marketing resources

Whether you’re opening your first Shopify store or looking to begin or advance your digital marketing career, Career Chat, our weekly newsletter devoted to keeping you updated on emerging trends and technologies, can help. Or, you might consider checking out one of the following: 

• Do more with Shopify: How to Create a Shopify Exit Survey

• Watch a YouTube video: Digital Marketing for Beginners

• Bookmark a glossary: Digital Marketing Terms Every Marketer Should Know

Whether you want to develop a new skill, get comfortable with an in-demand technology, or advance your abilities, keep growing with a Coursera Plus subscription. You’ll get access to over 10,000 flexible courses.

Build job-ready skills with Coursera Plus

Start 7-day free trial

• 
• 
• 
• 

Start 7-day free trial