Da Vinci 2.0 header ( upper main menu) and footer color change.
- Thread starter danysh
- Start date
E
Ekaterina Sayapina
Guest
Hello,
Please go to your WP dashboard => Customization => Head and paste these code snippets into CSS style:
.footer {
background: YOUR COLOR;
}
.upheader {
background: YOUR COLOR;
}
Please note that these will only change background color. You might also need to change text and links color, too.
Direct Webstore
Well-Known Member
I am facing another problem when I add sub category from product category it’s not showing on main page category menucan you please guide me .... we meeee to upload new products thanks
Do you have any products in the sub category? I think it is hidden when there are no products. Just edit any product and tick the sub category, save and check. Untick it after testing.
Direct Webstore
Well-Known Member
It "should" work then. But without further information or being able to look at your setup, it's impossible to say what the problem is. You may have to give Support admin access so they can have a look.
Direct Webstore
Well-Known Member
Post this into Appearance>Customize>Additional CSS
Or ... here ..
.mainnav ul li>a {
color: YOUR COLOR;
}
.mainnav ul li:hover>a, .mainnav ul li:active>a {
background: YOUR COLOR;
color: YOUR COLOR;
}
Get colour codes here ... https://www.w3schools.com/colors/colors_picker.asp
Last edited:
Direct Webstore
Well-Known Member
Not without creating a child theme and editing the single-product.php file.
Direct Webstore
Well-Known Member
For creating a child theme and editing files? You have to learn how to do it yourself or find a freelancer somewhere.
I don't see the necessity for it myself. You have security icons in the footer and even more at the checkout page. Using them too much looks fake ... in my opinion.
Post this into Appearance>Customize>Additional CSS
Or ... here ..
.mainnav ul li>a {
color: YOUR COLOR;
}
.mainnav ul li:hover>a, .mainnav ul li:active>a {
background: YOUR COLOR;
color: YOUR COLOR;
}
Get colour codes here ... https://www.w3schools.com/colors/colors_picker.asp
Hi this is for the main navigation(product categories) right?
1) How about the text color for the .upheader? How do we change the colors for the upheader
2) I tried editing within the CMS but it's only changing desktop view header color and mobile view (except text color, which I dont know how to change). Header bar in "tablet view" still remains dark-blue-ish
Direct Webstore
Well-Known Member
Right
Here's all my CSS for the top header and header area ... take your pick which ones you want ... edit the colours.
Just paste the whole lot into Appearance>Customize>Additional CSS ... and see what it looks like and delete the bits you don't want. (You can see the changes on the right as you delete them.
.breadcrumbs a, .top-header ul li a {
color: #000000!important;
}
.header .cart {
border-color: #ffffff!important;
}
.header, .header .shipping, .header .tbtn, .top-header {
background: #ffffff!important;
border-color: #ffffff!important;
}
.top-header {
background: #000000!important;
}
.header, .header .shipping, .header .tbtn, .top-header {
border-color: #000000;
}
.top-header ul li a {
color: #ffffff; }
.breadcrumbs a, .top-header ul li a {
color: #ccc!important;
}
.top-header__mail, .top-header__phone {
color: #ccc;
}
.search-form .btn-danger {
border-radius: 3px!important;
background: #005e8e!important;
color: #ffffff!important;
border-color: #005e8e!important;
}
.search-form .btn-danger:hover {
border-radius: 3px!important;
background-color: #595959!important;
border-color: #595959!important
}
Text colour are these color:
The rest are border and background colours
Direct Webstore
Well-Known Member
WAIT!!!!
This is for Davinci1 ... just remembered this thread is for Davinci 2
The menu CSS is for D2 though
This is for Davinci1 ... just remembered this thread is for Davinci 2
The menu CSS is for D2 though
Direct Webstore
Well-Known Member
So time for CSS Lesson No.1
1. In Chrome ... put the mouse curser on the area you want to edit (e.g top header)
2. Right click and then click "Inspect" at the bottom of the popup
3. A panel will pop out on the right with the CSS code for that area. You can even edit the code in that panel and see the changes. Then you can copy/paste the code into Additional CSS
The changes made in that panel are temporary. It will revert to normal after you refresh the page.
Lesson 2
If any colour changes etc don't work ... try putting !important after the colour, size etc.
e.g color: #ffffff!important;
1. In Chrome ... put the mouse curser on the area you want to edit (e.g top header)
2. Right click and then click "Inspect" at the bottom of the popup
3. A panel will pop out on the right with the CSS code for that area. You can even edit the code in that panel and see the changes. Then you can copy/paste the code into Additional CSS
The changes made in that panel are temporary. It will revert to normal after you refresh the page.
Lesson 2
If any colour changes etc don't work ... try putting !important after the colour, size etc.
e.g color: #ffffff!important;
Direct Webstore
Well-Known Member
Maybe some of that code will work for D2 ... try it and see. If not ... see lesson 1 and 2 above.