Home / Articles / Adobe Dreamweaver / Modifying Drupal Themes with Dreamweaver CS5

Modifying Drupal Themes with Dreamweaver CS5

Article Description

In this tutorial, David Karlins shows how easily you can change the look and feel of a Drupal website with the help of new features in Dreamweaver CS5.
Setting Up a Theme

Setting Up a Theme

With the basic Drupal installation, you get a set of six themes for sites. The essential elements of those themes are CSS style sheet files that we'll detect and edit in Dreamweaver CS5. Other files are also included, such as a logo and blocks of text that are part of the theme. We'll venture briefly into Drupal itself to select and set up a theme. After that, we'll do our formatting in the comfortable and feature-filled Dreamweaver CS5 CSS Styles panel.

After logging into your Drupal site as an administrator, follow these steps:

  1. Follow the link to the Administer page. In the Site Building section of the Administer page, click the Themes link (see Figure 1).
  2. Figure 1 Selecting themes from the Site Building section of the Administrator page in Drupal.

  3. From the list of default themes, deselect the Enable checkbox for all but Bluemarine. Bluemarine will become the default theme. (We'll modify this theme in Dreamweaver.)
  4. Click the Configure link for the Bluemarine theme. The Themes page opens, with Configure and the Bluemarine theme selected. The Toggle Display checkboxes determine which elements of a page to display. Those elements are pretty self-explanatory. You can customize the site logo by navigating to an online image file in the Path to Custom Logo box, or by uploading a logo image from your computer, using the Choose File button in the Logo Image Settings section.
  5. Click the Save Configuration button at the bottom of the Themes page in Drupal. This step applies the selected theme and its settings to the site.

Now that we've selected and configured a Drupal theme, we can connect Dreamweaver CS5 to the Drupal site, and edit that theme in Dreamweaver.

4. Connecting Dreamweaver CS5 to a Drupal Site | Next Section Previous Section