How to change the frame width of video on home page?

Solved
Highlighted
Tourist
9 1 0

Dear Users, 

 

I have embedded a video on Debut Live theme Home page using Custom content. For some reason the video is aligned in center and has plenty of space on either side. I want to stretch the video to full width. Please help. 

 

Thanks,

0 Likes
Highlighted
Shopify Partner
9252 1179 3248

Hello, @Faheem_Iqbal 

Welcome to the Shopify community!
and Thanks for your Good question.

Please share your site URL,
So I will check and provide a solution here.

If helpful then please Like and Accept Solution.
Want to modify or custom changes on store Hire me.
- Feel free to contact me on bamaniyaketan.sky@gmail.com regarding any help
Shopify Expert | Skype : bamaniya.sky
PSD to Shopify | Shopify Design Changes | Shopify Custom Theme Development and Desing | Custom Modifications In to Shopify Theme | SEO & Digital Marketing
0 Likes
Highlighted
Tourist
9 1 0

This is an accepted solution.

Hi @KetanKumar, It is fine now. Sharing below code with Shopify community. My only issue now with this is that link is not clickable on mobile view, but works fine in Desktop. In my mobile, I can right click and open href in new tab. But not on clicking it. May be you could alter below code to make it clickable on mobile? 

 

1.

Templates>index.liquid

{% section 'index-hura-video' %}

{{ content_for_index }}

 

2.

Sections > index-hura-video.liquid (create new section and paste below code)

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

   <a href="">

     <video class="hurabg-video" playsinline="" loop="" muted="" autoplay="1" controls="">

   <source src="">

  </video> </a>

    </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 %}

0 Likes