Why isn't the video hero section playing in the Story Theme?

[WearBasics]

Hi!

I've added a video hero section to the Story Theme but it doesn't seem to be playing the linked video as background. Maybe there is a problem with the css.theme or something I should add.

Website: https://wwaca.myshopify.com/

Password: website

[LitExtension]

Hi @WearBasics, 

To show video, you need to add embedded content. You can add this snippet in this class name "animation-cropper"

Please take a look at the screenshot here: https://prnt.sc/10ji6h9

<style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style><div class='embed-container'><iframe src='https://www.youtube.com/embed/_9VUPq3SxOc' frameborder='0' allowfullscreen></iframe></div>

[WearBasics]

I just added the snip but it still doesn't work.  I would think there is something missing in the code.

Maybe you can give me a direct hand in the coding?

[LitExtension]

Hi @WearBasics, 

So can you try this:

- In your file "theme.scss.liquid”, please paste this code:

.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }

- Regarding you module hero, please embed this video:

<div class='embed-container'><iframe src='https://www.youtube.com/embed/_9VUPq3SxOc' frameborder='0' allowfullscreen></iframe></div>

So please let me know when you finish or if you have any questions or need further support, I will help you.