Google Fonts Not Working

[PrayersNApples]

I followed the instructions for uploading Google fonts (here) but when I try to change my body font, it doesn't work.

I've changed my style.css to look like this:

/* Import Fonts
------------------------------------------------------------ */

@import url(http://fonts.googleapis.com/css?family=Oswald);
@import url(http://fonts.googleapis.com/css?family=Sofia);
@import url(http://fonts.googleapis.com/css?family=Open+Sans+Condensed:300);
@import url(http://fonts.googleapis.com/css?family=Cherry+Swash);
@import url(http://fonts.googleapis.com/css?family=Roboto+Slab);

/* Defaults
------------------------------------------------------------ */

body {
	background: url(http://prayersandapples.com/wp-content/uploads/2013/12/White.jpg) repeat-x;
	color: #605f5f;
	font-family: 'Roboto Slab', serif;
	font-size: 16px;
	font-weight: 300;
	line-height: 1.5625;
	margin: 0;
	padding: 0;
	text-decoration: none;
}

And I've edited my CSS stylesheet (directly in the WordPress dashboard) to look like this:

body {
	font-family: 'Roboto Slab', serif;
	font-size: 16px;
	font-weight: 300;
}

Any suggestions? (Thanks in advance!)

http://www.prayersandapples.com

[PrayersNApples]

Not sure if it helps if I'm more specific, but I'm trying to get the font (Roboto Slab, serif) from Minimum Pro (http://my.studiopress.com/themes/minimum/#demo-full) onto the main text areas (i.e., blog post content) of my Adorable theme (http://prettydarncute.com/demos/adorable/).

[emasai]

You might also need to modify the font callout in the functions file.

---

Need Website Customization or a Responsive CSS fix? Contact Me
Lynne emasai.com

[PrayersNApples]

@emasai: thank you for your suggestion! Unfortunately, I'm still not having too much luck :/ I was able to get the font to change - but something's not right, because it doesn't look the same as the Minimum Pro demo site. I followed the instructions on Brian Gardner's tutorial: http://www.studiopress.com/tips/google-web-fonts.htm but the font on my website looks smaller. (I've since changed it back because I was worried I was messing with too many things and needed to wait until someone told me how to do it correctly!) I tried to leave my question on that tutorial, but for some reason it won't let me? I also emailed support, but they said they don't have access to the exact coding I would need to copy/paste and suggested I ask for help on the forum.

If anyone could help me figure out how to get the main font on the Adorable theme to look exactly like the font on Minimum Pro, I would really appreciate it! Thanks so much!

[Brad Dalton]

This is the correct way to add Google fonts in WordPress in your child themes functions.php file.

//* Enqueue scripts
add_action( 'wp_enqueue_scripts', 'minimum_enqueue_scripts' );
function minimum_enqueue_scripts() {

	wp_enqueue_style( 'minimum-google-fonts', '//fonts.googleapis.com/css?family=Roboto:300,400|Roboto+Slab:300,400', array(), CHILD_THEME_VERSION );

}

---

Tutorials for StudioPress Themes.

[Elaine Griffin]

Brad, if you want to add more than one font, do you put them on the same line and separate with a comma, or do you enqueue each script separately?
Thanks!
Elaine

[Brad Dalton]

Either way works.

When you select them on Google web fonts, you add them and then grab the code which includes all fonts, or you can do them separately.

---

Tutorials for StudioPress Themes.

[tjoudeh]

Thank you Brad for your explanation, but for a reason google font is not working on my theme (eleven40 pro), I did everything but the font won't update.

It will be great if you were able to take a look on my blog and let me know if I'm missing something.
http://66.147.244.100/~bitoftec/

[tjoudeh]

Thanks for your explanation, but for a reason google font is not working on my theme (eleven40 pro), I did everything and used the new way which modifies the functions.php page but the font won't update.

Will be great if you were able to take a look on my blog and let me know if I'm missing something.
http://66.147.244.100/~bitoftec/

[kevinburke2]

I know this was from February, but I'm seemingly having the same problem as tjoudeh. I haven't messed with any fonts. I'm using eleven40 pro right out of the box. The fonts are correct when using Safari on a Mac and iOS. But on IE on a PC, it's all messed up - changes the fonts completely. Check out the header.

In Safari on Mac:

In Internet Explorer on PC:

[schigk]

Adding Open sans Google fonts to Enterprise Theme for the text (body) area. Website: http://www.matrixmarketinggroup.com/

I've read everything about this and here's what's I've done. However, the fonts in not change.

1. Add the code below to function.php (child theme), I'm trying to add Open sans Google fonts

/* Enqueue Open san (light) Web Google fonts
add_action( 'wp_enqueue_scripts', 'enterprise_google_fonts' );
function enterprise_google_fonts() {

wp_enqueue_style( 'google-fonts', '//fonts.googleapis.com/css?family=Open+Sans:300italic,300', array(), CHILD_THEME_VERSION );

}

2. Here's my css in the child theme

textarea {
color: #555;
font-family: 'Open-Sans', Arial, Helvetica, Tahoma, sans-serif;
font-size: 14px;
font-weight: 300;
line-height: 20px;
margin: 0;
padding: 0;
text-decoration: none;
}

input {
color: #333;
font-family: 'Open Sans', Arial, Helvetica, Tahoma, sans-serif;
}

[Brad Dalton]

Your CSS is wrong

Use this class for the widget

.widget_text {
    color: blue;
    font-family: Open Sans;
}

Or this section I.D

#text-4 {
    color: red;
    font-family: Open Sans;
}

---

Tutorials for StudioPress Themes.

[Author]

Posts