How To Add a Video on Shopify Homepage (2024) Step by Step

What is up, everybody? Welcome to this new video of Techpress. I'm Stephen, and I'm going to be showing you how to add a video into your Shopify

There's actually a couple of ways that we can do this, and I'm going to be showing you a few steps

and ways that we can do this in different platforms and different scenarios

So the very first thing you wanted to do, if you have an account, if you have a website created, but you have nothing set up yet, for example, you need to add a product

you need to customize your online store, add a custom domain, set up your Shopify payments, you don't have to worry about that

let's focus into... I love to get started with the actual branding of my actual website so that later on I don't need to feel like I need to do a lot of things in order to get started

So I love to go first into settings, and then what I do is to focus into the brand section

So once I'm here into the brand section, as you can see here, we have the preview of how it's going to be looking, the default section of my logos

the colors, the cover images, the square, all of the actual website is going to be appearing here

So that's the reason why I wanted to... I love to get started here into the brand section first

So for example, it says logos, and here I'm going to get started with uploading my own elements of my actual branding

So in my case, I do have everything now here into my actual computer, so I'm going to start by adding my logos

I love to have some PNG files, so PNG files does not have any information about backgrounds, so it's going to be looking like this, like really, really easy to add

I have this square one, I'm going to use the same one, there we go. So adding videos is something that needs to be inside a customizable step of my website, so let's go into the X Mark, let's focus into the online store, into the pod

And here I have themes, blog, pages, navigation, and preference. So first of all, you want to figure out where do you want to add your video

So let's say for example you want to add a blog, and inside that blog you want to add a video, or you want to add just a video for your actual header of a product

or you want to add a video of a product inside the product section, so it's totally depending on where you want to add your video

So let's focus into the down, as you can see we have an actual theme, and this is how it's going to be looking my website, this is, of course

this appears that there's actually nothing here because we have just getting started

So let's focus into customize, and here into customize, now I have the editor section of the Shopify inside my actual store

and I have browse our latest product, shop all, I have my featured product, the subscribe to our email, this is a template that I choose to use into my actual website

so I can start to adding some videos. Now into the web part we have the homepage, I have the header, I have the template, and we have the footer

So this template has an image banner, has a featured collection, and I believe that is it

If I want to add more stuff, I can go into the add section, and here I can type new section, for example, let's say that I want to add a video

and here I have this video section, so I click them, and this section is going to be taking me here into video

So if I click now into this block, here I have the heading, the heading size, the Shopify hosted video, or the in-beam video from the URL

here's my URL, of course, use a YouTube for video URL. I have now the video all text, the style, the section padding, the themes, and the custom TSS

So I'm going to scroll into the web part, and focus into the video, and here what I wanted to do is to delete the video

and let's go for this is my product video demo, heading size, let's go and look out for something a little bit more larger, there it is

Now, play video on the loop, since I am going to be uploading a demo of a product, and I have the Shopify hosted video

so I can choose select video, and I can drag and drop the video, download it from my computer, or I can choose an in-beam video from URL

So, whether you want to choose a video from YouTube, or from Vimeo, I can totally suggest you to create an account into YouTube

and of course, this is not our video, this is just for adding our video to the demonstration of this website

and let's say that I upload this video as unlisted. So, I copy my YouTube video, and I have this URL, so I delete this URL, I paste my link

and here's the introducing the Lebron 17 Nike, of course, this is something that is not from us, but this is just an example

Now, I have the cover images, I wanted to choose explore free image, and I wanted to look out for Nike

and the result found, so I am going to go and open a new tab, and look out for Nike Lebron 17

and what I want to do is to look out for an image that is the accurate one for my actual product

In my case, I am going to be focusing into this one, I copy the image address, like this

I go back into my Shopify, hit into the X mark, and I select the image, and I hit now the image that I have just added

So the video alternative text is going to be helping me just to describe the video for customers that need to have screen readers

so I am going to just type this is my main product, and I have the style, male, section, full width

I have the background, you can change that color if you wanted to, you can change this later on, I am going to be showing you how to do this later

but this is how I am going to be looking my actual product. So if you wanted the product to just start right up, like you just go and scroll all the way down

I am going to go and scroll and it says play video on the loop, hit into save

and then later on, I want to go into the preview, so I am going to be taking into just a sneak peek of how it is going to be looking

this website section. So as you can see, here is my Shopify, I don't have anything here added

but I am going to scroll all the way down, and I needed to hit into the play mark button

the play mark, so I can see the full width section of the video

So what I want to do is to actually get started with the video looking like this

so I can delete this part, I can go and scroll all the way down

and instead of choosing a cover image, I just want to go into change, remove the image

it's going to be looking much, much better, and here is my actual product

and I have now the logo of YouTube, so people can understand this is an actual video

and they just hit into the part that they actually wanted to see, and then we are actually good to go

Now, if I wanted to add this video into my actual product, I need to do this back directly from my actual product

If I hit into products, I'm going to hit now into add your products

and let's say that I wanted to just add this title of Lebron Nike, as you can see

now I have the insert video type, so insert a video by pasting the inbeamed snippet into the box below

this is why I suggested you to use the YouTube, because they do have

the inbeamed code, so I have this here inbeamed, and here's the inbeamed video, start add

I'm going to look out for the second where I see my product, which in my case is

105, so let's go for 105, show player controls, I disable this and now player controls

show enable privacy engagement mode, and I hit now into copy, so I copy the link here, I paste it

and I insert my video. So this is just a description, and if I hit into play, it's going to be

going directly from the part where I wanted to get started with

and I didn't have to show the play controls, so that's the reason why I use that, I can use a URL

of course, the same thing, but I wanted to do now the actual link of the

product, I paste it here, and I hit into add the file, and here is the media. So let's say that this is

just something really easy to use, the actual price, I hit into save, and my

product should now be added automatically, so let's focus now into once again the online store, hit into the customize, and take a

look into how it's going to be looking into my featured products, which is I believe

down in here. So I just type into view once again, I go directly into my product, which is this one, I click the

play button, and here into the description, I have the same stuff

here, without the play buttons. It's going to be looking really, really good. So with that being said, guys, I think we have now

covered the basics of how we can get started with some videos here into Shopify

hopefully it was very useful for you, and well guys, with that being said, I'll see you

next time, and have lots of fun. See you soon