Using 2 different Custom Fonts for 2 separate Custom Headlines

Support
#1

Hi.

I want to buy 2 special fonts from MyFonts, Inc, to use on my Homepage Header area (Section called “Introduction” on Cornerstone layout) where I have 2 main “Custom Headlines” elements. How can I do this ? Obviously I have to add the fonts to the theme, but not sure how to do so.

Then once the fonts are added and available on the theme, how will I apply these ONLY to the specific ‘Custom Headlines’ elements that I want to use them for ?

thanks so very much.

karole.

#2

Hello,

Thank you for writing in!

Please, check this article to learn how to install the custom font: https://theme.co/apex/forum/t/customizer-typography/134

And to apply the custom font to a specify headline, you`ll need to add a custom class in this element and add a custom CSS code like this:

.yourCustomClass {
  font-family: 'YourFont';
}
#3

I’m sorry. I looked through this entire link but do not see instructions for how to install a custom font ? Perhaps another link ?

Also you said … you`ll need to add a custom class in this element - do you have instructions for WHERE / HOW I add a custom class for this element ?

thanks for helping … karole

#4

Hi There,

Please read my reply here for adding a custom font: https://theme.co/apex/forum/t/webtype-fonts-in-pro/3562/2

Alternatively, if you can find a font that is identical to what you need on https://fonts.google.com/
Then read this post on how to add a Google Fonts https://theme.co/apex/forum/t/google-font-selector-in-text-editor/1594/2

Hope it helps,
Cheers!

#5

hi. I tried the google font method and it worked … only it rendered the wrong Font … very weird.

So now I’m thinking of adding the Child Theme, so I can add a custom font that I want to purchase. I read the instructions …

But making sure first … If I install the Child Theme at this point, will it mess up anything on all the work I’ve done on building the site thus far ? I SURE don’t want to mess anything up ! Just need some re-assurance on this BEFORE I attempt installing the Child Theme at this point !

Thanks for all your help … The links you sent look like they will steer me correctly. I’m using X , not Pro, so hopefully the link you sent that mentions using PRO won’t make any difference on how I install the new fonts ???

karole

#6

Hi Karole,

Where did you put your Google Font @import statement? that statement does not work on Theme Options > CSS. Try on page’s CSS instead.

Both method should work on Pro and X, actually it should work regardless of the theme that you’re using.

Did you modified a (php) file on the parent XTheme? If not, you should be good when switching from parent to child theme. The things you do on your pages will live.

But we understand that uneasy feeling when we do something for the first time. So please navigate to X > Overview on the Customizer Manager section click Export, keep the downloaded file as backup of your Customizer/Theme Options settings.

Sometimes primary menu and sidebar gets re-set, so if you have multiple menu navigate to Appearance > Menus and take note of what menu you set as Primary Menu. Navigate to Appearance > Widgets and take a screenshot of what Widgets was on your sidebars. But this rarely happen really :slight_smile:

Cheers!