Docs

[re.fresch]

Hi. I had some custom fonts added previously to our site “Trilogy”. These were added by our programmer who has now moved on. I need to update our exisitng fonts for a new font by Adobe Typekit, Ronina.

I have added the script as advised. And, I have changed the H tags to Ronina but its not picking up my changes. Chan you pls look at my code and help me to determine how to get:

1. Ronina to work properly, and
2. How to apply it to my CSS Header and body copy tags, so I can get them to show up, thanks!

— — —

Images provided below
url: refresch.global
wpv: 4.7.2
Xv: 4.5.0
Conerstone v: 1.2.4

Pls feel free to update to latest versions if you think its ok to do so.

[re.fresch]

This reply has been marked as private.

[Rahul]

Hey there,

Your screenshot failed to upload due to file size restriction. Please reduce its size below 512kb and upload again.

Thanks.

[re.fresch]

This reply has been marked as private.

[Jade]

Hi there,

To use a TypeKit font, you may use the TypeKit addone that comes with X. You can install it in Dashboard > Addons.

Please check this link for more information: https://community.theme.co/kb/extension-typekit/

Hope this helps.

[re.fresch]

This reply has been marked as private.

[Christian]

There’s no option to target each headline. You can do that with CSS provided you still use the Typekit font in the Typography settings. Please add the code below in your Appearance > Customize > Custom > Global CSS. The sample below assumes you’re using this Typekit font https://typekit.com/fonts/benton-sans/details/benton-sans-thin

h1, .h1 {
font-family: benton-sans, sans-serif;
}

h2, .h2 {
font-family: benton-sans, sans-serif;
}

Thanks.

[re.fresch]

This reply has been marked as private.

[Lely]

Hello Joshua,

There’s no Ronina google font and yes, as of the moment, headers share one font family that can be set on the customizer. Typekit is not installed when I checked your site so I am not sure about the Ronina font. If we want to use custom font, we have to declare it. See this link for guidance.https://community.theme.co/forums/topic/custom-font-2/#post-142444

Now we can use something like this:

h1, .h1 {
font-family:  'MyWebFont', sans-serif;
font-size: 50px;
}

h2, .h2 {
font-family:  'MyWebFont',, sans-serif;
font-size: 40px;
}

Hope this helps.

[re.fresch]

This reply has been marked as private.

[Christian]

The given credentials doesn’t work. Please check.

Thanks.

[re.fresch]

This reply has been marked as private.

[Lely]

This reply has been marked as private.

[re.fresch]

This reply has been marked as private.

[Lely]

Hello Joshua,

Now it is clear and I am able to check your setup.
From the typekit settings, you have Ronnia and not Ronina. See attached screenshot. It is already selected under Typography on Customiser.

Then I saw this custom CSS:

h2 { font-family:"Ronina Light", Verdana, sans-serif; font-size: 30px; font-weight:200; font-style:normal; margin-top:15px; }
h3 { font-family:"Ronina Bold", 'Times New Roman', Times, serif; font-size: 18px; font-style:normal;  margin-top:10px;  }  
h4 { font-family:"Ronina Bold", Verdana, sans-serif; font-size:16px;font-style:normal;  margin-top:10px; }
h5 { font-family:"Ronina Light Italic", Verdana, sans-serif; font-size:14px;font-style:normal;  margin-top:10px; }
h6 { font-family:"Ronina Light", Verdana, sans-serif; font-size:14p; font-weight:normal; font-style:normal; }

Update that to this:

h2 {
    font-size: 30px !important;
    font-weight: 200 !important;
    margin-top: 15px !important;
}
h3 {
  font-size: 18px !important; 
  margin-top:10px !important; 
  font-weight: 700 !important; 
 }  
h4 { 
  font-size:16px !important; 
  margin-top:10px !important; 
  font-weight: 700 !important; 
 }
h5 { 
  font-size:14px !important;
  font-weight: 200 !important;   
  margin-top:10px !important;   
  font-style: italic !important;
 }
h6 { 
font-weight: 200 !important;   
font-size:14px !important; 
}

Since all headings is set to Ronnia already, no need to declare it too on the CSS. Then font-weight determines if it’s light or bold. As you can see, I did use 200 font weight for headings where you want it light and 700 for bold. Feel free to change that. See attached screenshot for the weights available for that font.

Hope this helps.

[Author]

Posts