Activating Dark Mode

I applied the dark mode but it only seems to change things half way. The typography switches to white but the backgrounds stay the same. Only the sticky category navigation on the left sidebar changed colours.

I am also wondering if there is a way to change the icon or icon colour for the sticky navigation? I can change it for the menu item that toggles it but cant find it in the settings for the same icon on the left.

Attachments:

You must be logged in to view attached files.

Hi kayss,

Thanks for reaching to us.

Please navigate to Theme Settings > Styles and colors > Pages background. You can change the background of Shop pages, Blog pages, Portflio pages.

In case you want to do it for specific post / page only, you can use Theme Presets, please refer to our documentation https://xtemos.com/docs-topic/theme-settings-presets/

Regards,

what about for the product widgets/carousels, is there a global option to change the colour of those so I can see the writing thats now white?

You also didn’t answer this: “I am also wondering if there is a way to change the icon or icon colour for the sticky navigation? I can change it for the menu item that toggles it but cant find it in the settings for the same icon on the left.”

Hi kayss,

1. For the Product widget, you can edit Widget and remove custom Products background https://prnt.sc/g2jEs4Ml5CCv

2. Icons

Go to Woodmart > Header builder > edit default header (highlighted star icon) or you can go through admin bar directly https://prnt.sc/Ct9ehRDvvDV9

Click on Pencil icon to edit icons https://prnt.sc/HnXHHU77wM2z Here you can change colors, background color as well https://prnt.sc/NrexxtBXmgwN

Please read our documentation here for more details https://xtemos.com/docs-topic/how-to-change-the-header-color-scheme/

Regards,

I asked about the icon for the sticky navigation on the left, not the one in the header. I already mentioned this.

Hi kayss,

That is Image icon, so you can use Custom CSS to change its color. You can use Photoshop or image editor to colorized it and reupload to your site https://prnt.sc/bh2bta2juMD-

Or you can use Font Icons instead https://prnt.sc/HD8H182zg-qI and add below Custom CSS code to Theme Settings > Custom CSS > Global custom CSS to change color

.wd-nav-sticky .wd-nav > li > a .wd-nav-icon {
    color: #FDB729;
}

Regards,

I want to change it to a completely different icon, is it possible?

Hi kayss,

That’s total fine.

You can take a look list of FREE FontAwesome 5 icons here https://fontawesome.com/v5/search?o=r&m=free

Regards,

Thanks but I need to know how to actually change the icon. Wheres the setting for it? As I mentioned, changing the menu item icon doesnt change the one for the sidebar.

Hi kayss,

You can apply the icon via its settings, or rather via Appearance -> Menus -> choose Categories menu > open that menu item and define the “Icon name (from FontAwesome set)” field https://prnt.sc/3Lqhj_TLcc1a

Regards,

I want to change the top icon that normally shows the 3 lines to signify it is a menu toggle, not the actual menu items. Its the icon that shows right above them.

Hi kayss,

You want to change hamburger icon, please confirm me back. https://prnt.sc/Wv79fpwCz5Af

Regards,

Yes

Hi kayss,

Add below Custom CSS code to Theme Settings > Custom CSS > Global custom CSS

.wd-sticky-nav .wd-sticky-nav-title:before { 
	 content: "\f124" !important; 
}

In order to see full list of icons, please go to Theme Settings > Typography > Icon fonts https://prnt.sc/uhovgVvcpkSN

Regards,

[Author]

Posts