How can I strip media player of all controls and autoplay?

Hey all. I’m embedding the default Wordpress media player in my Showit site. The player is embedded in my Showit page using an iFrame.
I want it to autoplay, loop and strip all the controls. No sound is needed.
Any clues?
I’m very new to CSS and still struggling with targeting elements.
This is the page with the embedded WP video player:
https://photoform.com.au/free-light-guide-landing-page-1

Thank you!

Hi @milomelb,

Did you try to add to your iFrame the one of following properties:

  • loop=1
  • autoplay=1

I found them online for the autoplay, I didn’t test myself.

1 Like

Hi @LucLH once I tried them, they works only if the video is mute,
https://quick-adviser.com/why-do-videos-always-start-muted/
Hi, @milomelb to add controls, try to add the controls attribute like this:

<video controls>
  <source src="movie.mp4" type="video/mp4">
</video>
1 Like

Hi @miguelgiacobbe, thank you to share the info! There is absolutely no way to autoplay the video with the sound? After as a user, I think it is better this way

from the article I linked above:

Autoplay with sound is allowed if: User has interacted with the domain (click, tap, etc.). On desktop, the user’s Media Engagement Index threshold has been crossed, meaning the user has previously played video with sound. The user has added the site to their home screen on mobile or installed the PWA on desktop.

1 Like

But I don’t want the controls how do I do that?

Not sure how I do that? Is that in HTML section?

If you don’t want controls you have to remove controls from your video tag,
try to paste this code instead of yours,

<video src="https://photoform.com.au/wp-content/uploads/sites/18934/2022/03/Margie-1.mp4" width="440px" muted="" autoplay="" loop="">
</video>

I’m not sure why but with the <source> tag it doesn’t work…

That works you are amazing! But how do I apply that code to the one that is already on the page?

Ok so I got it to work by embedding HTML code box. Is there a way of applying that code to the iFrame though so it’s more responsive?

you don’t need an iFrame to do it responsive,
are you using wordpress?
becuase if you are using it maybe can be more difficult to do it,
try to follow this steps:

  1. Add a class atttribute to the video tag, like this: class="video-responsive"
  2. Next go to dashboard → Appearence → Costumize → Addittional Css and add something like this:
.video-responsive{
    width: 100%;
}

or you can also go to the code editor and add a<style></style> tag
and write your css there…
(All this if you are using wordpress)

No I’m embedding the iFrame into my Showit site using a wordpress video.

And it just works a lot better as an iFrame embed rather than a HTML box.

Ah ok sorry, I don’t know how Showit works,
and it’s strange that your are note able to insert html into iFrame…

You can I just don’t know how lol.

OMG I got it to work thank you!

perfect! your welcome!

This topic was automatically closed 182 days after the last reply. New replies are no longer allowed.