Hello everyone,
I would like to display an additional level in the side navigation. In the Skin Editor, it is only possible to customize the appearance up to the 4th level. However, I need a 5th level. Is it possible to achieve this, and if so, how can it be done?
I know that it can be configured in the top navigation, but that is not an option for us. I need to stick with the side navigation.
Toc depth - side navigation
Re: Toc depth - side navigation
You can't add levels in the skin editor, so you have to do this yourself using CSS that customises the output.
In my case, I needed to set the indentation for menu items on levels 5-7.
So in the example below, this selects the side navigation container (ul.sidenav ...), selects five levels deep in the menu (... ul ul ul ul ul ...), then selects the hyperlinks directly inside the list items on that level (... > li > a).
In my case, I needed to set the indentation for menu items on levels 5-7.
So in the example below, this selects the side navigation container (ul.sidenav ...), selects five levels deep in the menu (... ul ul ul ul ul ...), then selects the hyperlinks directly inside the list items on that level (... > li > a).
Code: Select all
ul.sidenav ul ul ul ul ul > li > a /* 5th level menu indentation */
{
margin-left: 5rem;
}
ul.sidenav ul ul ul ul ul ul > li > a /* 6th level menu indentation */
{
margin-left: 6rem;
}
ul.sidenav ul ul ul ul ul ul ul > li > a /* 7th level menu indentation */
{
margin-left: 7rem;
}