WEB DESIGN

Advanced Joomla Templating (Part 1) Using Component Class Suffix

 

Overview:
A guide on adding/making use of the component positions and suffix courses for templating within the joomla content management system (cms)

Article Body:
A peice from Consumer Written Sources

1 . replicate the designs already utilized for the particular element, adding the suffix with each style title. this will certainly include a few of the following;

one. module
2 . div. moduletable
3. div. moduletable h3
four. table. moduletable /li>
5. desk. moduletable th
6. kitchen table. moduletable td

and can include some other styles utilized on the content in this section, for example;

1 . ol, ul, li
second . a: hyperlink, a: frequented, a: float
three. a. readon: link, any. readon: went to, a. readon: hover

and others, remember that certain segments already might have specific css styles related to them (such as latestnews & mostread lists) if you are changing one of these quests, you might need in order to either take away the specific type so the component class suffix style could be applied, or simply change all those specific variations.

example through “freemambo template”

table. moduletable float: left; padding: 0px; margin: 0px; width: 152px; background: url(../images/leftright.gif); family table. moduletable th background: url(../images/subhead_bg.gif); font-size: 10px; text-align: center ; text-align:center; padding-top: 4px; padding-left: 0px; height: 23px; text-decoration: none; width: 154px ; width:152px; color:#FFFFFF; text-transform:uppercase; dining room table. moduletable td font-size: 11px; padding-left: 5px; padding-right: 2px; font-weight: normal; color:#000000;

absolutely no module suffix screenshot

2 . not make becomes these models as preferred.

example of becomes “freemambo template” – including suffix for example

table. moduletableeg float: left; padding: 0px; margin: 0px; width: 152px; stand. moduletableeg th background-color: #FF9900; color: #333333; font-size: 12px; text-align: center ; text-align:center; padding-top: 2px; padding-left: 0px; height: 23px; text-decoration: none; width: 154px ; width:152px; text-transform:lowercase; dinner table. moduletableeg td background-color: #EEEEEE; font-size: 11px; padding-left: 5px; padding-right: 2px; font-weight: normal; color:#FF0000;

like module suffix screenshot

a few. update the actual module course suffix inside joomla manager.

1 . visit ‘Modules’ -> ‘Site Modules’
installment payments on your click on the element you’d like to use the new css styles to be able to
3. the actual suffix a person used in the particular module school suffix area & click on ‘Save’

website module — edit screenshot

editor

Recent Posts

The Importance of Live Score Updates

Instant Gratification Let's face it---waiting is hard. Imagine you're following an intense cricket match between…

4 days ago

How SerialGossip Shapes Public Perception Today

Hey there, ever wondered how the stories we read about our favorite celebrities and pop…

4 days ago

What to Expect in BhagyaLakshmi’s Future Episodes

The storyline of BhagyaLakshmi never fails to keep us hooked with its intriguing twists and…

4 days ago

Jhanak Written Update: Plot Twists Revealed

Hey there, fellow Jhanak fans! If you're anything like me, you're probably on the edge…

4 days ago

Discovering Your Soulmate Through Art

A soulmate sketch is more than just a drawing-it's a window into the depths of…

4 days ago

Understanding USCIS Translation Requirements for Applications

When you're submitting documents to USCIS, any document that isn't in English must be accompanied…

1 week ago