Public Forums 71,145 posts

[TomC Moderator TomCJoin date: October 2014Posts: 14077Downloads:58Uploads:137 Thanks: 948 Thanked: 3155 times in 2495 posts]

#174732

Figuring out the various module class suffixes identified within each respective Template demo’s Typography page can sometimes be a little confusing – and often times frustrating. Unfortunately, there does not seem to be an easy-to-find concise identification or listing of each module class for each respective template.

SO . . . Until such time as an easy-to-follow listing is provided with each template, here is a roundabout way you can identify many of the various classes is to utilize a web inspector like FIREBUG or Google CHROME’s Web Inspector.

NOTE:
For the following example/steps, I will be describing steps using Google Chrome’s Web Inspector and the JA ERIO Template Demo – though the same principle method can be utilized with virtually any JATC Template.

STEP ONE:
Go to the JA ERIO TYPOGRAPHY PAGE and scroll down to where the various module class suffix info starts
– e.g. BUTTONS & TAGS.

STEP TWO:
Right click over the first blue button and, from the pop-out menu, select “Inspect Element.” You will then see a bottom pane appear and, in the right column, you should see the identified CSS (along with a subsequent list of related css and such … it’s pretty self-explanatory).

In the case of the first blue button, the following is the module class that was identified:

<blockquote>a.btn-blue span</blockquote>

Repeat these steps for each module class suffix you want to identify.

I realize this method involves a few additional steps – and it really shouldn’t be necessary . . .
but at least this is a way you can go about identifying most of the module class suffix info for the time being.

IMPORTANT NOTE:
If you want to identify the exact CSS file location of the various classes . . . whenever you are using a web inspector to investigate/identify CSS elements, always set “Optimize CSS” to “No” within your Template Manager–General Settings. Otherwise, the “compressed” css file/line info that is presented will not be correct and, as a result, much more difficult to find within your various directory CSS files.

1 user says Thank You to TomC for this useful post

1. nick mortensen

[Anonymous Friend wadewilsonJoin date: December 2017Posts: 3Downloads:0Uploads:0]

#1083392

good article, thanks for information

[Author]

Posts