-
AuthorPosts
-
September 18, 2017 at 2:02 am #853186
I would like to adjust my headercolor to a specific color on selevt pages. Can I achive that and of so, how?
Thank you!
September 18, 2017 at 5:24 am #853213Hey fabienneBESD,
You can do it using custom CSS code and the particular classes of these pages. Please, provide to us a page link and I will give an example for you.
Best regards,
John TorvikSeptember 18, 2017 at 1:41 pm #853386HI
I would like to assign special olor to header and footer on all the different sites of main menu
‘Sexarbeit’ ‘Wir über uns’ ‘Netzwerk’ and so forthSeptember 19, 2017 at 2:56 pm #853870I managed to do this:
.page-id-118 #header {background-color: #e04d0d !important; }it changes the color, but just very very light. Is there a transparency setting I need to adjust as well?
September 20, 2017 at 8:38 pm #854549Hi,
I have checked your site and the orange color doesn`t look light, can you explain which area do you want to more opacity?
Best regards,
John TorvikSeptember 20, 2017 at 9:42 pm #854565Hi, sorry for the confusion. I progressed without updating you guys.
Here is what I did:.page-id-118 #header_main , .page-id-118 #scroll-top-link, .page-id-118 .avia-menu-fx, .page-id-118 #socket{background-color: #e04d0d !important; }
I am not sure this is the smartest way to do it.
I will have 5 main sections on the site Sexarbeit | Wir über Uns | Netzwerk | Presse | Kontakt
each section will have several subpages and also subcategories.
Each subsection is supposed to get their own colorscheme. It seems that I will have to add the colorscheme via Page Id for each single page individually. As I am all together using up to 40 and more pages, this seems odly elaborate. Do you have a better way of doing this?Also I would be eternaly thankful to get the id selectors for:
changing background color of submenu
changing the main navigation font color AND hover color
changing font-color of search icon and social icons of main header
changing font color of social media icons on socketThank you
Thank you.
September 23, 2017 at 2:49 pm #855804Hi,
Another option to individually adding your color scheme per page for sub-pages, is to use “parent-pageid” such as “parent-pageid-120” for all the child pages of Wir über Uns. But note that for child pages of wir-ueber-uns/positionen/ you would use “parent-pageid-559”
example:.parent-pageid-120 #header_main , .parent-pageid-120 #scroll-top-link, .parent-pageid-120 .avia-menu-fx, .parent-pageid-120 #socket{background-color: #000 !important; }
but you would have to remove your other code for the child page as the !important; will conflict with this code, but keep the parent page code. Please see screenshot in Private Content area, as it may help explain better.
*changing background color of submenu
.header_color .main_menu ul ul,.header_color .main_menu .menu ul li a {background-color: #000 !important;}
*changing the main navigation font color AND hover color
Please try Enfold Theme Options > Advanced Styling > menu
*changing font-color of search icon and social icons of main header.header_color .social_bookmarks a,.header_color .main_menu ul:first-child > #menu-item-search > a {color: #000 !important;}
*changing font color of social media icons on socket
.socket_color .social_bookmarks a {color: #000 !important;}
Hope this helps :)
Best regards,
MikeOctober 1, 2017 at 6:23 pm #858947Hello Mike!
This seems to be exactly what I need and so much easier than editing each and every page-id.
Thank you.
Sadly the screenshot didnt work, but I think I can manage without.October 1, 2017 at 6:40 pm #858949October 1, 2017 at 6:45 pm #858950Maybe leave it open until I am finished implemented. Just in case i have questions or run into problems.
If it is not too inconvinient for you guys.October 1, 2017 at 6:52 pm #858953Question:
*changing the main navigation font color AND hover colorI would adapt this settings for each subpage as well.
Could you provide the id selectors please?October 1, 2017 at 7:14 pm #858959Basicly what I want is a way to change all the font colors of all menus on all pages to a light grey and the hover font color of all menus to a very dark grey, except on the frontpage.
If I use the enfold menu option under Advanced Styling I can only change that globaly.
October 1, 2017 at 9:05 pm #858989Hi,
Perhaps a good approach would be to use the Advanced Styling to change it globaly, and then we can write code for the one page that is different, ie: frontpage.
Did I understand that right?Best regards,
MikeOctober 1, 2017 at 9:11 pm #858990Yeah, I am already happy with the styling for the frontpage, so that is fine. Header background on frontpage is white, but Header background on many of the subpages is colored and thus hard to read, so i would like to change them.
Basicly, the frontage (and single post pages, custom post pages used by plugins, etc) are allright how they are now. But all other pages need adjustment.
October 1, 2017 at 9:28 pm #858993Hi,
Sorry for the questions, but when I look at your site the header looks red on all pages, yet you say the “Header background on frontpage is white” perhaps I’m looking at the wrong thing? Can you please add a screenshot to point out what you see?Best regards,
MikeOctober 1, 2017 at 9:30 pm #858994See links below:
October 1, 2017 at 10:22 pm #859009Hi,
Ah, I was looking at the wrong site :)
OK, so it looks like the menu is “light grey with a hover of dark grey” this is how you wanted it right?
how can I help?Best regards,
MikeOctober 1, 2017 at 10:27 pm #859011That is perfect on Frontpage, and all single post pages, including the custom post pages done by plugins.
But on all subpages (Sexarbeit, Wir über uns, Service, Presse, Kontakt) and the relevant subpages I would like to adjust it, preferable via the parentid or page-id fix. This will give me the liberty to adjust it accordingly on all pages suitable to the color.
To do this, I would need the id selectors that change the menu font color (including submenus), the hover color and also the highlight color that shows on which page you are on atm on the main menu.
October 1, 2017 at 10:52 pm #859020Hi,
/*menu color*/ .header_color .main_menu ul:first-child > li > a {color: blue !important;} /*menu hover*/ .header_color .main_menu ul:first-child > li > a:hover {color: #fff !important;} /*sub-menu*/ .header_color .main_menu .menu ul li a {color: green !important;} /*sub-menu hover*/ .header_color .main_menu .menu ul li a:hover {color: #fff !important;}
You can add your page-ids to these to set them to each page, adjust colors to suit.
Best regards,
MikeOctober 1, 2017 at 11:04 pm #859027Thank you! You are the best!
October 2, 2017 at 7:50 am #859117Hi,
You are welcome!
Best regards,
John Torvik -
AuthorPosts
- You must be logged in to reply to this topic.