PageLines Support

cdedse

Last week bought Pagelines 2 after trying the demo version. I went through your FAQ and docs but could not find answers to my question and hence I am here.

How do I change the background and text color of items in the Main menu and Secondary Navigation menu?

How do I set the text color and background color of menu items when hovering over the menu item?

How do I set the text color and background color of a menu item that is currently active?

Since could not change the text color of the active menu item from white to some other color, that menu item disappears from the active page.

Hope you will help me at the earliest to fix my problems.

Thanking you in advance

Regards
Vinayan

Danny

Hi Vinayan,

Please read through this forum topic, it should have most of what your trying to do. If there is anything missing, please reply here and we can assist you further.

http://www.pagelines.com/forum/discussion/15956/pagelines-framework-2.0-css-tweaks.#Item_1

cdedse

Dear Danny,

Thank you very much for your response regarding how to change the menu text color and its background. But sorry to say that this did not help me much as this is not I was looking for.

What I need is this:

The The primary Menu background color to be Black for all the item and sub menu item with text color say, white. (White letters in black band)

When I hover over the menu or sub menu item, Background color red and text color white.(Some highly Contrasting back ground and bright text)

When I select an item from the menu or sub menu, I do not mind the selected item is shown as white text in black background. If the selected menu item's background can be made, say, dark green with white text, I will be more than glad.

What I am trying to say is basically to have a background color and text color so that menu items and sub menu items can be easily read in all conditions, while hovering or when a drop down menu appears or when a item is selected.

Further, please also tell me How to remove the shadow option of menu text?

Please do help me at the earliest.

Regards
Vinayan

rangelone

Vinayan, Please reply with a link to your site so we can take a look. Thanks.

cdedse

Dear Rangelone,

Thank you very much for your response. I can not give the link because now I am testing it on my local computer, not at my web space.

I will try to explain with respect to my demo pagelines site at http://demo.pagelines.com/econdse/. But at the demo site, things are little different than what I have on my local computer.

As you can see in the demo site, all the Menu texts are in black (The color of the Primary Text). When I hover over other menu items the background changes to gray with text remaining as black.

When a drop down menu appears, there also the text is black with menu item background a gray shade and when you hover over the submenu items in the drop down menu the background changes to a lighter gray shade.

When I click on Home or People --> Faculty from the menu, the respective page gets displayed and the currently selected menu item is shown with text as black itself with a slightly light shade of gray background to show that is the active menu item.

I will be reasonably happy if I could at least make a menu like the one I have in my demo site with the pagelines I bought.

In my local installation, The active menu item's text color is set as white with a very very light gray background which makes it impossible to read. If I click on my "Home", the Home item on the menu almost disappears. Same for any item selected from the Main menu or any of its sub menu.

Could you help me to have a menu:
1. with a dark color say "Black" as background,
2. with a contrasting light text color, say "White".
3. another color, say "Dark Gray" when i hover over the menu item or sub item as its background with text color same as "White".
4. When I select an item or sub item, then display the selected menu/submenu item with text color "White" and background "Dark Gray"

Same problem happens with my secondary navigation menu also with pagelines we bought.

In http://demo.pagelines.com/econdse/, if you go to People --> Faculty page and Click on "Deepti Goel", it will open the post of that particular person with a secondary menu on top of the post. Here when you click on any secondary menu item, the active item is displayed in the same color as that of others in the secondary menu in each post. That is OK for me. But in my paid Paglines installation, the active item of the secondary menu is displayed in white. This makes it impossible to read.

Could you tell me How to change the text color of the active secondary menu item?

Hope I could explain my problem properly. Looking for an early response.

Thanking you

Vinayan

Danny

Hi Vinayan,

The link I provided, is an example. All you need to do is change the color codes to whatever color you like.

For example:

Main Navigation as Black, you would use this:

#nav .content-pad { background-color: #000000;}

Main Nav font color as white:

.main_nav li a { color: #FFFFFF; }

Main Nav font color as grey on hover:

.main-nav li a:hover,
.main-nav .current-menu-ancestor .current_page_item a:hover,
.main-nav li.current-menu-ancestor ul a:hover { background-color: #282828; color: #ccc; }

All I have done above was simply copied and pasted the code from the link I provided you and then change the color code, that's it. I've provided a link below to a hex color code generator for you to make life easier.

http://www.colorschemer.com/online.html

cdedse

Dear Danny,

Thank you very much for your help and sorry for the delay in responding as I could check your response only now. Now I have the Main menu back ground color and text color as I wanted.

But this does not fix the drop down menu text color and background color. The drop down menu items are still displayed with very light shade of gray with text color white making it impossible to read what is there in the drop down menu. (But your suggestions does make background dark gray when I hover over the menu or sub menu. Now when I hover, text color is white with dark gray background)

The problem with secondary menu also remains to be solved. Please tell me
1. How to change the text color of the menu item in the secondary menu.
2. How to change the text color of the active menu item.
As of now the active secondary menu item is displayed in white, which makes the item disappear from the menu.

If you can tell me how can attach an image here, then I can paste the screen shot here. (I will anyway send the screen shot though email)

Regards

Vinayan

Danny

Hi Vinayan,

Creating a second topic for the same issue that is already open isn't a good idea, it will simply confuse the forum support team.

Therefore I have closed your new topic and replied here instead. Please don't double post.

I recommend you either use the Google Chrome Web Developer console or install Firebug for Firefox, this will help me immensely.

I have provided you with code below for the drop down menu, use this as a guide.

.sf-menu li li, .sf-menu li li li {
background-color: #000000;
}

ul.sf-menu ul li {
border-bottom: 1px solid #333;
}

ul.sf-menu ul li a {
color: #FFFFFF;
}

ul.sf-menu ul li a:hover {
background-color: #252525;
color: #888;
}

ul.sf-menu ul li a:hover,  ul.sf-menu ul li a:active {
color: #888;
background: #444;
}

cdedse

Dear Danny,

Thank you for your response, but really sorry to say that this one also did not help me at all.

I hope I did explain my problems with the main menu and secondary menu properly.

I wish you could at least help me fix the problem with secondary Navigation menu before the site goes online. (Once the site is up, you can see how the main menu and its sub-menus are and help me fix it. As of now, though it is not the way I wanted it to be but I think I can manage with it unless my boss says no to it.)

1. How to set the text color of the secondary Navigation menu?
2. How to set the active secondary menu item text color?

I have 6 items in the secondary menu and they are :

About Page,CV,Research,Teaching,Supervision and Miscellaneous. Each links to corresponding posts of individual faculty.
Whenever any item is clicked on the menu, that menu item is displayed in white text, which makes it disappear from the menu.

Please help me. I have to do a presentation on this site on Monday, 13th Feb.

Regards

Vinayan

PageLines Support

Useful Links

Howdy, Stranger!

Categories

In this Discussion

Weekly Karma