Why is the Video Hero section in Impulse theme not working?

Hi,

I have a problem with the Impulse theme:

The Home section called “Video Hero” is blank and even trying to change it doesn’t work. I think there’s a problem with the code but I don’t know how to approach the problem.

This is the home page, as you will se in the link below.

Can somebody help me to solve the situation? Changing everything doesn’t seem to work.

My store → Lunadreamsitalia.com

Thank you.

[data-aos=“hero__animation”] .hero__media, [data-aos=“hero__animation”] .hero__image, .hero .slideshow__slide .hero__media, .hero .slideshow__slide .hero__image {
opacity: 1;
}

add this in theme.scss.liquid

Hello @Luna_Dreams ,

There is console errors on your site.

Please fixed console errors

I got the EXACT same problem just recently with the impulse theme. The video hero is completely blank (black), not showing the video. I haven’t updated the theme or anything. It was working just fine before.

Hey @Vikas3218 , thanks!

However, this code seem to just have the video thumbnail appear as a background hero picture but the video doesn’t play.

This is our website: www.victress.se

I found the problem. Here is a guide how to solve it from the theme developers:

  1. Open assets/theme.js.liquid for your current theme

  2. Search for this line:

var $player = $(evt.target.a);
  1. And replace the four places it appears with:
var $player = evt.target.a ? $(evt.target.a) : $(evt.target.f);

Now I can see the text, but the video doesn’t play in the background

Check above, it worked for me. Replace the code in step 2 with the code in step 3. There are four places it needs to be changed in the theme.js.liquid file.

Thanks, but it didn’t do anything. Now the text is showing up cause of the
other tip the other guy gave me with the opacity, but yours did not do
absolutely nothing…

For clarity: I need to copy and paste the code you gave me Overwriting the
existent one on the 4 lines starting with “var $player” ,right?

Hi @Luna_Dreams ,

I see other threads that followed those steps and it worked, same for me.

Did you find the four places the code appeared? Yes, you should replace them with the code in step 3. They are all in assets/theme.js.liquid

The alternative is updating the theme which there is a guide on how to do as well, but the code-solution fixed the issue for many of us with Impulse theme.

PS. Remove the code with the opacity.

Here is link to the guide on how to solve the video playback issue from the theme developers themselves: https://archetypethemes.co/blogs/motion/youtube-videos-stopped-playing

Thank you again, I misunderstood you. Now that I pasted on the four locations the code the situation was solved. Thank you!

Happy I could help.

Hey @Victress ,

I have the same problem with the video. Can you tell me exactly where i put the codes in the frame?

Is there any update on how to solve this issue for the latest version of Impulse theme?

I’m having an issue also. @oscprofessional @Victress