Creating image menus (menu with image icons) in Joomla 1.7

To create an image menu or add image to your menu items, you'll need to go like this:

  1. Prepare your image. You'll want a size like 20x20 or 25x25 px according to your menu height or width. I suggest you'll use PNG or GIF images with transparent background so the images will blend nicely in your menu. If you'd like then use this tiny home icon I created:
  2. Open your menu item for editing. Go to -> Menus -> Menu Manager -> Your menu and click on it to open the menu item for editing (the one you want to add an image to).
  3. On the right hand properties area find "Link Type Options"
  4. On the "Link Image" line click Select
  5. Use the uploader or type in the link to your image to tell Joomla which image you'll want to use.

    * If you use the uploader then you have to click on the image that appears on the image list at the top after the download.
  6. After the image path (url) is set, click Insert on the upper-right of the graybox.
  7. Select whether you want the menu item to be only image or image plus text. This you can change with Add Menu Title (yes/no), see below.
  8. Save your item by clicking Apply on the top-right.
  9. Go and refresh your page to see how the image appears on the menu.

About me

Iinstructor of robotics (LEGO Mindstorms), computer teacher, IT support, web dev, currently studying cyber-physical systems engineering.

If you found a solution here, would you consider donating $25,000 for my next project?

Just kidding, 1$ would do fine.

Hope you found what you needed. Thanks for stepping by.