I never really noticed before that the Main Menu’s in Joomla 1.7 were all Uppercase. No matter how you entered in your Menu names in the Menu Manager, they always showed up as Uppercase when viewed on the frontpage. ie, HOME, SAMPLE SITES, AND Joomla.ORG, these main menu items were always in caps. I received a comment request on how to change this and below I will show you how to make this change. If you are using Beez_20 Joomla 1.7 template, this is what your Main Menu will look like after making the changes below:
Overview:
- Locate the secret hiding place for the ‘edit css’ file location in the Template Manager
- Comment out the lines that transform Main Menu text to uppercase in Template Manager
1. Locate the Secret Hiding Place to Edit the CSS in Template Manager
To remove the caps from the Main Menu titles and change them to normal case as entered in the Menu Manager, you will need to edit the Beez_20 Template layout.css:
- Login to your Joomla 1.7 administrator backend
- Click on ‘Extensions’, ‘Template Manager’
- Click on the ‘Templates’ tab
- Click on ‘Beez_20 Details’
- Click on ‘Edit css/layout.css’
- If you need more help with that, click here for my post.
2. Edit the CSS and Remove the Uppercase Property in Template Manager
The uppercase transformation appears 3 times in the css code. We will need to comment out this code so it will not change the Main Menu headings to Uppercase. See Below:
- Search for the text:
text-transform:uppercase
- Change the code From:
text-transform:uppercase
- Change the code To:
/* Commented Dec 16, 2011 by Elaine - To remove the Uppercase from Main Menu Headings */
/* text-transform:uppercase */- This code appears 2 more times in the css/layout.css file. You will make the changes in the
- #header form .button
- #header ul li a:visited
- #header ul li.active a:visited
- Click on ‘Save & Close’
After you refresh your Joomla 1.7 website, you will see the caps removed from the text of the Main Menu in the Top module position of Beez20 Template. After you click on the link, the ‘visited’ text is not changed either.
Thanks,