Found it: Plugins -> Editor -> Select Plugin.
What is the section of css in which I would change the colors, or the color theme? Say I wanted to change the backgrounds to #444333 – what would I do?
Thanks!
Geraldine
As you want to make minor changes, you should be able to achieve this by adding a few CSS rules to your child theme if you are using one, or with a custom CSS plugin.
Please post a link to the relevant page on your site. I should then be able to suggest some appropriate CSS rules with enough specificity to override the existing styles.
Here’s the page: http://mindfulnesscoachingworks.com/get-real-may-2016/
Ok – I figured out how to change these, and made them teal green:
.audioalbum {
background: #427682;
.track .songwriter {
color: #427682;
and made this one a different shade of teal green:
.track {
background: #66919B;
How do I make the the rectangles where the audio plays (with the progressing horizontal bar) … how do I change those to also be shades of teal green? … ie, what’s the dictionary or label (is it .audiobutton?) that I need to make the change to?
From dark to light, the colors are #225966, #426682, #66919B, #98B9C0, #CCDEE2 if that helps.
Thanks very much –
And if possible, I would love to change the font-family to be Source Sans Pro. (and Source Serif Pro if it looks better to have a mix, but I’m not picky that way)
What changes would I make … I presume to this line:
font-family: “HelveticaNeue-Light”, “Helvetica Neue Light”, “Helvetica Neue”, Helvetica, Arial, “Lucida Grande”, sans-serif;
I don’t know if it’s technically possible, and if it is, what are the changes I need to make.
Thank you –
It sounds like you are editing the stylesheet inside the plugin. Is that the case? If so, that’s not a good idea as your changes will be lost when the plugin is next updated.
In the current version, to use custom styles you should instead copy the default CSS into your child theme’s stylesheet and add the line of code mentioned in the documentation to the functions.php to unhook the default stylesheet.
This is very likely to change soon as the next version of the plugin will have a customizer panel for setting colours.
A beta version of the next version should be available soon.
The fonts are inherited from the theme, but as an example they can be tweaked with styles such as:
.audioalbum {
font-family: arial;
}
.track {
font-family: arial;
}
The colours of the time & volume bar can be tweaked by targeting the selectors in this example:
.track .mejs-controls .mejs-time-rail .mejs-time-total {
background: #1b5183;
}
.track .mejs-time-rail .mejs-time-total .mejs-time-loaded,
.track .mejs-controls .mejs-horizontal-volume-slider .mejs-horizontal-volume-total {
background: #0b4983;
}
.track .mejs-time-rail .mejs-time-total .mejs-time-current,
.track .mejs-controls .mejs-horizontal-volume-slider .mejs-horizontal-volume-current {
background: #fcc834;
}
