Changing the themes colour per page

Hi,

The currently available color options for the main menu, sub menu and mega menu are in the Theme panel->Theme colors header section – https://www.screencast.com/t/bw3EzE3sVC and there is no setting to set different colors for each menu item in the header main menu. However you could try to identify each of the menu items you want to modify, using the browser inspector – https://www.screencast.com/t/a1HFWCF9wI and change their color with some custom css – https://www.screencast.com/t/pv86r1FWjmpN
Here is a tutorial about using the browser inspector to create custom code – https://forum.tagdiv.com/create-custom-code-using-the-browsers-inspector/ and also the code used in the example (must be edited with you menu item id’s)

.menu-item-6537 > a {
color: yellow!important;
}

For different logo’s on specific pages you could follow this topic – https://forum.tagdiv.com/topic/different-header-images-for-different-pages-and-videos/ and try the suggestion mentioned there. There is no option to have different logo’s by specific pages by default.

Thanks

Hi,

You can use a code like in this example this – https://www.screencast.com/t/eUlSNk8urJ based on the menu item ID’s. The custom colors will show when the menu item is hovered. This is the code used in the example, you can change the colors to your liking, and enter it in Theme panel->Custom Css

.menu-item-63 a:hover {
background-color: red!important;
}
.menu-item-22 a:hover {
background-color: blue!important;
}
.menu-item-21 a:hover {
background-color: green!important;
}
.menu-item-20 a:hover {
background-color: pink!important;
}
.menu-item-715 a:hover {
background-color: brown!important;
}

Thanks

Hi,

The current menu item background color is linked to the theme accent color – https://www.screencast.com/t/yzpEtCvFTYZ and it is the same for all of the menu items. It would be difficult to set a current menu item for each of the menu items. You could use a different color for this state – https://www.screencast.com/t/gMbB0yNZ or do something like this – https://www.screencast.com/t/hXTHYW9iL for each of the menu items.
You can make another code like the one provided above and replace the a:hover with a:visited for all the menu items and use the same colors, then add it after that code in theme panel. It could work this way, give it a try. If a delay is visible between the color change, try adding the codes directly in the theme style.css found in the theme folder, at the end of the file.

Thanks

Hi,

@widfara You can change the font properties for the menu items in Theme panel->Theme fonts
– https://www.screencast.com/t/ipHbfDJhDdea
If this is not what you wanted, please provide a link to your website and detailed information about what and how exactly you want to change the menu items, so I can give you a more accurate solution if possible.

Thanks