Link to home
Start Free TrialLog in
Avatar of Melody Scott
Melody ScottFlag for United States of America

asked on

Divi Theme - extra fonts I don't want

Site URL: http://dev.techgardens.com/
WordPress Version: 4.7.1

Hi- We will start with the text: SCHEDULE YOUR SECURITY HEALTH CHECK, part way down the page in the blue section.

I've checked everywhere I can think of to make sure I don't have any additional CSS on the page.

Within the module advanced settings, I added the heading and text as Lato, bold, size 33.

When that wasn't working, I went into the custom css and wrote: font-family: Lato!important; font-weight:bold; font-size: 33px;

But still, when I refresh the page and use google developer tools to look at the font, it's size 26, font family Lato, Helvetica, Arial, Lucida, sans-serif. I have the same problem with buttons, and with the footer text.

Any idea where this could be coming from? Thanks!
ASKER CERTIFIED SOLUTION
Avatar of Prasadh Baapaat
Prasadh Baapaat
Flag of India image

Link to home
membership
This solution is only available to members.
To access this solution, you must be a member of Experts Exchange.
Start Free Trial
Avatar of Melody Scott

ASKER

Hi- I don't get what you're saying. :) Sorry!
Where is it using inline styles, and how can I get rid of them? I want to be able to go into the module, advanced section, select a font and have it go live. That's not happening, seemingly. Thanks.
if you see the source of your page, there you can see the inline CSS.

99% they should be in the header.php file located in the divi theme folder.

The CSS that is currently there is as below:

<style class="et_heading_font">
				h1, h2, h3, h4, h5, h6 {
					font-family: 'Lato', Helvetica, Arial, Lucida, sans-serif;				}
				</style>
							<style class="et_body_font">
				body, input, textarea, select {
					font-family: 'Lato', Helvetica, Arial, Lucida, sans-serif; font-weight: 300;				}
				</style>
							<style class="et_all_buttons_font">
				.et_pb_button {
					font-family: 'Oswald', Helvetica, Arial, Lucida, sans-serif;				}
				</style>
							<style class="et_primary_nav_font">
				#main-header,
				#et-top-navigation {
					font-family: 'Lato', Helvetica, Arial, Lucida, sans-serif;				}
				</style>

Open in new window


so you have to open the header.php, edit and change fonts what you want.

hope this helps
and I am sorry if you are not understanding what I write... means then i will stop answering and you have to wait for someone else to answer your question.

please let me know if you want me to stop answering.
No, not at all! I understood that last part, thanks.
ok good :)
so let me know if you were able to identify the inline css and if you have any further questions
HI- let me ask another question. If Divi theme has Lato as a choice in their font list, then it must be installed and available to display to the viewer in their browser, whether or not they have Lato installed, isn't that right?  So the arial, helvetica, etc is never seen, then.
Lato is a Google web font, so themes like Divi will not have it inside the folder or locally, but will have a link in the head part of page which calls the Google font from Google CDN.

In your case, the font is called on line 74 (check in page source) via this code:

<link rel='stylesheet' id='et-gf-lato-css'  href='http://fonts.googleapis.com/css?family=Lato:400,100,100italic,300,300italic,400italic,700,700italic,900,900italic&#038;subset=latin' type='text/css' media='all' />

Open in new window


there are other fonts like Open Sans & Oswald also being called or LOADED
the answer to second part is that in case of some problem in loading LATO font via Google CDN, Helvetica & Ariel will act as a safe fallback and your page will be loaded correctly.
Got it, thanks. I'll be able to have a more indepth look at this later; I'll probably have another question then. :)
no problems, you are welcome with more questions :)
Thanks!