Changing Fonts via Custom CSS

Thanks for your feedback 🙂

Try heading over to Settings > TypeKit Fonts > Custom CSS Rules and insert:

body, 
button, 
input, 
select, 
textarea {
	font-family: "proxima-nova", arial, sans-serif;
}

.entry-content h1,
.entry-content h2, 
.entry-content h3,
.entry-content h4,
.entry-content h5,
.entry-content h6 {
	font-family: "proxima-nova", arial, sans-serif;
}

That’ll make everything Proxima Nova. With these rules you can leave SiteOrigin widget’s font settings on the theme font setting.

Do you have any general use case for Museo? If you can perhaps send a link to your site and give me a use case of Museo on that page I’ll try narrow this down. You can use the Set as private reply checkbox below if you want to keep your site private.

This reply has been marked as private.

Certainly 🙂 If you have any follow-up questions, please, let us know. Chat further once your site is live. Cheers for now 🙂

This reply has been marked as private.

Hi Matt
I’m Leonor a beginner in wordpress (learned through tutorials). I’m using Ultra Premium theme. Could you please help me with my Font problem? I’d like to use everywhere in my site the Avenir book font. 1) How can I add it to the theme design and 2) in a way that it won’t be affected by updates?
Thank you in advanced
Leonor

Hi Leonor

Thanks for reaching out. Avenir Book is a premium Adobe font. When I check MyFonts.com now I can only see a Desktop purchase option, I could be missing the web purchase option though. Do you have a web ready license for this font?

Opus! What’s a web license ?

It’s a commercial font so even to use it on your desktop it needs to purchased. In addition there is usually another license for fonts to be used online, I’m not sure this font can be used online. An easier solution would be to use the closest Google font such as Muli or Museo Sans.

Thank you very much for your help!

For sure 🙂 If you Google avenir book google font similar you’ll find various forum discussions where users suggest different alternatives that might work for you.

Thank you for your useful tips 😉

For sure 🙂

Hi Andrew,

I need to adjust the fonts for two pieces on my homepage: http://dev.cwpd.org

– Change the font for the five items in the Plan Your Park Experience panel (with the blue cloud background) to Montserrat (rather than Montserrat 700). (I created this using the SiteOrigin Features widget.)

– Change the font in the “Submit” button at the bottom of the page to Montserrat 700, to match the other buttons on the page. (I created this section using the SiteOrigin Contact Form.)

Do you have any suggestions on how to do this? Can I do it using Custom CSS?

Thanks!
Tricia

Hi Tricia

Thanks for your continued support. Sure, let’s try:

1. Please, try in Custom CSS:

/* Features Widget */
.sow-features-list .sow-features-feature .textwidget > h5 {
    font-weight: 400 !important;
}

2. Custom CSS:

/* Forms */
input[type="submit"] {
    font-family: Montserrat !important;
    font-weight: 700 !important;
}

Please, let me know how this goes. Thanks.

Perfect! Thanks Andrew!