Customizing Drupal Themes

It's far easier to duplicate, rename and customize an existing Drupal theme and use it to build your first theme than to build one from scratch.

The first step is to install the theme you want to modify. Then make a copy of the theme directory on your computer. Use this local copy to make your changes, and then upload the modified copy to your site/all/themes directory on your web host.

To edit the files in a theme, you need some sort of text editor:

  • On a Windows machine, you can use the NotePad text editor.

  • On the Mac, TextEdit will work, although be sure to choose Format→Make Plain Text.

To create your own version of a theme, follow these steps:

  1. Rename the folder to a distinctive name you want to use for your theme.

    The name may only contain lowercase letters, numbers, and underscores. The example uses drupalfordummies.

  2. Open this folder and locate the .info file. Rename this file with your new theme name.

    For this example, drupalfordummies.info is used.

    Make sure you rename the info file. Don't copy it with a new name. You only want one info file in your theme directory, and the name needs to match the name of your theme.

  3. Open the .info file in a text editor).

  4. Change the first line of this file to simply

    ; $Id$
  5. Change the name = line to use your theme name.

    In the example, this line is changed to name = Drupal For Dummies.

    This will be the name that shows up on the module selection page. It can contain spaces.

    image0.jpg
  6. Change the description text to describe your theme.

    The example changes the description to description = Yellow and Black Theme.

  7. Save this file using the new name you gave your theme.

    The examples is named drupalfordummies.info. You can delete the original .info file.

    Your .info file should now look similar to the following illustration.

    image1.jpg
  8. Open the template.php file in a text editor, use FIND and REPLACE to find the name “garland” and replace it with your theme’s name (for example, drupalfordummies). Save your file.

  9. Repeat Step 8 for the theme-settings.php file.

blog comments powered by Disqus
Advertisement

Inside Dummies.com