Jump to content
Sign in to follow this  
nickelridge

Change menu/navbar font

Recommended Posts

nickelridge

Hello, I'm looking for the simplest way to improve the look of my menus (standard navbar and secondary nav menu - www.nickelridge.ca). I'm surprised that with such a good typography section that the menu style isn't included). I don't even see where in the editor to find the code to modify the menu style. I've also looked for a plugin that might help with this, with no luck. I'd like to change the font, size and colour. Please help. Thanks in advance.

Share this post


Link to post
Share on other sites
batman

Hi nickeridge

To change colors

You can use the "Simple CSS Lite" plugin found in the PageLines Store to change all parameters.

It's a free plugin that allows you control over the color of the menu.

Simple CSS Lite only works on the standard navigation, it don´t work on NavBar.

To change font and size

You need add some CSS rules in

It is advisable to learn how to do this on your own too.

Check out http://www.pagelines.com/wiki/Custom_CSS

If you need more CSS help, make sure you've downloaded Firebug for Firefox

and check out W3 Schools for more info.

http://www.w3schools.com/


Life is too short to remove USB safely ...

Share this post


Link to post
Share on other sites
Rob

In Dashboard > PageLines > Site Options > Typography, the Typography - Secondary Font is the proper choice for the menu font.

To avoid people producing menus accidentally set with huge fonts, the font size itself is set in CSS. Some basic options are available under Edit Font Styling.

As Batman points out, Simple CSS Lite is the best solution for the Nav Classic menu, allowing you to change the color, background, etc, but not the font size.

Please keep in mind that fonts are fickle things. One font set at 12px height may appear quite tiny, compared to another set to the same height. With over 500 fonts available via the Google Fonts plugin, your options are endless.

If you're using NavBar, there are different means of changing the colors for that menu.


Former PageLines Moderator, Food Expert and Raconteur

Share this post


Link to post
Share on other sites
Rob

The code currently controlling the font size in your site is:

.main_nav {

font-size: 86%;

}

If you change the 86% to a higher number, the font size will increase. You may add the edited code to Dashboard > PageLines > Site Options > Custom Code in CSS Rules.

Please look at http://www.epicurus.com/

You'll see that using Simple CSS Lite I've been able to implement some good changes to the site's color scheme.


Former PageLines Moderator, Food Expert and Raconteur

Share this post


Link to post
Share on other sites
nickelridge

Actually, just messing with the secondary front in typography as suggested by Rob is good enough for me for now. I may revisit the more complicated CSS method in the future. Thanks to you both!

Share this post


Link to post
Share on other sites
catrina

Will you need this topic open (if not, I will close this and for any other issues you have, a new topic can be started)?


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

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  

×