WordPress Controls

Linden Wade
3 Posts
Linden Wade posted this 16 April 2017

Hello,

When I use the [audio] controls in WordPress with a Themler generated theme, the controls do not show up on the built-in player. However, when I use one of the standard WordPress Themes, they do. Is there some sort of css conflict with these two items?

enter image description here

I found a solution online by adding the following code via the additional css panel; 

    .mejs-overlay-button {
background:url("/wp-includes/js/mediaelement/bigplay.png") no-repeat !important;
}
.mejs-controls .mejs-button button {
background:transparent url("/wp-includes/js/mediaelement/controls.png") no-repeat !important;
}

This does work, but then displays both of the controls each side;

enter image description here

Do you have a work around for this?

Thanks in advance.

Hello, When I use the **[audio]** controls in WordPress with a Themler generated theme, the controls do not show up on the built-in player. However, when I use one of the standard WordPress Themes, they do. Is there some sort of css conflict with these two items? ![enter image description here][1] I found a solution [online][2] by adding the following code via the additional css panel; .mejs-overlay-button { background:url("/wp-includes/js/mediaelement/bigplay.png") no-repeat !important; } .mejs-controls .mejs-button button { background:transparent url("/wp-includes/js/mediaelement/controls.png") no-repeat !important; } This does work, but then displays both of the controls each side; ![enter image description here][3] Do you have a work around for this? Thanks in advance. [1]: https://lindenwade.com/pictures/image1.png [2]: https://apipeandakeyboard.com/2013/08/16/no-buttons-on-wordpress-media-player/ [3]: https://lindenwade.com/pictures/image2.png
wordpress css bug audio shortcode
Vote to pay developers attention to this features or issue.
10 Comments
Order By: Standard | Newest
Support Team
Support Team posted this 17 April 2017

Hi,

Please provide a link to the page with the Themler theme so we could see the issue.

Sincerely,
Hella

Hi, Please provide a link to the page with the Themler theme so we could see the issue. Sincerely, Hella
Linden Wade
3 Posts
Linden Wade posted this 17 April 2017

Hello Hella,

Here's the link for the post;

https://lindenwade.com/test-post/

Regards,
Linden

Hello Hella, Here's the link for the post; https://lindenwade.com/test-post/ Regards, Linden
Support Team
Is Solution
Support Team posted this 17 April 2017

Hi,

Please add this code under the Home >> Settings >> Additional CSS:

.mejs-controls .mejs-button button
{
margin:7px 5px!important;
padding:0!important;
position:absolute!important;
height:16px!important;
width:16px!important;
border:0!important;
background-color:transparent!important;
background-image:url(https://lindenwade.com/wp-includes/js/mediaelement/controls.svg)!important;
}

Sincerely,
Hella

Hi, Please add this code under the Home >> Settings >> Additional CSS: .mejs-controls .mejs-button button { margin:7px 5px!important; padding:0!important; position:absolute!important; height:16px!important; width:16px!important; border:0!important; background-color:transparent!important; background-image:url(https://lindenwade.com/wp-includes/js/mediaelement/controls.svg)!important; } Sincerely, Hella
Linden Wade
3 Posts
Linden Wade posted this 17 April 2017

Oh, well look at that!

Brilliant. Thanks for your help!

Regards,
Linden

Oh, well look at that! Brilliant. Thanks for your help! Regards, Linden
Support Team
Support Team posted this 18 April 2017

You are welcome. Feel free to contact us in any other occasion.

Sincerely,
Hella

You are welcome. Feel free to contact us in any other occasion. Sincerely, Hella
Sem
24 Posts
Sem posted this 20 October 2017

Hello, with themler wordpress default audio not working as mentioned. When I added the code that you provided audio player look changed but play and sound buttons images or svg files are still missing. Can you please take a look and help me?
Please check the the http://mhost.site/ari74/

Hello, with themler wordpress default audio not working as mentioned. When I added the code that you provided audio player look changed but play and sound buttons images or svg files are still missing. Can you please take a look and help me? Please check the the http://mhost.site/ari74/

Last edited 20 October 2017 by Sem

info1938
72 Posts
info1938 posted this 21 August 2018

Having the same problem at the moment

Having the same problem at the moment
Support Team
Support Team posted this 21 August 2018

Hi,

Please provide a link to the page where we could see the issue.

Sincerely,
Hell

Hi, Please provide a link to the page where we could see the issue. Sincerely, Hell
leora
80 Posts
leora posted this 12 October 2020

Hello. I'm seeing this too and your fit above doesn't seem to help. Without the fix, there are just blue squares for the play and volume controls. WIth the fix, the controls are now misaligned and the volume icon is incorrectly a play icon?

I've had to change the background image url to loading mejs-controls.svg instead of controls.svg as that file doesn't seem to exist any more.

Without the fix:

Audio controls missing

with the fix:

Misaligned and volume control incorrect

Hello. I'm seeing this too and your fit above doesn't seem to help. Without the fix, there are just blue squares for the play and volume controls. WIth the fix, the controls are now misaligned and the volume icon is incorrectly a play icon? I've had to change the background image url to loading mejs-controls.svg instead of controls.svg as that file doesn't seem to exist any more. Without the fix: ![Audio controls missing][1] with the fix: ![Misaligned and volume control incorrect][2] [1]: https://ibb.co/K0BKrVr [2]: https://ibb.co/kGgw6jg
leora
80 Posts
leora posted this 12 October 2020

The embeds didn't work. Attached them here.

The embeds didn't work. Attached them here.
missingcontrols.gif
wrongcontrols.gif
You must log in or register to leave comments