Audio Player

• 

  carolinelifecoaching · Member · Mar 28, 2015 at 7:12 pm

  • Copy link
  • Add topic to favorites

  Hi! Since the media player (audio) changed appearance about a year ago, I have been hoping to change it’s look. I was told by one of your staff that it was possible using CSS, which I have. Can you indicate how this could be done? Here is the page where the player appears:
  http://carolinelifecoaching.com/
  Thanks!
  Caroline

  The blog I need help with is: (visible only to logged in users)

• 

  staff-happychia · Staff · Mar 29, 2015 at 3:01 am

  • Copy link

  Sure we can try to change the style of audio player using CSS.

  The CSS depends on how do you wish to change it. So please let me know.

  Please note that CSS can be used to change the style of existing items but not to add missing elements. So it all depends on what would you like to change.

• 

  carolinelifecoaching · Member · Mar 29, 2015 at 2:22 pm

  • Copy link

  Hi there!
  Thanks for your reply! I basically would like it to look like it used to, if you remember it? It was a basic black player with rounded corners.
  If you don’t remember or cannot think we can make it look like that again, can you tell me what the options are?
  I just want to change it’s appearance, nothing else.
  Thanks!
  Caroline

• 

  staff-happychia · Staff · Mar 29, 2015 at 10:46 pm

  • Copy link

  I don’t know how the old player looked. But this CSS gets the rounded corners to the current player.

  You can experiment with different values for the radius (currently set to 20px ) and settle for the value you like.

  .mejs-container .mejs-controls {
    border-radius: 20px;
  }

• 

  galois · Member · Mar 30, 2015 at 12:12 am

  • Copy link

  if you remember it? It was a basic black player with rounded corners.

  I don’t know how the old player looked.

  Old player ;)

  Customizing the WP audio player

• 

  staff-happychia · Staff · Mar 30, 2015 at 10:14 pm

  • Copy link

  Thanks @galois for the link to the old audio player.

  The rounded corners can be achieved by changing the border radius in the CSS I provided previously.

• 

  carolinelifecoaching · Member · Mar 30, 2015 at 11:43 pm

  • Copy link

  Thanks to you both for your help. Unfortunately I just received the notice for auto-renewal for CSS and I decided to not renew since I barely use it. I guess I will have to live with that ugly player then. Thanks anyway!

  Caroline

• 

  staff-happychia · Staff · Mar 31, 2015 at 12:10 am

  • Copy link

  Cheers :-)