Lesson 7: Use "Template Designer"

For many years, bloggers have been able to apply customized website templates to make their blogs look more like websites. For the most part, bloggers needed a high degree of understanding of XML based templates, or had to hire a an experienced Blogger professional to implement a template for them.

In 2010, Blogger introduced Template Designer. It is a web-based template management console that permits a blog admin to select a template and adjust the look and feel to further customize it.

To use Template Designer:

From your club's blog dashboard, select the "Design" tab and choose "Template Designer".
This will open the Template Designer management console which comprises many detail pages that are available by selecting the appropriate menu choice in the left column menu.

There are six major templates to choose from, each template has a subset of optional themes that you can select. In our example, we selected the Simple template and used the first theme.

Once you make a selection, you can choose "View Blog" from the options in the top right corner. This will open a preview page so you can see what the change would like.

Important Note: Ensure that you click "Apply to Blog" before you move to another detail page in Template Designer. If you make a change and do not apply it, the change will be lost when you move to a new detail page.

Other options include "Back to Blogger" which takes you back to the club's blog dashboard, "View Blog" which lets you preview a change that you have applied, and "Help".

One of the best advantages of using Template Designer is that you can switch between different templates and themes and not lose any content and gadget placement in your website / blog.
Now that a template and theme are selected, click on the "Background" menu to configure the background settings.

For the "Simple" template, Template Designer assigns a plain colour background, each that applies to an overall colour theme. You can choose to use a background image by clicking on the down arrow head to the right of the background image.

Background images if selected will appear below the website (around the outside boundary). Images are stored in categories, e.g. Abstract. Selecting a different category will display a different collection of images. If you click an image, the effect can be seen in the preview image below the Template Designer window.

Although background images can enhance the look of the site, it may make the site sluggish to respond in web browsers on older Windows XP computers. If you do not want to select an image, click the "Cancel" button.
Now that you have configured all the Background settings, you can modify the layout settings. Click on the "Layout" menu and choose "Body Layout".

You have several different layouts to choose from. The dark gray blocks indicate column layouts where you will be able to add Blogger gadgets. If you select a different layout pattern, you can see the effect it has on column placement for gadgets.

For this guide, the single right-hand column layout was selected. Make sure that you click "Apply to Blog" before moving to the next detail page.
Select "Footer Layout" and choose the desired layout.

You have several different layouts to choose from. The dark gray blocks indicate column layouts where you will be able to add Blogger gadgets. If you select a different layout pattern, you can see the effect it has on column placement for gadgets.

For this guide, the three-hand column layout was selected. Make sure that you click "Apply to Blog" before moving to the next detail page.
Select "Adjust Width" and you can set the widths of the entire page, and the column width.

For this guide, we left the settings at the default as they originally appeared. Make sure that you click "Apply to Blog" before moving to the next detail page.
Select "Advanced" from the menu. You can use "Advanced" settings to change the various "look and feel" settings in the template. Select what you want to adjust and make the desired changes.

For this guide, all settings were left at the default settings for the template.
Now that you have finished, click on "View Blog" to preview your club blog.