[Resolved] Change the menu style in Toolset Starter Theme

[Author]

Posts

[kelvinL-2]

Dear Sir/Madam,

I use the Layout to design the page, I use the Toolset Starter as the theme. I don't like the menu style, I don't want to have background color or the menu item, I want to have color text to the menu item. I change the Primary color to my favour color but that is not what I want. How can I change the menu css? Which elements are related to the menu?

Best regards,

Kelvin.

[Christian Cox]

Hi, you can write any custom CSS you would like to override the Toolset Starter Theme's styles. You can also go to Appearance > Customize > Advanced Settings to disable the theme's CSS. Then you can add any CSS overrides in Toolset > Layouts CSS, or to a child theme's style.css file. To remove the background color from the main menu and make the link text red, you can do something like this:

.navbar-default, body .ddl-navbar-default {
    background: none;
}

.ddl-navbar-nav > li > a {
    color: red;
}

[kelvinL-2]

Dear Christian Cox,

Many thanks for your prompted reply, I found the element should be

body .ddl-navbar-default .ddl-navbar-nav >li > a, 
body .ddl-navbar-default .ddl-navbar-nav>.current-menu-item > a {
    color: red;

By the way, may I know any documentation about these elements on Toolset site? I think I need more in-depth information about all menu items' element including the sub-menu. Having the documentation, it is good for us to have our own theme design base on the Toolset Starter theme. Hope you can help.

Best regards,

Kelvin.

[Christian Cox]

Actually no, there is no additional documentation on the site about the menu elements or the CSS styles that apply to them. Note that the existing TS theme documentation says:

Toolset Starter is a clean and modern Bootstrap-based theme designed to help you get started using Toolset plugins.

https://toolset.com/documentation/user-guides/toolset-starter-theme/#about-the-theme
In other words, Toolset Starter is not designed to be fully customizable and extensible for your site needs, it's designed to help you get started with Toolset and understand the components of our software suite. If you want to build your own custom theme, then I do not recommend using Toolset Starter as anything but a reference. Customizing the Toolset Starter theme will be difficult, and you will spend more time fighting the existing theme than will be time- or cost-effective.