Shopify themes, liquid, logos, and UX
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!
Solved! Go to the solution
This is an accepted solution.
"sorry but i can't see any video at home pege"
Ummm, correct. This IS the exact issue, @KetanKumar
For some reason, I'm not able to convey the problem in a manner for you to understand/assist.
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.
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
thanks for update you have fixed issue?
No. I'm awaiting your solution. Please help.
"Please share your site URL, I will check out the issue and provide you a solution here."
you have like this?
https://codepen.io/adrianparr/pen/QxMvdj
No. when I add a special section, it does not have a html option. Kindly re-read the initial help request. I'd love to be able to insert a mp4 on the home page with your guidance.
yes it possible to customization code
LOL... yes, I know it is possible to customize code. That's what I'm trying to do and not being successful. I'd appreciate help in determining why the code isn't working, or another solution where I can load a mp4 onto the home page without HTML - as I don't have that option.
sorry but i can't see any video at home pege
This is an accepted solution.
"sorry but i can't see any video at home pege"
Ummm, correct. This IS the exact issue, @KetanKumar
For some reason, I'm not able to convey the problem in a manner for you to understand/assist.
oh sorry for that
please show me what's error?
It's been resolved.
There is no longer an issue.
great thanks for update.
Hi there,
Please can you confirm what you did to resolve this issue?
Shopify are being very unhelpful on this subject 😞
Hi Jules,
I found Shopify to be less than helpful with this issue... did research and found this as a great solution!
I hope it works for you, too!
DeAnne
Portrait of Stephen positioned next to an image of planet Earth, with the Stephen's World ...
By JasonH Mar 18, 2024Digital marketers and app developers have tracked activity in apps and websites for yea...
By Ollie Mar 13, 2024February was an exciting month with Shopify Editions, informative webinars, and more! F...
By JasonH Mar 7, 2024