Docs

[chrispaynterdeepend]

Hi, I want to change the font for the text below the counter. Could you please advise how I can do this?

[Prasant Rai]

Hello There,

Thanks for writing in! To assist you with this issue, we’ll first need you to provide us with your URL. This is to ensure that we can provide you with a tailored answer to your situation. Once you have provided us with your URL, we will be happy to assist you with everything.

Thanks.

[chrispaynterdeepend]

This reply has been marked as private.

[Prasant Rai]

Hello There,

Thanks for writing in!

You can add this under Custom > CSS in the Customizer:

.x-counter .text-below {
    font-size: 14px !important;
    text-transform: capitalize !important; 
}

Note: text-transform: capitalize !important; optional if you want to transforms the first character of each word to uppercase

Thanks.

[chrispaynterdeepend]

Thanks. What about changing the actual font itself? It is not assuming the font settings for body text or headings?

Note on the link I included the counter font is different to the rest of the website.

[Rupok]

Hi there,

Thanks for updating. The below CSS are added in theme to control the font of those texts :

.x-counter .text-above, .x-counter .text-below {
  display: block;
  letter-spacing: 0.125em;
  line-height: 1.5;
  text-transform: uppercase;
}

And font size will be inherited from body/parent element. But you have the following CSS in Customizer :

.entry-header, .entry-content {
  font-size: 16px;
}

So it’s currently inheriting this. It would be better if you set font-size directly to this if you want to amend.

Hope this makes sense.

[Author]

Posts