Archived

This topic is now archived and is closed to further replies.

  • 0

Another Navbar Issue


Question

Posted · Report post

I am currently using pagelines customize to try and reposition the menu part of the brandnav. I want the menu itself moved over and the font changed. I have tried using the #brandnav hook, but I think I'm doing it wrong as nothing changes. Can someone give me some code I can put into the pagelines customize style.css file that will allow me to do this? If not is there another way of doing this? I'm not great with code so please spell it out as best as you can. Thanks!

 

Also in the bottom section of my logo there is a light blue strip, what I really want is to position the menu so it overlaps that strip.

Here is what the menu used to look like, and what I'd like it to look like now:

 

http://web.archive.org/web/20111205223402/http://www.gryphon-strategies.com/ (the top blue menu)

Share this post


Link to post
Share on other sites

7 answers to this question

Posted · Report post

Okay, thanks for the images.

 

My best suggestion is to replace Brand Nav with Branding and Nav Classic.

 

We can more easily control Nav Classic to place it where you desire it using CSS.

 

The font is selected via Dashboard > PageLines > Site Options > Typography.   You can and probably should, implement our Google Fonts plugin via the Store. This would give you over 650 fonts to select from to match or at least come very close to the desired font.  Custom Code (CSS) can also be used to select a different font, if desired.  You can find more information about using font families here: http://www.w3schools.com/css/css_font.asp

 

Ok now I have this:

 

8591949456_6a5338b2fd.jpg

 

Now what code can I use to put the menu in the light blue section of the branding (overlapping)? If this isn't possible what code can I use to get rid of any space between the branding and the menu (one touching the other)?

Share this post


Link to post
Share on other sites

Posted · Report post

Hi,

 

Unfortunately, something like isn't simple and would most likely require considerable CSS and possibly a hook.

 

Also, what you're currently trying to achieve by using a full header image and then reposition the Navigation, isn't the best method in my option. I think the best course of action (due to the amount of custom code this type of layout would require), would be for you to contact one of our Pros.

 

http://www.pagelines.com/pros/

Share this post


Link to post
Share on other sites

Posted · Report post

#brandnav is the selector for the brand navigation that is on the top right corner. NavBar uses selector #navbar (so you must use this in your CSS).

 

To change the font, you’ll also need to use Custom CSS. To find the Custom CSS you need, you'll need to use Firebug (or Chrome Development tools). To learn how to use Firebug for CSS customizations, please review this entire documentation and follow the instructions: http://support.pagelines.me/docs/customization/custom-css. For help with the font-family attribute, please see these instructions: http://w3schools.com/cssref/pr_font_font-family.asp.

Share this post


Link to post
Share on other sites

Posted · Report post

#brandnav is the selector for the brand navigation that is on the top right corner. NavBar uses selector #navbar (so you must use this in your CSS).

 

To change the font, you’ll also need to use Custom CSS. To find the Custom CSS you need, you'll need to use Firebug (or Chrome Development tools). To learn how to use Firebug for CSS customizations, please review this entire documentation and follow the instructions: http://support.pagelines.me/docs/customization/custom-css. For help with the font-family attribute, please see these instructions: http://w3schools.com/cssref/pr_font_font-family.asp.

 

I do not know where to put the css...

 

Does anyone have a step by step of how to move a brandnav over?

Share this post


Link to post
Share on other sites

Posted · Report post

Hi,

 

You can place the CSS in Dashboard > PageLines > Site Options > Custom Code.

 

When you say you want to 'move' the menu, could you possibly provide some greater detail of what you mean? Some screenshots, examples or drawings would be really helpful.

 

Thanks.  We'll do all we can to assist.

Share this post


Link to post
Share on other sites

Posted · Report post

This is the brandnav I have:

8590883410_8db6d88679.jpg

 

This is the brandnav I want:

8590883584_117fabe2da.jpg

 

How do I reposition it and change the font so that it is closer to the bottom one?

Share this post


Link to post
Share on other sites

Posted · Report post

Okay, thanks for the images.

 

My best suggestion is to replace Brand Nav with Branding and Nav Classic.

 

We can more easily control Nav Classic to place it where you desire it using CSS.

 

The font is selected via Dashboard > PageLines > Site Options > Typography.   You can and probably should, implement our Google Fonts plugin via the Store. This would give you over 650 fonts to select from to match or at least come very close to the desired font.  Custom Code (CSS) can also be used to select a different font, if desired.  You can find more information about using font families here: http://www.w3schools.com/css/css_font.asp

Share this post


Link to post
Share on other sites