Community @ The Turning Gate

Support community for TTG plugins and products.

You are not logged in.

#1 2016-01-20 02:49:27

angel
Member
From: Israel
Registered: 2013-06-18
Posts: 37
Website

Google Font not working in Wordpress menu

The Google font is working correctly in all menus apart from the one used in my Wordpress blog.

My site is:

https://asip.co

and blog is https://asip.co/blog.

I would like the blog to match all the other menus.

I have set up custom css as explained.

Offline

#2 2016-01-20 03:14:18

rod barbee
Moderator
From: Port Ludlow, WA USA
Registered: 2012-09-24
Posts: 13,537
Website

Re: Google Font not working in Wordpress menu

you're using two different css files. the one for your main site is coming from

<link rel="stylesheet" href="/phplugins-CE3/css/custom.css" />

the one for your blog is coming from

<link rel="stylesheet" href="/phplugins-CE4/css/custom.css" />

is this intentional?


Rod 
Just a user with way too much time on his hands.
www.rodbarbee.com
ttg-tips.com, Backlight 1.1.1 test site, Pangolin test site

Online

#3 2016-01-20 03:26:42

rod barbee
Moderator
From: Port Ludlow, WA USA
Registered: 2012-09-24
Posts: 13,537
Website

Re: Google Font not working in Wordpress menu

try adding the font-family to this selector:

#nav a

Or simply write 'Roboto Condensed' into the necessary font-family fields in the Theme for WordPress plug-in.


Rod 
Just a user with way too much time on his hands.
www.rodbarbee.com
ttg-tips.com, Backlight 1.1.1 test site, Pangolin test site

Online

#4 2016-01-20 05:11:39

angel
Member
From: Israel
Registered: 2013-06-18
Posts: 37
Website

Re: Google Font not working in Wordpress menu

The Blog is using CE4 while the rest of the site is using CE3 until a migrant over and iron out any CE4 issues first.

I have added the 'Roboto Condensed' to all the font-family field in the Theme for WordPress plug-in and still no success.

How do you add the font to this selector #nav a ?

Is there a line I can add in the Custom css?

Offline

#5 2016-01-20 05:46:34

rod barbee
Moderator
From: Port Ludlow, WA USA
Registered: 2012-09-24
Posts: 13,537
Website

Re: Google Font not working in Wordpress menu

I have added the 'Roboto Condensed' to all the font-family field in the Theme for WordPress plug-in and still no success.

Did you export and upload the theme after doing this. Because you won't see it in Lightroom unless you've added "Roboto Condensed" to your system fonts.

How do you add the font to this selector #nav a ?

Is there a line I can add in the Custom css?

If you need to add the font to the css, add this line:

#nav a {
     font-family:'Roboto Condensed';
}

You may need include other selectors such as #nav a:visited, etc.

your custom.css file contains some selectors that are no longer used in CE4 (.sf-menu, ul.etabs, for instance)

If you want to use custom css to apply the font to all appropriate selectors, you could just replace the ttg css. Matt's got a CE4 Typography css template. The link, and an explanation, is on this page under 5. Override Existing Font-families via Custom CSS:
http://ce4.theturninggate.net/docs/doku … custom_css


Rod 
Just a user with way too much time on his hands.
www.rodbarbee.com
ttg-tips.com, Backlight 1.1.1 test site, Pangolin test site

Online

#6 2016-01-20 06:03:34

rod barbee
Moderator
From: Port Ludlow, WA USA
Registered: 2012-09-24
Posts: 13,537
Website

Re: Google Font not working in Wordpress menu

after looking at that document I link to above, you'll probably, at least for navigation, want something this:

p#nav a, 
#r2d2-menu ul li a, 
#r2d2-menu ul#nav li span {
    font-family: 'Roboto Condensed', 'Lucida Sans', 'Droid Sans', sans-serif;
    }

Rod 
Just a user with way too much time on his hands.
www.rodbarbee.com
ttg-tips.com, Backlight 1.1.1 test site, Pangolin test site

Online

#7 2016-01-20 06:07:36

angel
Member
From: Israel
Registered: 2013-06-18
Posts: 37
Website

Re: Google Font not working in Wordpress menu

Thank you I followed the code from the link toOverride Existing Font-families via Custom CSS and added the following;

/* Site Navigation Menu */
p#nav a,
#r2d2-menu ul li a,
#r2d2-menu ul#nav li span {
    font-family: 'Roboto Condensed', 'Lucida Grande', 'Lucida Sans Unicode', 'Lucida Sans', Geneva, Verdana, Roboto, 'Droid Sans', sans-serif;
    }

It works fine!

Offline

Board footer

Powered by FluxBB