Docs

[ccwadsworth]

Hello X!

I’m trying to modify the font, color and size in a custom headline.

I was following some of your references in this post: https://community.theme.co/forums/topic/how-to-change-font-familysize-in-text-or-custom-headline/

I have added the following into my Child Theme Editor
@import url(‘https://fonts.googleapis.com/css?family=Great+Vibes’);

I have added the following into Custom CSS (note: I’m not sure how to list the 2-word font – space, underscore, plus sign?)

.GreatVibes {
font-family: ‘Great Vibes’ !important;
font-style: normal;
font-weight: 600;
}

Here is the custom headline shortcode I’m using:
[x_custom_headline type=”center” level=”h1″ looks_like=”h1″ accent=”false”]Always Extraordinary[/x_custom_headline]

I have added the style and class (attached)

But nothing is changing…

Can you tell me what I’m missing? I would like the font size to be much larger too. Appreciate your help!

[ccwadsworth]

This reply has been marked as private.

[Nabeel A]

Hi there,

Thanks for writing in! Instead of giving “GreatVibes” class to the Text element, give it to the custom headline. This should fix the issue.

Let us know how this goes!

[ccwadsworth]

Could you show me what you mean by that? And could you also show me how to increase the font size within the shortcode? Thank you!

[Nabeel A]

Hi again,

I went ahead and removed the GreatVibes class from your Text element and added to the shortcode. It’s working fine now. please check. To increase the font size of the custom headline just replace your code with this:

.GreatVibes {
    font-family: 'Great Vibes' !important;
    font-style: normal;
    font-weight: 600;
    font-size: 70px;
}

Adjust the font-size as per your need.

Cheers!

[ccwadsworth]

Many thanks! Appreciate your help!

[Christian]

You’re welcome. Glad we could help. 🙂

[Author]

Posts