Gantry Framework - Part 5: 2.0 Features

This latest post will provide some more details on the great features we’ve added to Gantry version 2.0. First of all, from the very start, we’ve endeavored to make Gantry as backwards-compatible, and as easy to upgrade as possible. What this means for the Reaction template, is that you can actually drop the entire Gantry 2.0 lib/ folder into your Gantry 1.0 version of Reaction, and it will just work in the same way it did before. However to take advantage of the 2.0 features you will need to update your templateDetails.xml file. We’ll be providing easy step-by-step instructions as well as a 2.0 version of Reaction when we’ve got 2.0 ready to go. All to-be-released templates from this point on will be based on 2.0.

So what’s in 2.0? Well the previous blog post provided a quick feature list of what we’re adding, but there are some really cool core features that I want to expand on.

This is Part 5 in a series of blog posts on the new RocketTheme Gantry Joomla Template Framework. If you have not already done so, you may find Part 1, Part 2, Part 3, and Part 4 helpful in understanding this post. To learn more about the Gantry Framework as well as view documentation and tutorials, be sure to visit the official Gantry Framework site.

RTL Support

First there’s RTL support. This was one of the most requested additions when we started talking about Gantry. RTL means “right-to-left” and this a key component when trying to deliver a website in an RTL language such as Hebrew, Arabic, Urdu, etc. What we’ve been able to provide in Gantry 2.0 is to automatically “flip” the content layouts and ordering to support RTL. We’ve also provided an override in the advanced section of the template details, so you can turn this default behavior off if you like. However, by default, if the language file supports it, RTL will be enabled. A visual example of how this looks/works can be seen below. The first image is in the default english in the traditional LTR format, while the second one is the same default english but with the RTL toggle enabled in the en-GB.xml language file.

Custom Presets

RocketTheme was the first template developer to provide a set of preset styles within a template release. In the past this consisted of a fairly basic process of swapping out a style CSS file to use a unique set of images and colors, therefore providing different styles. In Gantry we’ve added the ability for presets to be built as a combination of any set of parameters needed. For example, the “style preset” can be set to be a combination of CSS style, link color, font family, background level, and body level. This means that by choosing a preset value in the template manager, you will set all of these parameters based on the preset’s predefined values. Saving the configuration ensures the values take effect. Also, you can create multiple preset types so you could have the “style preset” as described above but you could also create a “layout preset” that provided some standard layout combinations, eg: News, Magazine, Blog, etc.

In Gantry 2.0 we’ve added the ability to create new Presets and save them directly from the Template Administration interface. You just configure the values that the preset supports, then click “Save Custom Presets as New”. This will bring up a modal dialog box that prompts for a Preset Name, as well as an optional Keyname. When you save this dialog box, the new preset will be available in the preset list. After a preset is created, you can create a thumbnail image in the admin/presets/ folder with the filename structure “keyname.png” where keyname is the Keyname from the modal dialog box. You can remove a preset by click on the “delete” icon on the top right of the preset preview.

Menu Item Specific Control

Possibly the most powerful feature we’ve added to Gantry 2.0 is the ability to control configuration on a per-menu-item basis. Imagine the scenario where you have configured your styles, layouts, features etc so they look perfect on your homepage, but then you realize that on a specific page you need a different layout, or possibly you want a different CSS style, etc. Previously this has required some extensive ‘hacking’ to accomplish, or if there has been an allowance for picking a CSS style and associating it to a menu item, it was extremely limited.

To use the Menu Items specific settings, you should first set all your preferred configurations with the “Defaults” button active. Then click the “Menu Items” button, and choose the menu item you wish to modify the parameters for. You will then see a series of checkboxes on the left of all the supported parameters (parameters such as cache are not supported on a per-item basis). Check the checkbox next to the parameter you wish to modify, it will then become active, and you can modify as you wish. Clicking “Save” or “Apply” in the toolbar will then save this configuration

Imagine having the power to configure ANY parameter in the Template Administrator to be a specific value for ANY menu item. This is an unprecedented level of control never before possible in any Joomla template.

Gantry GZipper

The last feature that I wanted to talk about was the new Gantry GZipper functionality that we’ve incorporated into the core of Gantry 2.0. If the name sounds familiar it’s because the technology has been adapted from our RokGZipper system plugin that combines and compresses CSS and JavaScript files to minimize files and round-trips to the server to optimize speed and performance. The version in Gantry 2.0 is a subset of the features available in the full RokGzipper system plugin and it provides combination, compression and optimization of Gantry files only. This means that any CSS or JavaScript files that is used explicitly by Gantry will be optimized. This does not affect 3rd party plugins, modules etc, to optimize those you should use the full RokGZipper plugin that also has the ability to ignore certain files and even is able to pick up inline CSS and JavaScript declarations for absolute best performance.