Module Variations

Module Variations allow for the individual styling of each module within a position, without it being global. Code wise, this is achieved by adding a class into the module code which loads from the Module Class Suffix field in the Module Manager. The theme CSS adjusts accordingly.

Enter any available suffixes at Extensions → Module Manager → Module → Module Class Suffix

There are 16 suffixes: flag1-3, title1-3, boxleft1-2, boxright1-2, divider, flush, flushtop, flushbottom, noicon & basic.

The Flag adds a solid background image behind the header, in the shape of a flag. The Title suffixes change the styling of the module titles only. The Box suffixes apply a subtle gradient, in a light or dark shade, to either the left or right side of the module. Divider simply adds a bevel divider to the bottom of the module. Remember, you can always combine suffixes together such as flag2 divider, which will produce a colored module title, with a bottom divider.

Flush will disable all padding and margin to the module for a tighter fit, with FlushTop and FlushBottom disabling the margin/padding for the Top/Bottom parts of the module respectively. Noicon removes just the icon, but leaves the gradient with the Basic suffix removing both from the module styling.


With a library of thousands of free Extensions, you can add what you need as your site grows. Don't wait, look through the Joomla! Extensions library today.

Main Menu