Jump to content

How to Find, Install, and Configure Drupal Themes

+ 2
  Angela Byron's Photo
Posted Nov 04 2009 06:27 PM

Themes control the look of your Drupal site. It’s not enough to get a site functionally working—it also has to feel like your own, and has to be distinguished from other sites out there.

Finding a Theme

Drupal.org has a large repository of free themes that have been uploaded by contributors. You can find a listing of these themes at http://drupal.org/project/Themes, or you can try them out “live” at http://themegarden.org.

The quality of the themes in the Drupal repository varies greatly. These themes have been created for a wide variety of purposes and needs by contributors with a broad range of programming and design skills. Download several themes and be sure to read their README.txt files to determine how to best use them. Many of these themes can be used as a starting point from which site administrators can customize their own site-specialized presentation.

Several companies offering for-purchase themes have also emerged in the Drupal ecosystem. These themes tend to be higher quality, a bit more “bullet-proof,” and may allow for easier customization by administrators.

Theme Installation

Installing a theme requires almost exactly the same process as installing a module. Download the theme’s .tar.gz file from its project page and extract it. Place the theme’s directory into the sites/all/themes directory, and your new theme should appear on the Themes administration page in your Drupal installation, as shown in Figure 2.44.

Note

As with modules, themes written for Drupal 5 are not compatible with Drupal 6 and vice versa. Drupal 5 themes will not appear on this page if you are running Drupal 6.

Theme Configuration

Themes can be switched on from the Themes page at Administer→Site building→Themes (admin/build/themes), shown in Figure 2.44

Figure 2.44. The Themes administration page

Attached Image

Most administrators can just ignore the “Enabled” column—the “Default” column is what actually defines the theme that all users without permission to select themes will see. Enabling our new theme is as simple as selecting it in the Default column and hitting the “Save configuration” button at the bottom of the form. The new default theme should affect the site design immediately.

The Enabled column allows the administrator to select multiple themes to be available for users with the “select different theme” permission enabled to choose from. Figure 2.45 shows a user account page for such a user when multiple themes are marked as enabled. Without this permission, which is not enabled by default, users will not actually see any of these choices. Not many sites enable this permission for users because, after all, your theme usually reflects your branding and hard design work.

Figure 2.45. A user account with multiple themes to choose from

Attached Image

Note

The “select different theme” permission can be a useful debugging tool. A site administrator can enable both the site’s normal theme and a core theme such as Garland, and switch between them if the site encounters errors. If the error happens only in the site’s normal theme, then the theme is the first place to look for the problem. If it happens in both themes, it’s a deeper problem, such as a database problem or configuration issue.

Drupal offers a number of configuration features that themes can take advantage of. There are two ways to configure themes. For “global” options that you want to apply across all themes, select the “Global settings” tab at Administer→Site building→Themes→Configure (admin/build/themes/settings). For settings specific to a single theme, or to configure settings that are only offered on a per-theme basis, select the “configure” link from the Operations column next to an enabled theme. The settings shown will vary from theme to theme.

On the settings pages, you can toggle the display of many theme elements, including the logo image, site name, site slogan, mission statement, and others, as shown in Figure 2.46. Some of the checkboxes may be disabled by settings elsewhere in your installation. Drupal doesn’t give you many clues in this area, but in our example “User pictures in posts” and “User pictures in comments” are disabled because “Picture support” has not been enabled on the Administer→User management→User settings (admin/user/settings) page. “Search box” is disabled because the Search module has not been enabled.

Figure 2.46. The theme configuration page allows customization of which page elements are displayed

Attached Image

Note

Settings such as site name, site slogan, and mission statement are configurable at Administer→Site configuration→Site information (admin/settings/site-information).

The theme configuration page also allows administrators to upload their own site logo image and shortcut icon (also known as the favicon or bookmark icon, which appears in the browser’s address bar) or simply point to one elsewhere on their server.

Some themes, such as the core Garland theme, also take advantage of the Color module, which allows site administrators to configure its color scheme using a handy Javascript-based color picker. Figure 2.47 shows the Color module in action.

Figure 2.47. The Color module, supported in some themes, offers customization of the site’s colors

Attached Image

Blocks and Regions

It’s important to remember that block regions are defined by the theme, and different themes may offer different regions. If you have blocks assigned to a region in one theme and you switch to another theme that does not offer a region with the same name, these blocks will disappear from your site. After enabling a new theme, visit the blocks administration page at Administer→Site building→Blocks (admin/build/block) and see what regions are available in your theme. You may need to reassign blocks to another region to take full advantage of the new theme.

Administration Theme Setting

Unlike some other content management systems and blogging software, Drupal does not have a separate design for its administration pages by default. Site configuration and editing of content use the same presentation as the remainder of the site. However, the large forms and tables needed to configure a Drupal site are often quite incompatible with the design and layout elements appropriate for the rest of the site—resulting in “broken” administration pages. Furthermore, many site administrators would prefer to make it clear when a user is in a nonpublic administrative area of the site. For these reasons, Drupal allows for an administration theme to be chosen by visiting Administer→Site configuration→Administration theme (admin/settings/admin). This theme will be used for all administration pages (those starting with “admin” in the URL path), and optionally for content creation and editing pages. Figure 2.48 shows the Administration theme settings page.

Figure 2.48. Administration theme settings page

Attached Image

Using Drupal

Learn more about this topic from Using Drupal.

With the recipes in this book, you can take full advantage of the vast collection of community-contributed modules that make the Drupal web framework useful and unique. You'll get the information you need about how to combine modules in interesting ways (with a minimum of code-wrangling) to develop a variety of community-driven websites -- including a wiki, publishing workflow site, photo gallery, product review site, online store, user group site, and more.

See what you'll learn


Tags:
0 Subscribe


1 Reply

 : Nov 23 2009 05:17 PM
Good detailed explanation. I did not know that we could change colors of our themes using a module. I have had tough time hacking the code.
Nicolewelsh