Docs

[mittavalley]

Hi the support team,

How are you?

I am changing the font for Blockquote by adding the css below as I searched from the forum and found a thread recommended to. I am sorry I didn’t copy the link of that thread here. But it didn’t work in my case. Can you suggest me another option please? Berkshire Swash is the font we like to use here.

blockquote.x-blockquote, blockquote .x-cite {
font-family: Berkshire Swash,”Helvetica”,sans-serif !important;
}

http://work.mittavalley.com.au/front-page/

Thanking you in advance for being an excellent support team.
Regards,

[Lely]

Hi There,

You have added the CSS correctly.
But for the font to work, you must select Berkshire Swash on Appearance > Customize > Typography. Before we can use a certain font, we have to define it so it will be loaded. I can see from the source code of your site that you have chosen Fira Sans and Roboto on Customizer.
Now to declare this font add the following code on you child theme style.css file at the very top:
@import url('https://fonts.googleapis.com/css?family=Berkshire+Swash');
See attached screenshot for guidance.

[mittavalley]

Hi Lely,

Thanks for your recommendation.

I would like to use Berkshire Swash font only on Blockquote area but not for the body and header areas. I’ve added @import line on x-Child theme as you suggested but with fails. It remains displaying the body font.

Thanks.
Regards

[Friech]

Hi There,

No it was not using the body font, it was displaying with the heading font (“Roboto”). That is because you wrap your quote with a heading (h5) tag.

To resolve this, add the Custom CSS below on the Customizer.

.x-blockquote h5 {font-family: 'Berkshire Swash',"Helvetica",sans-serif !important;}

Cheers!

[mittavalley]

Hi Friech,

Yes you are right. Your code works perfectly.

Thank you once again for your wisdom.

Have a good weekend.
Regards,

[Christopher]

You’re welcome.

[Author]

Posts