For those that don’t know I worked with Joomla websites a lot over the last year and despite the shear hatred I’ve had for the platform over the years due to the dysfunctional menu system and lack of a decent integrated SEO re-writing engine built in, the platform grew on me.  I can’t say it was an easy transition having dived into WordPress, or examined the depths of Drupal, or even tested the waters with PyroCMS, but there was something that stood out to me about Joomla above the rest…the Twitter Bootstrap.

Out of all the things Joomla has done wrong over the years, the one thing they did right in their 3.0 release was in the inclusion of the Twitter Bootstrap framework. For those that don’t know of it, the short is that it’s a responsive website framework that allows coders to quickly build responsive web pages with little effort and also give users a starting point for creating modern graphical assets with ease.  However, again the Joomla core leaves something to be desired and that is where JoomlArt’s T3 Framework comes into play.  For those that haven’t used it, I recommend installing or at least viewing the demo while reading this post ( http://t3-framework.org ).

A Brief Responsive History

Only a few years back web design was web design.  We were worried about browsers and rendering engines and took little to no notice of other devices besides computers.  Now with the rise of mobile devices, smartphones and tablets, we have to worry about responsive design moreso than ever before.  However, as technology has moved forward, design has been taking some time to catch up and there have been many recent attempts to bridge the gap between design and code. The first notable attempt in recent years is Muse  from Adobe.  This program came from the idea that web design could be as easy as drag-and-drop.  Still to this day, most will argue that while it does what it advertises the code it creates is bloated at best.  However, this hasn’t prevent the spawn of many copycats across the design industry as well as the email marketing industry by the likes of companies like Eloqua whose “Awesome Editor” tries to accomplish this same great feat not only for landing pages to be viewed in browsers, but also in emails.  Ambitious as it sounds and despite the results, it’s still way to early for this technology to be anywhere near useful for creating clear, concise code because there is no solid framework backing this application. As a result you can be very limited in what you create.

T3 for Joomla 3

Then there is the T3 framework.  It is by no means the absolute answer, but I think it sheds a lot of light on where the industry has gone so very wrong with their ideas for creating a true design to code translation.  And for this, I would like to take an in-depth look at the Template Manager introduced to us by the folks at JoomlArt.

Below you will find a couple screenshots of the JoomlArt T3 Framework Template Manager:

Joomla T3 Framework
Joomla T3 Framework

The first set of screenshots focuses on the Module Positions. For those that try to work in WYSIWYG editors, when was the last time you wanted something as simple as a 2 or 3-column layout?  You are not alone, it happens all the time.  From this screenshot we can see that you have the option to select between 1 and 6 columns and these options are all configurable within the T3 Framework.

While this framework is far from WYSIWYG it is, by far, the best option on the market today for creating quick template sites.

Other Options

Some other key items to note in the T3 Framework are its Injection and Assignment tab.  For the Injection tab, while the name sounds menacing, it actually just places code within the body and/or head tags as you wish.  So if you have Google Analytics code, or other code, you can easily insert it into the framework to print on all of your pages rather than to mess around with the source code.

For the Assignments tab, this is more specific to Joomla, but with these assignment rules you can easily assign layouts to Joomla menus making for easy substitution of layouts in different areas of your site.  In fact, this could almost be used to create multiple sub-sites within your primary site as the layouts could be completely different.

Exploring the Code – Part II

In Part II of this series, we will examine the code behind the Joomla T3 Framework for an in-depth explanation of customizing the templates to make you an expert at the T3 Framework in no time at all!

Leave a comment