Search Google Appliance


How do I choose templates for my pages in Drupal?

All pages within your site have configuration controls that allow you to choose a layout. Two of the templates are only for use on home pages, while the others can be used for any page within the site. To access these controls, browse to the page in question, then click the edit tab (you must be logged in). In edit mode, click on the Template Settings fieldset to expand it:

Portland State Office of University Communications | Edit Page September Sessions


The Template Settings controls appear in the expanded fieldset:

Portland State Office of University Communications | Edit Page September Sessions


The upper section of the controls selects the layout you wish to implement and the lower section selects the configuration for the selected template. If you make different template selections, the configuration options slightly change, depending upon the template.

It should be noted that both Home Page and Home Page Slider layouts are reserved for the site's home page (there can only be one). For content managers, this means that if you choose one of the Home templates for a non-home page, the layout will completely break when viewing. The opposite is also true for the home page: if you choose one of the non-Home layouts, layout will not work properly. So you just need to be sure that you only choose Home layouts for the home page, and any of the others for non-home pages.

More on the Home Slider template can be found in another FAQ:

Configuring Templates

Once you choose a template, you can choose how it's layout will fall together. Note that the miniature "layout" with the grey and green blocks implies what the layout will look like after editing the page. If you choose a template that utilizes intro text, you should notice that the edit form for the page reveals a separate intro text field. Choosing one without intro text hides this field.

The grey boxes in the mini-layouts indicate where the branding images will appear. And the images that actually appear are controlled by the Branding Images controls:

Portland State Office of University Communications | Edit Page September Sessions


As noted in the above image, order of the images is important when you configure a template that has more than one image. For example, when you select the Primary Page template, there are three image options:

Portland State Office of University Communications | Edit Page September Sessions


The numbers in each option correspond to the order in the Branding Images controls. Note that if you need to change the order of your branding images, grab the drag-n-drop plus sign and move them up and down.

Template Suggestions

The naming of the templates suggests usage within the structure of your site. Primary pages are considered to be the top-level menu items, section pages would be those just under the primary pages, and sub-section pages are the next level after that. While that scheme would work for many sites, its important to consider what the purpose of the page is, and whether the layout works for that page.

In some cases, like a page that is just a list of links to downloadable forms, no branding is really useful. In that case, you might select X-Level. The naming convention is just a suggestion to help you get started; it is up to content managers to select the proper template and configure it accordingly.

Choosing Images

Utilizing the templates to achieve a nice look and feel for your site is highly subjective. You have at your disposal a set of branding images in the media library to get you started. While logged into your site, click on [1] Content, then [2] Media, then [3] click on one of the folders: editorial, lifestyle, portland-urban, or textural

Browsing pre-loaded branding images


Any of the images in the branding_images folders is suitable to the branding areas within the templates. You are free to upload more images to choose from. For best results you want large images: at least 800 pixels wide by 250 pixels tall for pages where there is only one image across the top. Feel free to experiment with other sizes if you intend to use multiple-image configurations for your templates. 

In any case, it is better to have too much image than not enough, as you can position the viewable portion of the image within the template. See next section for more.

Positioning Images

Once you have selected branding images, the final step is usually positioning the images in the branding viewport. While in view mode of the page in question, click the edit image icon (this icon only appears while logged in):

edit branding image icon


After clicking the icon, the controls appear:

Portland State Office of University Communications | Web Communications


While the controls are visible, you can click and drag the image around in the viewport to adjust position or use the zooming controls as denoted in the image above. To save the changes, click the save button and the image will reload into the viewport with the controls not visible. Zooming works decently with high-resolution images, i.e. images that were of the previously-recommended sizes; it doesn't work well with smaller images. Experimentation will be your guide to what works and what doesn't.

Further Questions?

If you find inaccuracies in this tutorial or you have further questions, please send an email to