How to Set Up a Joomla Dropdown Menu

Many people want dropdown menus on their Joomla sites.

However, when you first install Joomla, there's a good chance that it won't have a dropdown menu available out-of-the-box.

To get a dropdown menu you need to make sure your template, menu links and modules are all working correctly.

If you have trouble getting your Joomla dropdown menu to work, follow these four steps ...

Step #1. Check your template supports dropdowns

This is perhaps the most important step of all.

Many templates just do no support dropdown menus. After all, many professional web designers don't like dropdown menus for a wide variety of reasons. They have poor usability[1] and poor accessibility[2]. So, it's very possible that of your template did not include dropdown menus.

Before you start look at any documentation and demos of the template that you can find. Make sure that dropdown are possible.

Step #2. Check your menu links

Here's how a typical dropdown menu will appear in Joomla:

image

Go to Menus > Main Menu in your Joomla administrator area, and here's how those same links will appear. If your links are not indented like these three examples (Responsive Layout, Multiple Colors,

image

If your menu link are not indented, edit the link and make sure the "Parent Item" link is set correctly:

image

#3. Check your menu module

Even if your menu links are set up correctly, it's possible that menu module is set to not show dropdown links.

Go to Extensions > Module Manager and search for your "Main Menu" module. It may have a slightly different name, but it's likely to have a name similar to "Main Menu" or "Top Menu".

Open the module and check two things:

  • Start Level is set to "1".
  • End Level is set to "All" or at least "2".
  • "Show Sub-menu Items" is set to "Yes".
image

#4. Check your template settings

Finally, if none of these recommendations work, to Extensions > Template Manager. Edit your template and look for any menu settings. It is possible that your template designer has an unusual setting that needs to be modified. Here's an example of custom setting for a Rockettheme template:

image

References

  1. ^ They have poor usability (www.lukew.com)
  2. ^ poor accessibility (terrillthompson.com)

Read more

© 2024 Extly, CB - All rights reserved.