Motivational Hero Video - Is there a way to get this to play automatically?

[ethosdesign]

Hi there,

I’m using the Motivational Hero Video preset from the design cloud. It works great except for one thing. When you click the play button toggle, it opens the element, but doesn’t play the video right away. Is there a way to make that happen?

[prakash_s]

Hello Ken,

Thanks for writing to us.

Motivational Hero Video content has been created with Headline Element and Content Area Model Element. If you check the Content Area Model there is an Iframe for video. In case if you have not seen our Content Area Model documentation please have a look at this https://theme.co/docs/content-area-modal

To make the Iframe video autoplay It would require custom development or if you have an idea about coding please have a look at this article for reference.
https://www.w3schools.com/html/html_youtube.asp

Please note that we don’t provide custom development support. It is out of the support scope.

Thanks for understanding

[ethosdesign]

Ok, so the bit about video in the link says this:
“Let’s say you embed a Youtube video as the content of the modal. Now, imagine the user intracting with the modal on the website. He clicks the toggle button, making the modal appear where he sees the Youtube video. Then he clicks the Youtube video play button to play the video.”

I would be ok with this, but it’s not what I see. It’s a video hosted on my server, so when I click the toggle, this is what I see:

It’s just a black square… if it was another play button, that would be fine, but as it is, I think the user would think it wasn’t working correctly. I’m assuming something has gone wrong here because I doubt you would add something that worked this way to your design cloud.

[marc_a]

Hi Ken,

To better help you with your concerns, we need to check your website. Please give us the following information in a Secure Note.

• WordPress Login URL
• Admin level username and password
• Page of the URL you are working on

You can find the Secure Note button at the bottom of your posts.

Thank you.

[ethosdesign]

Ok, thanks!

[prakash_s]

Hello Ken,

For self-hosted video, you can use HTML5 Video tags to load the video in the model and autoplay.

Please use this code Video tag

<video width="800" height="460" controls autoplay="autoplay">
<source src="https://efinefoods.ca/wp-content/TrueBlue-Moonlight-Gala.mp4" type="video/mp4">
<source src="movie.ogg" type="video/ogg">
Your browser does not support the video tag.
</video>

Please have a look at this Video tag tutorial https://www.w3schools.com/tags/tag_video.asp

Thanks

[ethosdesign]

Worked like a charm, beauty! Thanks!

[marc_a]

Hi Ken,

You’re welcome and it’s our pleasure to help you. If you have any other concerns, feel free to reach us.

Thank you.