How to create a multi-level drop-down menu in Joomla

In this tutorial I will show how to set up a multi-level drop-down menu in Joomla 3.3 system. The tutorial is compatible with other Joomla versions as well, but the screenshot has been taken from 3.3 version.

Please note that some templates may not support drop-down menus, but most new designs have this feature integrated. If you are looking for responsive templates with drop-down menu please check out our free joomla templates. If your current joomla template does not support multi-level menus and don’t want to change your design you can use our free responsive menu module. The process to set up the menu is the same.

Login to the Joomla backend and create a new menu category

Menus > Menu Manager > Add New Menu

create new menu category

Add the necessary details and save your new menu category.

add menu details

Next, go to the Menu Manager, look for your newly created menu and select it. You will see that there is no menu item added to this menu yet, so you will have to create them. Simply click on New button to create a new menu point.

3-select-new-menu

 

Now you are into editing/creating mode of your firs menu item. Add a menu title and select what type of menu you want to create. The menu title will be the visible link on the website, so consider this when naming your menus. You can select from various types of menus, but for this tutorial we will choose the most common menu type that menu Joomla user use: Single Article menu.

select menu item type

The next step is to select a page (I assume you have already created at least one article, otherwise you will have to create one before adding a page to the menu) from your existing articles.

select single article menu

In the Options tab you have lots of configuration options for the page like show or hide author of the article, category, title, make the title clickable, and more. The option Use Global will use the global setting that can be set up in the Global Configuration of your website. This feature allows you to use same setting for all articles, so if you want all your articles to have the same look, leave all options for Global use.

menu options tab

There are other options you can set up for the menu like adding a small icon next to your menu or setting up meta-data for the page, but we will ignore these in this article.

Save the menu and repeat the above steps until you have created all necessary menu items.

Now, to create a sub-menu, is almost the same like creating the main menu level, with small difference that you have to choose a parent menu for it.

create sub menu item

After you finish adding all the menu items, you will have to create a menu module that will display your menu on the website.

Extensions > Module Manager > New

Create a Menu module, set up the necessary options, but most importantly the Show sub-menu item option should be Yes and don’t forget to choose a module position where you want to display the menu.

create menu module

By saving the module you are done and your menu can now be visualized on the live website. Hope this tutorial will help lots newbie Joomla users, and as always, if have any questions, please use the comment system below.

Share on FacebookShare on Google+Tweet about this on TwitterShare on RedditShare on StumbleUponShare on LinkedIn

This article has 5 comments

  1. Robert Whittleton Reply

    Hi

    I am looking to create a website from a template based wix, weebly type site but to have a multi user platform on it so users can log onto their own site using password and username format and to upload their own text and images onto a selling platform. Plus have a payment facility attached to this. Something like a shopping site but users upload what they are wanting to sell, not an action site though.

    Can Joomla do this and how will it work.

    • the grue
      TheGrue Reply

      You want a website where users sing up and upload their software for instance and they sell it trough your website? I’m not aware of a component that can such things.

  2. Marie Reply

    Can I link menu items to points within a single page? Currently, I have designed the site with page builder and the links direct to that page. I want to create a sub-menu for different points on the same page. Is this possible? How would I do this?

  3. Peter Reply

    Hello there, I have a website am creating and I want to create a drop down sub menu under about us to read as follows:- About

    About us–>Our History–>Our Work

    About us on the main menu has a drop down sub menu History and then History leads you to Our Work.

    I have failed to connect the three articles, how can i be helped?

Leave a Comment

Your email address will not be published. Required fields are marked *