Advanced Joomla Templating pt1 using the module class suffix

Advanced Joomla Templating pt1 using the module class suffix an article written by User Resources 1 Duplicate of styles already in place for each module, a suffix to the name of each style. This is certainly some of the 1st . Form () 2. div.moduletable () 3. div.moduletable h3 () 4. table.moduletable () / li> 5 table.moduletable Th 6th td table.moduletable and other styles, on the basis of the content in this section, as the 1st ol, ul, li () 2. a: link, a: visited, a: hover () 3. a.readon: link, a.readon: visited, a.readon: hover () and others is important to note that some modules specific CSS styles associated with them (as latestnews & mostread lists), so if you change one of these modules, you may need to remove the specific style, so that the module class suffix style, or simply the specific styles. Example of "free mambo template table.moduletable (float: left; padding: 0px; margin: 0px; width: 152px; background: url (.. / images / leftright.gif);) table.moduletable th (background: url (.. / images / subhead_bg. gif); font-size: 10px; text-align: center! important; text-align: center; padding-top: 4px; padding-left: 0px; height: 23px; text-decoration : none; width: 154px! important; width: 152px; color: # FFFFFF; text-transform: uppercase;) table.moduletable td (font-size: 11px; padding-left: 5px; padding-right: 2px; font -- - weight: normal; color: # 000000;) no module suffix Screenshot 2nd Changes to this style as desired. Example changes in "free mambo template" - such as the addition of the suffix table.moduletableeg (float: left; padding: 0px; margin: 0px; width: 152px;) table.moduletableeg th (background-color: # FF9900 ; color: # 333333; font-size: 12px; text-align: center! important; text-align: center; padding-top: 2px; padding-left: 0px; height: 23px; text-decoration: none; width: 154px! important; width: 152px; text-transform: lowercase letters;) table.moduletableeg td (background-color: # eeeeee; font-size: 11px; padding-left: 5px; padding-right: 2px; font-weight : normal; color: # FF0000;) module suffix eg Screenshot 3rd Update module class suffix in Joomla administrator. 1. Go to "Forms" -> "Site Modules" 2 Click the module you want to apply the new styles on CSS 3. Enter suffix in the Module Class Suffix field and click "Save" Site Module - Edit Screenshot