add a video on my homepage (without youtube)

Solved
choosemishop
Tourist
7 1 0

Hello, I would like to add a video on my homepage. I created a new section and the video appears on my homepage but I want to center because it appears on the left. 

 

Here is the code I added : 

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

 <video loop="" muted="" autoplay="autoplay" preload="" id="vid">

    <source src="https://cdn.shopify.com/s/files/1/0085/2325/1830/files/NEWVI.mp4?573" type="video/webm">

    <source src="https://cdn.shopify.com/s/files/1/0085/2325/1830/files/NEWVI.mp4?573" type="video/mp4">

  </video>

 

</div>

{% schema %}

{

"name": "Section name",

"settings": []

}

{% endschema %}

 

{% stylesheet %}

.section-hura-video{

  width:100%;

}

.hurabg-video{

  right: 0;

  bottom: 0;

  width: 100%;

  height: auto;

}

{% endstylesheet %}

{% javascript %}

{% endjavascript %}

 

Can you please help me to center the video ? Thank you

0 Likes

Hello @choosemishop,

Please share your site url so that I will give you exact solution

If helpful then please Like and Accept Solution. Free Website Review and advice for sale from Hire us
Shopify Conversion Experts | Shopify Private App | Custom Theme Development | Custom Modifications In To Shopify Theme | Shopify SEO | Digital Marketing | Site Speed Optimization | Performance Site Audit
For Quick Chat Whats app | Email: pallavi@oscprofessionals.com | Skype : oscprofessionals-87
0 Likes
Hello choosemishop,
Please share your site url so that I can check and let you know exact solution here.
If helpful then please Like and Accept Solution. Free Website Review and advice for sale from Hire us
Shopify Conversion Experts | Shopify Private App | Custom Theme Development | Custom Modifications In To Shopify Theme | Shopify SEO | Digital Marketing | Site Speed Optimization | Performance Site Audit
For Quick Chat Whats app | Email: pallavi@oscprofessionals.com | Skype : oscprofessionals-87
0 Likes
choosemishop
Tourist
7 1 0
Here is my website : www.choosemi.net thank you
0 Likes
choosemishop
Tourist
7 1 0

Here is my website : choosemi.net

thank you

0 Likes

Hello,

I am unable to see video on your site

If helpful then please Like and Accept Solution. Free Website Review and advice for sale from Hire us
Shopify Conversion Experts | Shopify Private App | Custom Theme Development | Custom Modifications In To Shopify Theme | Shopify SEO | Digital Marketing | Site Speed Optimization | Performance Site Audit
For Quick Chat Whats app | Email: pallavi@oscprofessionals.com | Skype : oscprofessionals-87
0 Likes
choosemishop
Tourist
7 1 0

Can you see it now?

0 Likes

This is an accepted solution.

@choosemishop,

Yes,

1. Go to Online Store->Theme->Edit code
2. Asset->theme.scss.liquid->paste bellow code in bottom of file

#shopify-section-index-hura-video .section-hura-video {
	text-align: center;
}
If helpful then please Like and Accept Solution. Free Website Review and advice for sale from Hire us
Shopify Conversion Experts | Shopify Private App | Custom Theme Development | Custom Modifications In To Shopify Theme | Shopify SEO | Digital Marketing | Site Speed Optimization | Performance Site Audit
For Quick Chat Whats app | Email: pallavi@oscprofessionals.com | Skype : oscprofessionals-87
0 Likes
choosemishop
Tourist
7 1 0

This is an accepted solution.

Thank you so much !!!

Do you know how to do it on the mobile version ? 

It is perfect on the computer but not on the mobile...

0 Likes

@choosemishop,

Please add below css

.section-hura-video #vid {
	width: 100%;
}
If helpful then please Like and Accept Solution. Free Website Review and advice for sale from Hire us
Shopify Conversion Experts | Shopify Private App | Custom Theme Development | Custom Modifications In To Shopify Theme | Shopify SEO | Digital Marketing | Site Speed Optimization | Performance Site Audit
For Quick Chat Whats app | Email: pallavi@oscprofessionals.com | Skype : oscprofessionals-87
0 Likes