How to Set Body CSS Class as Page Class Suffix in Your Joomla! Template

In a previous post, I showed you how to set the menu alias as the body CSS class in Joomla!. This works best for me because it is easy to remember (just look at the url), and does not require any extra steps, but there is a better way to do this. For example, you write 50 lines of CSS code to modify the style of a page based on its alias, but you later decide to change the URL for SEO purposes. You would need to go back and edit your CSS file to mirror the new alias. Using the page suffix would eliminate this issue.

I know, I know… “Just show me the code” right?

Make sure to place the code below inside of the body class. Your body tag should look like this:

Tarik (@tarik916) is a web developer and owner of ACS Digital Media, a Sacramento based web development agency specializing in open source CMS systems. If you are looking for support for your current or upcoming projects, visit www.acs-digital.com.