How to hide video controls on responsive lightbox video?

Hi there,

I have set up a raw element with an icon and a link to a self hosted video that opens up in a responsive lightbox and has autoplay. The controls however have too many buttons (especially the download button). How can I hide/disable all, or at least most of them? The site is at http://e-difice.com/mod

Cheers,

Alo

Hi There,

Do you have under construction plugin activated? If yes provide your admin credentials in a secure note.

There is nothing on : http://e-difice.com/mod

Thank you

Hey,

The section on the page is hidden in desktop view. I saved this link as a block and entered it into the homepage. This is only meant for mobile, on desktop there is a revolution slider. So, to go over, e-difice.com/mod has one section that is hidden on desktop, so please use chrome Dev tools/whatever else you use to simulate mobile view.

Hi,

You can set hide_controls to true.
eg.

[x_video_player  hide_controls="true" m4v="http://yourdomain.com/video.mp4" poster="http://yourdomain.com/image.jpg"]

http://demo.theme.co/integrity-1/shortcodes/responsive-video/

Hope that helps

Hi,

You are proposing to use a completely different shortcode then what I am currently using. Can you share the code for the whole Raw element in that case, because I tried to add this hide_controls="true" to both the lightbox selector shortcode and the <a> tag, and it didn’t work.

Cheers,

Alo

Hello There,

Thanks for updating in! Regretfully you cannot hide the controls. You are linking to the video to be able to be played inside the lightbox. In this layout, the browser’s video player is used and you cannot remove the browser’s video controls when you play it. It is evident when you visit this video itself on a browser: http://e-difice.com/wp-content/videos/e-difice.mp4?autoplay=1&controls=0

The hide_controls="true" will only work if you actually used the <video> html code.

Hope this helps.

Hi there,

Is it not possible to use the lightbox shortcode and embed the

This seems like a critical issue feature-wise, as far as video popups and hiding controls goes.

Cheers,

Alo

Hi Alo,

You can try this code.


<div id="myvideo" style="display:none;">
     ADD VIDEO EMBED CODE HERE
</div>

<a class="mylink" href="#myvideo" data-type="inline">
<p class="customf" style="color:rgb(232, 119, 38); margin-bottom:12px;"><em>Watch an introductory video</em></p>
<i class="x-icon x-icon-play demovid" style="" data-x-icon="" aria-hidden="true"></i></a>

[lightbox selector=".mylink"]

Hope that helps

Hi and thanks! Could you give me a quick pointer on what to write in the embed code section though? I tried the

Thanks

Hello There,

For the embed code, you can make use of this code:

<div id="myvideo" style="display:none;">
    [x_video_player  hide_controls="true" m4v="http://yourdomain.com/video.mp4" poster="http://yourdomain.com/image.jpg"]
</div>

<a class="mylink" href="#myvideo" data-type="inline">
<p class="customf" style="color:rgb(232, 119, 38); margin-bottom:12px;"><em>Watch an introductory video</em></p>
<i class="x-icon x-icon-play demovid" style="" data-x-icon="" aria-hidden="true"></i></a>

[lightbox selector=".mylink"]

Hope this helps.

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