I am on the quest for “The Holy WordPress Framework” for some time now. I have very specific needs – I am advanced WordPress user and I need my blogs to be bit more complicated than Main Body and Sidebar areas. This is where frameworks help: using them you should be able to customize layouts fast and easy, without need to dig deep into WP depths and changing tons of code – which is really cool while learning web design. At least it is what frameworks are supposed to do

Let’s see what Gantry framework from RocketThemes has to offer.

Gantry comes in two flavors: Gantry for WordPress and Gantry for Joomla. Joomla version is a bit more advanced, but WordPress version is not far behind We are gonna focus on Gantry for WordPress here (version 1.31).

Installation

Gantry for WordPress consists of two parts: Gantry theme and Gantry plugin. We can download them bundled with WordPress installation package – it is called RocketLauncher. We put it into empty directory on our server and it install everything there. Simple. Don’t forget to activate both Gantry plugin and Gantry theme – otherwise it won’t work.

Gantry framework is based on 960 grid system css (12 columns) and has 16 gadget areas, which we can divide even further, resulting in 65 widget positions out of the box. Content is created by placing widgets in defined positions. Adding new widget areas is quite simple: you need to edit two files. Overrides mechanism enables user to use per-page layout and widgets, resulting in amazing level of blog customisation. Pretty great stuff! Framework is Right To Left friendly and allows customizing CSS and JS on per browser (and even browser’s version) basis.

Configuration

After enabling both component let’s take a look at our blog – it should look like this:

Gantry framework – default theme look

This is the theme Gantry is shipped with. Usually frameworks use child themes, but Gantry is a plugin and we treat it’s default theme as a child theme – we modify it to get results we want. Simple.

Gantry framework – menu option

Now let’s take a look into WordPress Dashboard Menu – at the bottom there is an extra item: Gantry Theme, this is where most of Gantry configuration happens. Let’s see what’s there:

Gantry framework – Main tab

Please notice I’ve marked some areas red – they are important:

• “Presets” in the top-right corner show drop down menu when we can choose some predefined styles for our theme.
• If we want to add some more, we should use “Save Custom Preset As New”.
• Whenever we make changes to settings, we should always use “Save Changes” button to remember our choices.
• ”Default settings”, “New Override”, “Widgets” – this is the core of Gantry framework and it’s biggest pro – but we will get to this later…

On each tab there is more and more options that we can configure. Lets go through them.

Content Tab

Gantry framework – Content tab

Here we can configure how our content is gonna be presented to the user – please notice that there are submenus.
These submenus  give us ability to change appearance of our blog page:  how many posts we want to display while listing content, which categories should be listed, should we list full posts or just their excerpts, what elements of blog entries should be presented to the user (author, date etc), do we want comments on/off etc. We can change settings for pages, posts, categories, archives, tags and Search – pretty much everything you will ever need.

Style Tab

gantry framework – Style tab

Here we can do some basic styling of our theme – we can define four CSS styles and change their background, header, footer, bottom and link colors. Also we can change size of thumbnails and enable WebFonts from Google (pretty cool feature!).

Gizmos Tab

Gantry framework – Gizmos tab

Gantry theme has some built in functionality which we can configure here – warning about IE6, disable feeds on the site, smart-loading of images (this will load only images which are currently visible in the browser, saving our bandwidth and making site load faster – interesting feature), using shortcodes in widgets and code for Google Analytics.

Layouts Tab

Gantry framework – Layouts tab

Gantry framework uses 960 grid system, which gives us 12 columns to use while we design our blog’s layouts. This tab give us full control about how we want to split our widget areas. Let’s explain it on examples – please take a look at the marked areas.

“Top position” uses two widget positions (think about widget positions as “columns”), first of them will take 5 out of 12 columns from 960 grid, and the second position will take the rest – 7 ( it is displayed in nice popup when you hover over the setting: 5|7).

“Header position” is full width – using all 12 columns.

“Showcase position” – 3 widget positions, first two take 5 columns each, last one takes 2 columns (5|5|2)

“Feature position” – 2 widget positions, first takes 8 columns, second takes 4 columns (8|4)

“Mainbody position” – this is slightly different as main body area consists of content area and up to three sidebars. We can configure them to be on left, right and both sides of content.

When we are finished with changes, don’t forget to press “Save Changes” button.
If we need some of our pages to have different layouts, all we need to do is press “New Override” – it will create special set of setting which then we can apply to any subsystem of WordPress blog – this actually is the strongest point of Gantry framework!

To do this, make sure you are using newly create override and then select which widgets positions you want to use in your overridden layout (just by ticking boxes), then go to tab that appeared at the end of the tab bar: Assignments.

Assignments Tab

Gantry framework – Assignments tab

In this menu (which appears only after creating and selecting Override) we can tell WordPress where new layout override should be used – it is very powerful feature, allowing us to completely customize WordPress feel and look. I cannot stress it more: this is the thing that makes Gantry framework so good and useful! It is really helpful while learning web design – changing things in WordPress code can be very daunting for beginners!

By ticking the boxes and clicking “Add to Assigned” you can bind given override to templates of Attachments pages, Author pages, Category archives, Search pages, 404 pages, single pages, single posts, menus etc.

On the “Assigned overrides” panel you can see current binds, remove them one by one or clear them all.

iPhone Tab

Gantry framework – iPhone tab

In this tab you can customize look of iPhone skin used by Gantry theme, including widget position aliases.

Advanced Tab

Gantry framework – Advanced settings

Here you can control some other of Gantry features:

• Maintenance mode,
• Gantry cache  -Gantry will save generated pages and serve them again in the future instead of regenerating them, increasing blog’s speed,
• Gantry GZipper (will compress javascript and css files used by Gantry),
• Right To Left support,
• Disable WordPress’s loathed Auto Paragraphs

Summary

Gantry framework is one of the best frameworks I’ve seen so far, I could easily recommend it to anyone… BUT!

There is one problem: WordPress version of Gantry is full of bugs, which ruin all good sides of this otherwise nice framework. The biggest problem is that overrides are sometimes (!) not saved properly – let’s say we define some override with 2 sidebars. In 95% of times it will work, but in 5% you are gonna have unexpected results (ie. 1 sidebar of no sidebar). It depends on your other layouts. This doesn’t happen if you are using single layout through your blog (no matter how complicated).

So… the choice is yours, I am gonna wait until those bugs are fixed. Update: I’ve found much more interesting WordPress framework – Headway.

Silver Award

Pros:

• Nice administration interface
• Widget based
• Easy way to control and define layouts
• 960 grid
• Right To Left support
• Automatic per-browser CSS and JS control

Cons:

• Bugs in layout settings
• Support available only to members (there is free-to-join google mailing list, but it would be nice if framework creators care to help others)