-
Posts
-
Hi,
I have asked for menu transparency before and you gave me the CSS to do that, Thank you very much, My question: is As the menu will be in very page and sadly i don’t have uniform pages at all, is there any chance to override menu transparency (back to normal settings,defined in general settings) in specific pages or portfolio.?
Thank you very much.
Hey hdpcr,
Yes this can be done on selective pages. There are 2 ways you can do this I can tell for sure if you share a link to your site.
1. Select a transparent header in the page layout on the right side.
2. Right click > Inspect the page where you want the transparent menu and in the < body > tag find the css class name “page-id-xx” just add this page ID in front of the CSS provided.If you have any questions please share a link to your site with the code provided earlier.
Best regards,
VinayHi
Sorry, i didnt know i had to try it. I was awaiting for the second way as Vinary said this: here are 2 ways you can do this I can tell for sure if you share a link to your site.
So i wasnt sure if something else is missing before tryingCould you please explain with a bit more detail i really didnt understand what to do
The code i have is
.header_color .header_bg, .header_color .main_menu .menu ul li a, .header_color .pointer_arrow_wrap .pointer_arrow, .header_color .avia_mega_div, .header_color .av-subnav-menu > li ul, .header_color .av-subnav-menu {
background-color: transparent;
}.header_color .main_menu ul ul, .header_color .avia_mega_div {
background-color: rgba(0,0,0,.3);
color: #808080;
}Thank you
Hi,
check out this: https://en.support.wordpress.com/pages/#how-to-find-the-page-id
And here is an example of how page-ID’s work: https://kriesi.at/support/topic/changing-a-specific-page-with-quick-css/#post-223394
Best regards,
AndyHi
So if i underdstan i have to as below before each periode? caus i did and it didnt work. Also what how do i do if its for 2 or 3 pages should i have the code 2 or 3 times??
Thank you very much
/* Transparent Memu
*/
.page-id-xxx .header_color page-id-xxx .header_bg, page-id-xxx .header_color page-id-xxx.main_menu .menu ul li a, .header_color .pointer_arrow_wrap .pointer_arrow, .header_color .avia_mega_div, .header_color .av-subnav-menu > li ul, .header_color .av-subnav-menu {
background-color: transparent;
}page-id-xxx .header_color .main_menu ul ul, .header_color .avia_mega_div {
background-color: rgba(0,0,0,.3);
color: #808080;
}Hi,
Have you tried the “Header visibility and transparency” options in the page Layout on the right sidebar? i think this should work for you on page by page basis to set a transparent header/menu. If this don’t serve the purpose then yes you have to add the page id for every page and achieve it using css.
If yous till have any issues please post us a screenshot/mockup of what you would like to achieve? You can upload the screenshot to imgur.com or dropbox and share the link here and we will provide you with css code for it:)
Best regards,
VinayHi
Yes i have and all site is based on transparent header. So i guess i will haev to add it for a specific page.
Now i just need to know the right CSS based on the code i provided above.Thank you
Hi,
yes, you have to add the code two or three times. Your code looks good to me, just find the correct page-id. Let us know if you still need help with it and if yes then send us the precise links to the pages in question.
Best regards,
AndyHi,
as already said: send us the precise links to the pages in question.
Also post admin access here again as private reply, so we can check everything.Best regards,
AndyHi,
The login URL to access the dashboard gives a 404. However to make a transparent menu in Enfold you do not have to use any custom css these options are built in you just have to select them on the pages.
You can switch between transparent and no transparency header in the Layout options of the page. Please try this option if this is not what you are looking for would you mind posting us a screenshot/mockup of what you would like to achieve? You can upload the screenshot to imgur.com or dropbox and share the link here :)
Best regards,
VinayHi
I’m aware of that but this is not what i’m looking for as i already i have explained and i already have posted Custom CSS given to me. It is not the transparent header but the menu it self and it is now but i need to make it normal (not transparent in certain pages i will define.
Please read previous posts i was talking about a whole other thing with Andy.
To summarize it
1. I have the CSS to make menu background transparent.
2. Hole site has Menu with solid black background.
3. In certain pages i will need to aply that code to make menu background transparent.Thank you
Hi,
I put this code inside your Quick CSS field:
/* Kriesi custom code */ page-id-6156 .header_color .header_bg, .header_color .main_menu .menu ul li a, .header_color .pointer_arrow_wrap .pointer_arrow, .header_color .avia_mega_div, .header_color .av-subnav-menu > li ul, .header_color .av-subnav-menu { background-color: transparent !important; } /* Kriesi custom code END*/and it seems to work fine for me. Can you confirm please?
Best regards,
AndyHi
Yes i saw it and its transparent in that page but it still transparent in all othe pages witch is not what i want. please check on the front page and you will see it.
Thank you very much
Hi,
As I understand you require some pages to have a transparent header and some need to be solid correct?
It is not clear why you are not using the inbuilt feature to make the header transparent in the pages where you need a transparent header?
Best regards,
VinayHi Vinay,
It is not about the Header at All. Ii is the MENU Background Header is fine its the menu background the transparency when hover i need to have different in a few pages.
In fact the code way above is about the Menu background when hoverThank you very much
Hi,
it’s quite unclear to us what you want to achieve, but try this code:
.page-id-6156 .avia-menu-text { background-color: transparent; } .page-id-6156 #top #wrap_all .av_seperator_big_border#header .av-menu-button-colored > a { background-color: transparent; }A mockup showing the results you want to achieve would help us a lot (use imgur.com, dropbox).
Best regards,
Andy
- You must be logged in to reply to this topic.