How do you create an additional vertical menu style

BillyBob
70 Posts
BillyBob posted this 19 January 2016

I'm working with the latest beta of Themler and with an up to date Joomla site. What I'm trying to do is create an additional vertical menu so I can apply different styles than the one vmenu style I already created. Specifically, I'm wanting to hide my vertical menu on certain pages for phone and table, but only a select few pages. So how do I create an additional vmenu style on the Themler side.

I'm working with the latest beta of Themler and with an up to date Joomla site. What I'm trying to do is create an additional vertical menu so I can apply different styles than the one vmenu style I already created. Specifically, I'm wanting to hide my vertical menu on certain pages for phone and table, but only a select few pages. So how do I create an additional vmenu style on the Themler side.
Vote to pay developers attention to this features or issue.
7 Comments
Order By: Standard | Newest
Support Team
Support Team posted this 19 January 2016

Hi,

The page display is set in the admin part.

Thank you!

Hi, The page display is set in the admin part. Thank you!
BillyBob
70 Posts
BillyBob posted this 19 January 2016

What? Can you please re-read my question. How do I have 2 vertical menus with 2 different styles? On the CMS side it's easy enough to made an additional vmenu, how do I STYLE IF DIFFERENT in Themler than the one I already have styled?

What? Can you please re-read my question. How do I have 2 vertical menus with 2 different styles? On the CMS side it's easy enough to made an additional vmenu, how do I STYLE IF DIFFERENT in Themler than the one I already have styled?
Support Team
Support Team posted this 22 January 2016

Hello Shawn,
you may create two different menus in Joomla admin back end and then locate then in two different modules.
Just in case: this article describes how to set up vertical menu in Joomla
http://answers.themler.com/articles/6643/how-to-create-vertical-menus-in-joomla

Two make one of modules look different you may set up one of modules to be displayed as Vertical Menu control and the menu as Block control.
Unfortunately there's no way to create two (or more) differently looked vertical menus on the same template.

Regards,
Aileen

Hello Shawn, you may create two different menus in Joomla admin back end and then locate then in two different modules. Just in case: this article describes how to set up vertical menu in Joomla http://answers.themler.com/articles/6643/how-to-create-vertical-menus-in-joomla Two make one of modules look different you may set up one of modules to be displayed as Vertical Menu control and the menu as Block control. Unfortunately there's no way to create two (or more) differently looked vertical menus on the same template. Regards, Aileen
DaveOzric
935 Posts
DaveOzric posted this 15 December 2016

Hello, I thought it was possible to have different styled vertical menus. I must find a way to change the text/link colors for different menus.

I use vertical menus on every Joomla site for the footer links and the footer is usually a different background color so the menu items need to be a different color.

What is the work around for this? Custom module suffix? Some other way? Can you please help me with this asap.

Thank you

Hello, I thought it was possible to have different styled vertical menus. I must find a way to change the text/link colors for different menus. I use vertical menus on every Joomla site for the footer links and the footer is usually a different background color so the menu items need to be a different color. What is the work around for this? Custom module suffix? Some other way? Can you please help me with this asap. Thank you
Support Team
Support Team posted this 19 December 2016

Hi,

You can use module class suffix.

/* default state, visited */
.custom-suff .nav-pills > li[class*="bd-menuitem"] > a:link,
.custom-suff .nav-pills > li[class*="bd-menuitem"] > a:visited
{
color: blue!important;
}
/* active */
.custom-suff .nav-pills > li[class*="bd-menuitem"] > a.active,
.custom-suff .nav-pills > li[class*="bd-menuitem"].active > a
{
  color: red!important;
}
/* hover, focus */
.custom-suff .nav-pills > li[class*="bd-menuitem"] > a:hover,
.custom-suff .nav-pills > li[class*="bd-menuitem"] > a:focus
{
 color: green!important; 
}

To add custom style to exactly vmenu parent items add class parent to li element.

Thank you,
Olivia

Hi, You can use module class suffix. <pre> /* default state, visited */ .custom-suff .nav-pills > li[class*="bd-menuitem"] > a:link, .custom-suff .nav-pills > li[class*="bd-menuitem"] > a:visited { color: blue!important; } /* active */ .custom-suff .nav-pills > li[class*="bd-menuitem"] > a.active, .custom-suff .nav-pills > li[class*="bd-menuitem"].active > a { color: red!important; } /* hover, focus */ .custom-suff .nav-pills > li[class*="bd-menuitem"] > a:hover, .custom-suff .nav-pills > li[class*="bd-menuitem"] > a:focus { color: green!important; } </pre> To add custom style to exactly vmenu parent items add class `parent` to `li` element. Thank you, Olivia
DaveOzric
935 Posts
DaveOzric posted this 21 December 2016

Good, I need this today

Good, I need this today
Support Team
Support Team posted this 22 December 2016

You are welcome. Let us know if you need our further help.

Sincerely,
Hella

You are welcome. Let us know if you need our further help. Sincerely, Hella
You must log in or register to leave comments