Archived

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

  • 0

Navbar-How to adjust to a custom color, and drop-downs sub-pages?


Question

Posted · Report post

Hi there,

 

I would like to make some tweaks to the look of my Navbar:

 

1) Adjust the navbar color to choose a custom color (I already have the RGB code)

2) Give the Navbar the functionality of drop-down sub-menu pages that appears only when I point the mouse finger to the particular Navbar page. (this is a functionality very common in many pages nowadays).

 

Btw, I read a couple of threads and documents here but I couldn't find how to do it. 

 

Appreciate your help.

 

Alex

Share this post


Link to post
Share on other sites

11 answers to this question

Posted · Report post

Which page has the subpages you set up?

Share this post


Link to post
Share on other sites

Posted · Report post

The page named "Seguros Comerciales" is the Parent page, it is the third page from left to right in the navbar. There are 4 sub-pages created and published (but not seen, don't know why) under the Parent page "Seguros Comerciales". Both the Parent and the sub-pages are assigned to the same Page Template.

Share this post


Link to post
Share on other sites

Posted · Report post

We have a plugin called Simple CSS Lite which can help you style the Nav Classic menu.

 

Do you have a cache plugin activated?   If so, please make your changes to the design, then clear the plugin's cache.  You'll then see the changes implemented.

Share this post


Link to post
Share on other sites

Posted · Report post

Just downloaded and activate the Simple CSS Lite, I'm going to try to configure the navbar colors. I don't know what is the cache plugin. It's a different plugin that I have to install?

Share this post


Link to post
Share on other sites

Posted · Report post

Hi there

 

You'd know if you had one installed as its something you would have installed previously.

 

No, you don't need a cache plugin, Rob was just saying if you did have one to turn it off prior to making the changes as it could stop the changes from taking affect.

Share this post


Link to post
Share on other sites

Posted · Report post

Hi Alex,

 

1. This would require custom CSS, if you have the RGBA code, then you're half way there. All you need to do is inspect the NavBar using Firebug or your browsers web dev tools and then copy the CSS that gives the NavBar its background color. Then add this code to a text editor, make your changes and then add that code to your custom CSS.

 

2. The NavBar click to access the drop down menus is based on Bootstrap, this functionality is part of the NavBar and can not be changed, as far as I know. If you wish to have a navigation menu where you hover over menu items to access the drop down menu/sub menu. I recommend you replace the NavBar with the Nav Classic section.

Share this post


Link to post
Share on other sites

Posted · Report post

Thanks Danny, I will go ahead and try to do it. I'm using Mozilla, do you know is the Firebug functionality is already embedded in the browser or if I will have to download the add on?

Share this post


Link to post
Share on other sites

Posted · Report post

Firebug is an add-on you can get from Firefox.

Share this post


Link to post
Share on other sites

Posted · Report post

Thank you. I will work on the color thing with Firefox. 

 

Regarding the drop-down menu navigation, What I want to accomplish is that when I place the pointer on top of one of the pages in the navbar, the sub-pages title appears drop-down and then disappear when you move the pointer to the other menu options. This is what I already did:

 

- First, I switched to the Navbar classic as Danny suggested and now noticed the navbar turned all white (I tried to change the color back to black, but even when I selected the option it didn't change).

- Second, I created four sub-pages in the Pages section.

-Third, I created a menu using the menu functionality and placed the sub-pages on the menu.

 

After doing that, the sub-pages appeared in the menu navbar, but the main pages disappeared. I guess I should be doing something wrong.

 

Any help will be appreciated. 

Share this post


Link to post
Share on other sites

Posted · Report post

Do you have a live link you can post?

Share this post


Link to post
Share on other sites