Home>Support>Why does a video not play in my Hero widget?

Why does a video not play in my Hero widget?

I am developing a site for a client, and they wna o have short video playing in the Hero section of the home page. Said video should be overlaid with red.
So, if I set it up with a static image, everything is fine. However, if I say to use a video – noting happens, and he Hero section is just solid red.
As there seems to be distinction between self-hosted videos and YouTube videos, I tried it with a YouTube video just as an experiment. The video played but it was small, in the top-left corner of the Hero, and not overlaid with red.
There seems to be something wrong with the Hero widget, or I’m setting it up wrongly. Either way I could do with so help.

The site is here: jrfryatt.co.uk

Thanks for any advice/help.

This is our free support forum. Replies can take several days. If you need fast email support, please purchase a SiteOrigin Premium license.

  1. 1 year, 4 months ago Andrew Misplon Hi, I Work Here

    Hi John

    Thanks for reaching out.

    Please, could you try temporarily switching to a default theme like Twenty Twenty. Your theme is adding SiteOrigin styling, it would be useful to run this quick test to see if that styling is involved in the problem. The test should only take a minute or two, you’re just checking to see what happens with Twenty Twenty as your activated theme.

  2. 1 year, 4 months ago John Fryatt

    Hi Andrew,

    Thanks for your response.

    I activated the Twenty-Twenty theme, instead of Business Key, and the problem still exists. Obviously the layout of the page was messed up, but a static background image still displays fine, whereas the video background does not.

    Regards, John

  3. 1 year, 4 months ago Andrew Misplon Hi, I Work Here

    Thanks for trying. If possible, please, send an export of the page and we’ll take a look. You can download the JSON layout by editing the page and clicking on LayoutsImport/ExportDownload Layout. Upload the JSON file to WeTransfer.com or a similar site and send us the link.

  4. 1 year, 4 months ago John Fryatt

    Ok, thank you.

    The JSON file is here: https://www.dropbox.com/t/mo7Tp6B8r2Aa5kxg

  5. 1 year, 4 months ago Andrew Misplon Hi, I Work Here

    Thanks.

    The video seems to play normally for me locally. I’ve downloaded the video from your site and added it to the media library in our Corp demo (I’m not using the external URL field) https://demo.siteorigin.com/corp/test-page/.

    The Hero adds a background image overlay by reducing the opacity of the background image. It’s an alternative method of adding an overlay in that we’re actually seeing the background. The Hero doesn’t currently have a method of adding an overlay to videos.

    Given that a video overlay isn’t possible with the Hero, do you want to keep troubleshooting this issue or would you rather stop and look for a method of adding a video with an overlay?

  6. 1 year, 4 months ago John Fryatt

    Hi Andrew,

    Ok, thanks for that. I think I am misunderstanding something….

    How did you make the video play? Is that as a result of setting the video background for the hero?
    I can see that there is no overlay (red or otherwise) but what settings did you use to make that happen?
    How should I configure other Hero settings to achieve this?

    As an alternative can you see any problem if I simply make the video have a red overlay (well, not really an overlay, just red-biased in it’s colour) outside of WordPress, then just use it like a regular video?

    Thanks, John

  7. 1 year, 4 months ago Andrew Misplon Hi, I Work Here

    Hi John

    Thanks for your feedback.

    I didn’t do anything unique to get the video to play. I downloaded it from your site, uploaded it to the Media Library of the Corp demo, and then added it to the Hero in the same place the video was previously added.

    The Hero doesn’t currently offer an overlay for videos, only for images. I thought it best to pause here because if an overlay is a requirement of this row then it wouldn’t necessarily make sense to continue to troubleshoot the video issue. It might make more sense to save time and pivot to a solution that does offer a video overlay.

  8. 1 year, 4 months ago John Fryatt

    Still confused, how did you prevent the overlay from being there?

  9. 1 year, 4 months ago Andrew Misplon Hi, I Work Here

    The issue is that the video isn’t playing on your site, we’d need to troubleshoot that. When we fix the issue, there won’t be an overlay, if you’re ok with that end result, no red overlay, we can proceed.

  10. 1 year, 4 months ago John Fryatt

    Ok, I see what you mean.

    I would like to get the video working.

  11. 1 year, 4 months ago Andrew Misplon Hi, I Work Here

    a3 Lazy Load might be involved, you can perhaps try temporarily deactivating the plugin to see if that helps.

  12. 1 year, 4 months ago John Fryatt

    That’s it! Excellent!

    Thanks very much for your help Andrew, I can move forward now.

    Best wishes, John

  13. 1 year, 4 months ago Andrew Misplon Hi, I Work Here

    Super, glad to hear that helped. You can perhaps check their documentation for how to exclude certain videos or images.

  14. 1 year, 4 months ago John Fryatt

    I will, and thanks again.

    John

  15. 1 year, 4 months ago Andrew Misplon Hi, I Work Here

    I’m glad we could help. Cheers for now :)

Replies on this thread are closed. Please create a new thread if you have a question, or purchase a SiteOrigin Premium license if you need one-on-one email support.

Get The Most Out of SiteOrigin with SiteOrigin Premium

Find Out More