How to add a video on my homepage without YouTube info

[Sofi_txu]

I want to add a video on my store's homepage but don't want any of the Youtube info (logo, title, bottom bar etc.) to appear in it. I've tried to edit the embed url I get from YouTube using rel=0 modestbranding=1 showinfo=0 etc. but nothing seems to work.

The other option I have is to upload the HTML5 MP4 file URL but this seems even harder. 

I'm not very familiar with coding.

Any help would be MUCH appreciated! 

[sarhov]

Well, at first let us know which theme you're using ?

Also, how you are currently adding youtube video, via theme settings, for direct inserting it in theme files ?

[Sofi_txu]

Hello I'm using the TURBO theme.

To post videos, I used to create a page and then add the embed Youtube url. I've never tried to edit the code before. 

[sarhov]

So, you are switching into HTML mode in page dashboard and put the emmbed code from youtube  ?

[Sofi_txu]

Yes, this is what I wanted to do, but since I have trouble removing the Youtube logos etc. from the embed url, I thought that maybe there is another way.

I would like my video to look like the one in the homepage of Vita Fede

No logos, no bars, no play buttons, just the video itself. What's the best way to proceed? I've seen that the video used in this case was from Vimeo.  

[hannasmith91]

Did you find a solution to this? I have the same problem!!!

[sarhov]

@Sofi_txu 

Well for that you need HTML5 video to be emmbed, so at first you should upload video files into files section, .webm and .mp4 formats, then again switch into HTML mode and past its code, of course don't forget to change urls to yours one (which you have already upload into files section).

<video loop="" muted="" autoplay="autoplay" preload="" id="vid">
    <source src="url_of_the_file.webm" type="video/webm">
    <source src="url_of_the_file.mp4" type="video/mp4">
  </video>

[OldSchoolBeauly]

That is brilliant - I have just added an autoplay video to our homepage: https://oldschoolbeauly.com/

But on the mobile it is showing a black box with the play button etc...

Is there a way of getting it to auto-play on mobile??

I am using the Focal theme

[JigneshKumar]

where to put

<video loop="" muted="" autoplay="autoplay" preload="" id="vid">
    <source src="url_of_the_file.webm" type="video/webm">
    <source src="url_of_the_file.mp4" type="video/mp4">
  </video>

code?

[JigneshKumar]

i have somehow fit this into desktop view, but in mobile & tablets - it is going out of proportion.

can you please help

[Chris_Jay]

Hi, where do you put  this code. I am stuck not knowing, thanks

[SasaMcmc]

Thank you so much this is so easy to implement with my Fastor theme Im so happy! 😄 YOU MADE MY DAY :D. If you have any further advice about how to change the size of the video it would be much appreciated. Currently it takes up the whole page and appears on mobile but not restrained to fit. Im about to start researching this now 😉 Thanks Again!

[MS-WEB-DESIGNER]

Dear Sofi_txu,

Hope this will help you: https://www.huratips.com/tech-tips/how-to-add-a-video-section-to-your-shopify-home-page.html

[Sunwaves]

Online Store > action > edit code >templates > index.liquid 

[Sunwaves]

ad <center> </center> before and after the <video> section. Add width parameter as a green word( width=90%80/70% find your best)

[SasaMcmc]

Thanks will try it now 👍👍👍

[SasaMcmc]

Ok, I found index.liquid but no joy with a video section, anywhere apparently?

[realShughart]

It's honestly ridiculous how shopify states to be such simple shop, jet many themes aren't working correctly and you can not use many of the simplest functions.

[Alignment]

Adding "width = 100%" like this worked for me, I hope it works for you!

<video loop="loop" muted="" autoplay="autoplay" preload="" id="vid" width =100%>
<source src="https://cdn.shopify.com/s/files..." type="video/mp4"></video>

[Jingle]

How can I put the video at the top? I was able to edit code in the templates index.liquid but it playing at the bottom of the page. Help!