- This topic has 6 replies, 3 voices, and was last updated 3 years, 3 months ago by
.
-
Posts
-
Hello.
When you see the page on the link, I need to change the color of heading.
Is there an easy way to change the color? or do I have to change all the colors?I have elements to merge header. when I tried to change color there, it changes colors of all pages.
For specific page, I can use the page id, but for some page like single product, I don’t have the id.heading background color: #FFFFF3
title, menu item, border on bottom, border between menu: #566270
menu hover text color: #FFFFF3
menu background hover: #566270Could you help me with this?
Customer Support
Hi there,
you have a Header Element on your site that is merging your front page, if you edit that element, you can set the Header Colors and those colors will only apply where the element is located.
You can then use a the Customizer Colors to set the color on pages without the header element.
I did it as you said.
One problem is that,
when you see the first link, you can’t see the second navigation.
it is because there is no option to set color for second navigation on the elements.Secondly, on the second link, you can see the white border between main menu items.
I need to change it to black color in this case.
So, when header merged, the border color is white and whe not merged, the border color is black.Is it possible to set like this.?
Customer Support
1. Try adding this CSS to show the secondary navigation, change the
whiteandpurpleto your color code..header-wrap nav#secondary-navigation ul li a { color: white; } .header-wrap nav#secondary-navigation ul li:hover a { background-color: purple; }2. Try adding this:
.header-wrap .main-navigation .main-nav > ul > li:not(:first-child):after { background-color: white; }then change the
background-colortoblackin your original CSS:.main-navigation .main-nav > ul > li:not(:first-child):after { content: ""; height: 50px; width: 0.7px; background-color: #FFFFF3; position: absolute; top: 50%; transform: translateY(-50%); }.header-wrapper .main-navigation .main-nav > ul > li:not(:first-child):after { background-color: white; }.header-wrap .main-navigation .main-nav > ul > li:not(:first-child):after { background-color: white; }I just changed wrapper to wrap, will it be ok? now it works.
Additionally, I need to change the color of underline of header to black when the header is not merged.
.inside-header { border-bottom: 1px solid #FFFFF3; }this is the code to add underline on the header and I need to change the color to black when the header is not merged.
It is solved!
I just added this code
@media (min-width:1100px) { .header-wrap .inside-header { border-bottom: 1px solid #FFFFF3; } } @media (min-width:1100px) { .inside-header{ border-bottom: 1px solid #566270; } }Sorry about my typo, it should’ve been
header-wrap, notheader-wrapper, glad you’ve figured it out 🙂
- You must be logged in to reply to this topic.
