Adjusting the Gantry Template

For the purposes of this tutorial we are going to create a test Article  and a test sidebar Module so we can explore some of the layout features of the Gantry template. Don't worry if you do not understand exactly what is going on just follow these steps. We will talk more about articles and modules later.

Go to the backend of your site by typing 'yoursite/administrator' into your browsers address bar. Go to content - article manager - add new article. Give the article a title (eg 'test').

Tick the featured check box. (this will make the article appear on the front page).

Copy and paste the lorem ipsum filler text into the article text box in the article manager. Click Save and Close.

Now we need to create our side bar module. In the back end of your site go to Extensions -  Module Manager. Click New in the tool box at the top. Click Custom HTML in the Select Module Type popup. 

Give the module a title and click Select Position. In the Select Template drop down on the top right of the popup select Gantry. This will force the popup to display only the positions available in the Gantry template. Scroll down to the bottom of the popup and click in the page navigation bar. (the positions are arranged in alphabetical order and this just happens to be the page they appear on in the popup).  Click on sidebar-a in the positions column. The popup will close and sidebar-a should appear in the positions text field.

Now copy and paste the Lorem Ipsum text into the custom html modules text box in the same way that you did for the article. Leave all the other settings as they are and click Save and Close.

Now we need to enable the sidebar- position in the gantry template. Go to Extensions - Module Manager and click on Gantry-Default(2) Overide in the list to open the Gantry editing window. 

Click on the Layout tab. Scroll down and place a tick next to Main Body in the list. In the Main Body row click on 2 in the positions field. This divides the main body position into two columns. The letters sa (standing for 'sidebar a') should appear next to mb (for 'main body'). You can use the slider to adjust the relative widths of each. Once you have made your changes click Save in the top of the Templates Manager.

Click on the View Site link in the top right to view the changes.