[beansterParticipant]

Hi Guys,

Is it possible to change the colour when using the dropcap shortcode.. ?? Can you specify it to be whatever colour you like.

Thanks in advance,
Frazer.

[John EzraMember]

Hi there,

Thanks for posting in! Yes it can be changed to whatever color.

First off the background color links to the “site links” color set in the customizer” found in Appearance > Customize > Typography > Site Links see http://prntscr.com/5b0ore

Whatever you set here affects the Drop caps as well as other accents on the site like skill bars.

If you would like to control the each drop cap individually you can add an ID, Class, or inline Style to it like so:

[dropcap]T[/dropcap]his is one of the most…

[dropcap id=”dcstyle”]T[/dropcap]his is one of the most…

[dropcap class=”dcstyle”]T[/dropcap]his is one of the most…

[dropcap style=”color:#ffffff; background:#000000;”]T[/dropcap]his is one of the most…

of course if you use the id or class you would need to put CSS rules into your style.css or

you can add it under Custom > CSS in the Customizer.

.dcstyle{
color:#ffffff!important;
background:#000000!important;
}

.dcstyle:hover {
color:#F00!important;
background:#000000!important;
}

Hope this helps!

[LivingAnExaminedLifeParticipant]

First off the background color links to the “site links” color set in the customizer” found in Appearance > Customize > Typography > Site Links see http://prntscr.com/5b0ore

I’m using an Ethos Child Theme v3.0.1 and I don’t find the Dropcap color changes when I tweak the Hyperlink color shown in your screen shot. My Dropcaps are always a dark grey (or black colour) although my hyperlinks are set to be red. Is that a bug?

[Paul RModerator]

Hi there,

Thanks for writing in!

You can change the dropcap background color by adding this under Custom > CSS in the Customizer.

body .x-dropcap {
     background-color: red;
}

Change red with the color that you like.

Hope that helps. 🙂

[Author]

Posts