Joomla 4 Administrator Sidebar Collapsible Menu Style in the Front End

[adricist]

I would like to create a Sidebar Menu style in the Front End of a Joomla 4 site that looks, feels and behaves similarly to how the current left sidebar Menu of the back end is. Including the option of collapsing the whole Menu to icons only and retain the current sub-menu selection, when expanded again.

Can anyone please tell me if this is possible without using any additional Modules, Components or Templates?

If not, can you please point me to a Module, Component or Template that can do this?

Thanks,
Adri

[AMurray]

Suggestions:

https://extensions.joomla.org/extension ... n-menu-ck/

https://extensions.joomla.org/extension ... dion-menu/

[herb200mph]

There are several Menu Extensions available on the JED, and some of them have "demo" features, so you can explore them to see if they will function the way you want.

Caution: Make sure the Menu Extension declares J!4 compatibility.

Installing a J!3 Extension on a J!4 website might break the site to the point it may not be able to be recovered - so use diligence to ensure compatibility.

[herb200mph]

MORE ... of course, you could explore the use of adapting the Admin Menu Module found in the file structure at administrator/modules/mod_menu, along with related css, scss and bootstrap files. This might solve your problem and would be an exact clone that can be adapted/configured as desired.

[AMurray]

You could make a suggestion for this feature, https://issues.joomla.org, for a front-end menu module that matches the style and functionality of the admin vertical menu.

[adricist]

MORE ... of course, you could explore the use of adapting the Admin Menu Module found in the file structure at administrator/modules/mod_menu, along with related css, scss and bootstrap files. This might solve your problem and would be an exact clone that can be adapted/configured as desired.

Hi herb,

And thank you for your feedback.This sounds like an excellent idea, albeit a bit beyond my knowledge! Are you able to help me get this up and running? At present I have renamed the site/modules/mod_menu folder to mod_menu_1 and I have copied the the site/administrator/modules/mod_menu in there.

Can you please also tell me what else I need to copy for css, scss and bootstrap files?

At the moment I am getting errors in \templates\cassiopeia\html\mod_menu\dropdown-metismenu.php

Please let me know your thoughts.

Regards,
Adri

[toivo]

At the moment I am getting errors in \templates\cassiopeia\html\mod_menu\dropdown-metismenu.php

The folder templates/cassiopeia/html contains so called template overrides of particular views of components and modules. In this case the override code may be referring to files in the original front end version of the mod_menu module that do not exist in the back end module mod_menu. Can you see from the error mesages if that is the case?

Modifying or removing core scripts of Joomla like mod_menu is not recommended because the next update of Joomla may overwrite the modifications and you would have to refactor the modified code. Therefore a third party extension would work much better.

If you decide to experiment with PHP code from the back end, rename the override folder templates/cassiopeia/html/mod_menu, which may get rid of the error messages.

[adricist]

At the moment I am getting errors in \templates\cassiopeia\html\mod_menu\dropdown-metismenu.php

The folder templates/cassiopeia/html contains so called template overrides of particular views of components and modules. In this case the override code may be referring to files in the original front end version of the mod_menu module that do not exist in the back end module mod_menu. Can you see from the error mesages if that is the case?

Modifying or removing core scripts of Joomla like mod_menu is not recommended because the next update of Joomla may overwrite the modifications and you would have to refactor the modified code. Therefore a third party extension would work much better.

If you decide to experiment with PHP code from the back end, rename the override folder templates/cassiopeia/html/mod_menu, which may get rid of the error messages.

Thank you Toivo,

Yes, renaming the folder templates/cassiopeia/html/mod_menu has fixed the error!

However, I am not getting the Admin Menu to show up in the front end. Any idea on what I need to do to have it show up?

I have also sent this as a feature request, as AMurray suggested, that would be an awesome Menu to have in the front end, with the added advantage of being able to minimize to the left and in so doing leaving much greater display width on the pages. The advantage of this style of menu is that it can grow as much as needed without overlapping like a horizontal one.

Thank you for your help,
Adri

[herb200mph]

What is the anticipated results of this menu when viewed on mobile devices?

[adricist]

What is the anticipated results of this menu when viewed on mobile devices?

That is a great question Herb!

We are really intending to use this website for a Management Information System to be used on desktop devices only. We basically use Joomla to provide the the access and the navigation structure and then use Joomla Articles in which we place the code to the various system functionality. The horizontal menu has started to reach his limits, as the system has now become quite complex and the admin style vertical menu would be perfect, as it offers many benefits for our current scenario.

Furthermore the current capability to retract it to the left leaving basically an almost full width while operating the modules within articles would be fundamental, versus a standard vertical menu displayed in a fixed sidebar left, which would take lots of real estate in width.

Finally, I have just checked the admin menu of the back end on a mobile device, so having that same logic would be excellent, but as I said, not required at present.

Thanks,
Adri