mp4 video on Debut theme homepage without YouTube link

decli
Tourist
10 0 3

Hi!

I'm trying to add a mp4 to my home page.  I followed the instructions from a community link - but nothing appears. 

I'm using Debut. 
I created a duplicate theme.

I created a custom section.  
  Added the code to the section to it from your post. 
  Inserted the shopify link for my mp4 file

Saved. 

Go to Customize theme
Open the duplicate theme. 
Add section - custom content

And it shows the "custom content" with talk about brand, add photo. 

I feel like I'm overlooking something incredibly simple. 
How do I get the "custom content" section to reflect the new coding?

Thank you for your guidance. 

<script>
window.addEventListener('load', videoScroll);
window.addEventListener('scroll', videoScroll);
function videoScroll() {
if ( document.querySelectorAll('video[autoplay]').length > 0) {
var windowHeight = window.innerHeight,
videoEl = document.querySelectorAll('video[autoplay]');
for (var i = 0; i < videoEl.length; i++) {
var thisVideoEl = videoEl[i],
videoHeight = thisVideoEl.clientHeight,
videoClientRect = thisVideoEl.getBoundingClientRect().top;
if ( videoClientRect <= ( (windowHeight) - (videoHeight*.5) ) && videoClientRect >= ( 0 - ( videoHeight*.5 ) ) ) {
thisVideoEl.play();
} else {
thisVideoEl.pause();
}
}
}
}
</script>
<video autoplay muted loop controls="controls" src="{your-video}" type="video/mp4" width="100%" height="600">"Any text you might want to add."</video>

 

--------------------------------

Another community reference advised to add a rich text section and add html ... but my rich text box doesn't have an html option. 

Any help you can provide would be deeply appreciated. 

Thank you!

 

screenshot-wrist-ability.myshopify.com-2021.07.21-11_10_26.pngscreenshot-wrist-ability.myshopify.com-2021.07.20-11_30_25.pngscreenshot-wrist-ability.myshopify.com-2021.07.21-11_11_13.png

 

KetanKumar
Shopify Partner
20291 2103 7610

@decli 

Sorry you are facing this issue, it would be my pleasure to help you.

Welcome to the Shopify community!
Thanks for your good question.

Please share your site URL,
I will check out the issue and provide you 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 Partner | 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
decli
Tourist
10 0 3
0 Likes
decli
Tourist
10 0 3

Hi @KetanKumar 

Here is the website:  https:// wristability.com

I have the code entered in a duplicate (not active) theme... awaiting successful video load)

 

Thank you,

Decli

0 Likes