Install a Template

So far we have just worked with the main content areas of Joomla. We still have the default template and style. To change these elements we need to install a template extension. 

Templates, in Joomla, act as a design framework for a web site. They includes such things as color schemes, font styles layout grids and accessibility functions. A good template will give your site a consistent and functional style.

Joomla templates vary hugely in the the way they can be customized. Some templates offer very little flexibility while others include ways to customize almost every element of your website. 

Security Warning: Templates, and extensions in general, have the potential to introduce harmful code to your Joomla installation. Only use extensions from reputable sources and install them on a test installation of Joomla before using them on a live site. Keep them up to date.

For this class we are going to use the Gantry Template Framework. Templates are installed just like any other extension, in the Extension Manager.

You can read about Gantry at http://gantry-framework.org/

Notice that there are several different ways to install extensions via the Upload Packages File, Install from Directory, and Install from URL. tabs. Note that not all methods may work with all extensions on on all platforms. So its handy to have alternatives.

For Gantry we should be able to install directly from the URL. Click on the Install from URL  tab in the Extension Manager and copy and past the following URL into the Install URL  field: 

http://gantry-framework.googlecode.com/files/gantry-4.1.21-bundle.zip

Click Install. Wait for the extension to install (or for it to report an error). This may take a minute or two.

Once Gantry has been installed it can be configured as our default template for the site. To do this go to Extensions - Template Manager

First we are going to duplicate the Gantry Template Style. This will enable us to go back to the default style if we need to.

Click in the check box next to the Gantry entry in the style list and click Duplicate on the top tool bar.

templDup

Now we can make this override style template our default. Click on the duplicate Gantry Override in the template style list to open its editing console. Enter a name in the Style Name field and click Save.

mygantry  

Click Close to return to the Template Manager: Edit Style window 

Click on the star in the Default column for the Gantry Override template. The page should reload and the star will change color to yellow, indicating it is the default template.

defaltemp

View your site to see the changes.