-
Posts
-
Hi,
I’m building a site that uses transparent menus on several pages. On some of the pages I need the transparent color to be white, and on other black. I can see how to set the color for all pages in theme options, but can you tell me the custom css to set it for an individual page?Thanks
RichardHi Richard,
You can use the page-id class for page specific CSS, if you inspect the page in question you will find it in the body tag. If you should need any further help then please link to your site and try to explain your problem in greater detail.
Regards,
RikardHi Rikard,
Thanks for getting back to me. Here is the page: http://henrysegerstromdevsite.webfour.net/index.php/temptest/
It has #222222 for the transparency header, as that is the global setting, but I would like it to be #ffffff; I found this CSS:
#top #header .av-main-nav > li > a .avia-menu-text, #top #header .av-main-nav > li > a .avia-menu-subtext {
color: #222222;
}
So, I can change the #222222 to #ffffff, but I do not know how to create the page-id class for this. I’ve create classes using the color area, but nothing like this. I’ve indicated the login in the private section below in case its easier for you to just implement the change.Thanks for your help!
Hi,
We are very sorry for the delay. Changed the menu item font color of the transparent header in the Enfold > Header > Transparency Options > Transparency menu color option.
Best regards,
IsmaelHi Ismael,
I know how to change to color globally, but if you read the post thread, you will see that my question pertains to changing it on certain pages.
Thanks
RichardHi!
To change it on certain oages it would require some customisations and a page if statement to apply the CSS.
Please consider to hire a freelance, who will be able to assist you with that process.Thanks a lot
Cheers!
BasilisWhy is that? I only want to change the color of the menu on individual pages. Other themes I’ve worked with have provided a simple CSS change that gave a page ID, the nav, and then the color change. I’m sure this is possible of Enfold.
Thank youHi,
Great, glad you figured it out. Please let us know if you should need any further help on the topic.
Thanks,
RikardHi
Using transparent menus throughout the site, some pages have white text, some black. I was able to change the individual pages with this code – but now its not working:
.page-id-2.av_header_transparency .av-main-nav>li>a>span.avia-menu-text {
color: black !important;Does the code look right?
Hi – I did resolve the above by using #ffffff as the default trans menu color, and then for individual pages that use another color:
.page-id-2 .av_header_transparency .av-main-nav>li>a>span.avia-menu-text {
color: #666666 !important;
}But, the active item line under the selected menu item still remains #ffffff – is there a way to also make this #666666 for those selected pages?
Thanks
Actually, I just need to make that active item line #00a8e0 regardless of what color the menu item font is.
ThanksHi,
go to Enfold->Advanced Styling and choose “Main Menu” to customize it.
You can check “Apply only on mouse hover” if you want.Best regards,
AndyWow, this is an answer to a question I did not ask. What I did ask is about the line that appears under a menu item when you mouse over a navigation element. I would like to have that line be #00a8e0 whether the header is in regular mode or transparent.
Thank youHi,
use this code inside Quick CSS field:
#top .header_color.av_header_transparency .avia-menu-fx { background: #00a8e0; }Best regards,
Andy
- The topic ‘Transparent menu’ is closed to new replies.