Joomla 1.7 – How to Use Images as Menu Items Instead of Text

by Elaine on September 5, 2011

Joomla 1.7 Tutorial – How to replace text in the menu item with images.

In this tutorial, you will learn how to insert an image as a menu item instead of text.  You can easily accomplish this using the Menu Manager Menu Items and do not need to install any 3rd party Joomla 1.7 Components or Extensions.

For example, I want to replace the 3 links along the top menu that say “Home”, “Sample Sites”, “Joomla.org” with images instead of text.   Below are the steps on how to do it in your Menu Manager.

joomla 17 elaine cmsmind menu images Joomla 1.7   How to Use Images as Menu Items Instead of Text

Joomla 1.7 - Menu as Images

1.  Login to your Joomla 1.7 Administrator Panel

2.  Click on “Menus”, “Top’, Click on New

3.  Set the following values:

  • Menu Item Type = “featured articles
  • Menu TItle = Home
  • Status = Published
  • Access = Public
  • Menu Location = Top

4.  Under Link Type Options, set the following values:

  • Link Image = Upload the image you want to insert from your computer
  • Add Menu Title = No

5.  Click on ‘Save & Close’

6.  Repeat these steps for the other menu items you want to insert an image instead of using text.

joomla 17 elaine cmsmind insert image no title new home Joomla 1.7   How to Use Images as Menu Items Instead of Text

Joomla 1.7 - Insert Image Menu Item no title

If your Menu Manager Edit Menu item screen does not show the ‘Add Menu Title’, see my post here.

After you save and refresh your Joomla 1.7 website, your menu items will show up as images with no titles beside it.

Thanks,

Elaine

 Joomla 1.7   How to Use Images as Menu Items Instead of Text

Elaine

Elaine is the founder of CmsMind, an online blog providing Joomla and Wordpress tutorials. Elaine lives in Toronto and when she is not online, she is either Marathon and Triathlon training or travelling and racing somewhere in the world. Find her also at: Save Money, Premium Themes and Templates, and at Webhosting Tips.

More Posts - Website

{ 4 comments… read them below or add one }

Susan December 3, 2011 at 4:40 pm

Hi Elaine,

Thanks for this post. I’ve done everything as you wrote but it still shows the title of the page next to the icon.

Do you have any suggestions please?

Many thanks,
Susan

Reply

Anran December 21, 2011 at 3:17 pm

I have the same problem. Any help would be appreciated.

Reply

ganesh October 18, 2012 at 1:51 pm

Thank you for sharing such a useful info..

Reply

Sundar November 21, 2012 at 9:42 am

Thank you very much for sharing this.

Reply

Leave a Comment

Captcha Captcha Reload

Older Post:

Newer Post: