Jump to content
Sign in to follow this  
WebWerx

Problems with Google Fonts

Recommended Posts

WebWerx

I am having issues getting the Montserrat Google font to display properly for part of our site. Here is the code. I think something is overriding the actual font. http://www.google.com/webfonts/specimen/Montserrat

	.fboxtext {
	    color: #666666;
	    font-family: "Montserrat";
	    font-size: 16px;
	

I have the Google Font plugin installed & activated. It's probably an error on my part as I have been at this all day (head hurts). ~:>

Share this post


Link to post
Share on other sites
catrina
Your code needs a closing curly bracket at the end (after font-size: 16px;): [b]}[/b]

Please read the docs before posting. Please do not private message me unless I ask you to.

Designer | Catrina Dulay

Founder | Catrina and Mouse

Share this post


Link to post
Share on other sites
WebWerx
Hi @catrina! Actually, the bracket is there. I just missed it in my copy/paste. (Head hung in shame....). [code]} object...1221900 (line 34) .fboxtext { color: #666666; font-family: "Montserrat"; font-size: 16px; } [/code] Have a look at the site and you will see that the font is not rendering correctly: http://cl.ly/1a0Q1e1l1L180F2x0A3F. Is there something special that has to be done when using a Google Font via CSS (apart from activating the plugin)? They work fine when I use them via the PL Framework settings panel. You will see from the sample provided in my initial post that the site is clearly not rendering the correct font despite it being identified in my CSS. It is, however, showing color & font-size accurately. Take a look in FIre Bug. Very weird. So I think this may be a bug with the Framework..... Hoping that it is a bug with me instead. I appreciate you help.

Share this post


Link to post
Share on other sites
Danny
Hi, Can you take a screenshot of your Typography settings please and post it here.

Please search our forums, before posting!

Share this post


Link to post
Share on other sites
WebWerx
Hi @Danny! Sure... Here they are: http://cl.ly/3G2y3S0l3w1Y2B1x0f0z I just have random settings for now. The fonts I am attempting to implement are outside the system defaults in PageLines. Thank you.

Share this post


Link to post
Share on other sites
Danny
So the font Montserrat is not part of the Google Webfonts plug-in? **Edit, the font is part of the GoogleFonts plug-ins and I actually have the font working all over my test site. Make sure the plug-in is active and up to date. http://www.screencast.com/t/YJTPFtJU http://www.screencast.com/t/qeYy8FT8RV

Please search our forums, before posting!

Share this post


Link to post
Share on other sites
WebWerx
HI @Danny: I am running Version 1.3 of the PLugin - which I believe is the most current. To recap, I can use Google fonts without issue when I set them in my main PL settings. However, when I apply them via CSS, they do not seem to work. Did you give it a shot via FireBug on my site? The co-ordinated are outlined earlier on in this string. Go to your test site and see if you can apply the font in question to a particular area of the site via CSS.

Share this post


Link to post
Share on other sites
Jenny
According to Google Web Fonts (http://www.google.com/webfonts#ChoosePlace:select): [quote]4. Integrate the fonts into your CSS: The Google Web Fonts API will generate the necessary browser-specific CSS to use the fonts. All you need to do is add the font name to your CSS styles. For example: [code]font-family: 'Montserrat', sans-serif;[/code][/quote] So try something like: [code].fboxtext { color: #666666; font-family: 'Montserrat',sans-serif; font-size: 16px; }[/code]

Jenny :: Web designer at Simple Mama (follow me at @simplemamacom)

Check out Share Me, a social sharing add-on for DMS that is super simple to set up.

Share this post


Link to post
Share on other sites
WebWerx
@simple_mama to the rescue! That was the exact issue. I had the CSS implemented incorrectly. I'll bookmark this item for future implementations. Thanks (again) Jenny!

Share this post


Link to post
Share on other sites

Create an account or sign in to comment

You need to be a member in order to leave a comment

Create an account

Sign up for a new account in our community. It's easy!

Register a new account

Sign in

Already have an account? Sign in here.

Sign In Now

Sign in to follow this  

×