my account links in the header

Good Day Sir! I Have a small problem that is bugging me. The my account links in the header,in my website header, I had it change to white along with the cart balloon, which supposed to be red. Somehow, it is reverting back to the default state. In the mobile and desktop views.. whenever i go to a different page.. Can u help solve this problem sir? Also would want to know how much it will cost to optimize my website? I will leave a link to the back end of my sit, because the maintenance mode is on

best Regards

Hello,

I have visited your website and cart and wishlist balloons are red. Please clear cache and check back.

Screenshot for Clarification: https://gyazo.com/cf1e80c6115dfb201b8bf858d53dadef

If you are trying to ask anything else then please provide me with some relevant screenshots of the specific area to check it myself and help you out accordingly.

Sorry but currently we are not offering any optimization services.

Best Regards

Good Day Sir! Sorry about so little information, here is a link that shows what im talking about here..for example the account links in the header that reverting back to the default state. it happens when click on a product and go to the product page.
here is the link. https://www.loom.com/share/4efec17928774de7bbf381b7bebf283a

I also left a link to the back end of my site, because the maintenance mode is on

Best Regards

Hello,

I watched the video you attached.

Please try adding the following Custom CSS in the Global Custom CSS area under Theme Settings >> Custom CSS.

.wd-tools-element .wd-tools-icon, .wd-tools-element .wd-tools-text {
color: white;
}

.wd-tools-element.wd-style-icon.wd-with-count .wd-tools-count {
  background: #83b735;
}

Regards.
Xtemos Studios.

Good Day Sir, The codes works perfectly, many thanks! However, the balloon for the cart icon is green sometimes red. Here is a what I’m talking about… https://www.loom.com/share/62c9b0a8d0d54c2097e2ed7da21a7462

Can u help me with this balloon? I Do have another problem that occurs but I would like to resolve this one first.

I also left a link to the back end of my site, because the maintenance mode is on

Best Regards!

Hello,

You are Most Welcome.

Sorry, but in the video, you sent the cart balloon color never changed to red. It’s always green.

Therefore if you want to change it to red then try adding the following Custom CSS in the Global Custom CSS area under Theme Settings >> Custom CSS.

.wd-header-cart.wd-design-2 .wd-cart-number, .wd-header-cart.wd-design-5 .wd-cart-number {
    background-color: red;
}

Regards.
Xtemos Studios.

Good Day Sir, I try the CSS code as u requested, However, it worked but didn’t, it caused the Wishlist balloon to be green and cart balloon don’t stay red it changes back to green. I have no idea if the codes are not agreeing with each other etc… However, I would like the balloons to be red..
here is clip how the codes are functioning : https://www.loom.com/share/3f62512931b146c68d030c20ac3b5621

I also left a link to the back end of my site, because the maintenance mode is on

Best Regards

Hi,

Sorry for misunderstanding. Here is the solution to both your issues:

1. The header item’s color scheme can be controlled via header row options. To change it, first navigate to the active header, select bottom row settings (https://prnt.sc/1dtwf36), select Colors tab and change text color scheme to light (https://prnt.sc/1dtlhef). After doing this, white color for header navigation can be removed from advanced typography (https://prnt.sc/1dtovnx).

2. In Woodmart 6.0 theme update we added automatic CSS generator which load parts of CSS styles only for elements which is placed on page. Since in that case some styles are loaded dynamically, they are loading after theme settings custom styles. Having custom CSS code selectors with same specificity as theme selectors make styles placed below advantage over others. In that case to overwright theme styles custom code selector need to have a higher specificity.

To remove style order advantage, custom CSS code selector need to have a higher specificity. In that case, an additional CSS class at the beginning will be enough. Here is example how to make your custom selectors specificity higher than theme style ones:

OLD. In some cases it will not overwrite theme styles if header cart styles will dynamically load after custom code:

.wd-header-cart.wd-design-2 .wd-cart-number, 
.wd-header-cart.wd-design-5 .wd-cart-number {
  background-color: #f5302a;
}

NEW. This code containt additional (.website-wrapper) class in the selector. In this case, the styles will always be overwritten regardless of the position of the rest theme CSS code:

.website-wrapper .wd-header-cart.wd-design-2 .wd-cart-number, 
.website-wrapper .wd-header-cart.wd-design-5 .wd-cart-number {
  background-color: #f5302a;
}

Try to replace your previouse custom code to the NEW one

Kind Regards

Good day Sir!!!! Thank You so much! The Codes Worked perfectly!
Best Regards!!

Great, you are welcome! Feel free to contact us if you have any additional questions.

[Author]

Posts