A Guide to Drupal eCommerce and Site Development

Anyone building a web site will encounter situations where they would like to tweak the display of the web site’s elements, or insert some functional logic they’ve written, located from a friend, or found while researching. Developing a site within Drupal provides several easy techniques for you to accomplish such goals. Depending upon your needs, one of the following should handle your needs for customizing your site.

To customize the look of your site:

• Add a theme from a Drupal Theme Developer or Drupal.org
• Modify a theme with a provided local changes CSS file
• Create a sub-theme that mimics another theme, but with your changes
• Write your own theme

To customize functionality of your site:

• Add a module from the community contributed repository at Drupal.org
• Activate the PHP filter and add logic directly to a node
• Write your own Drupal module

In this tutorial, each of these methods is described. For the methods not already heavily documented elsewhere, I’ll provide step-by-step instructions. I’ll also discuss why one technique may be better than another depending upon your situation.

Overview of Customizing the Look of Your Site
Within Drupal the appearance of a web site is controlled by the currently active theme. A theme is similar to an application’s “skin”, or a suit of clothing a person might wear. A theme is visual dressing for the site’s contents. Changing themes retains site contents, the site will just appear with a different layout, different colors and so on. Drupal has a whole theming interface for graphically oriented web site designers, and many of the best such designers open source themes they have created. You can browse available themes, collected at Drupal.org, and download and install them to your site. I will not go into how to download and install themes, because great guides are already available all over the place.

However, finding a theme with colors, fonts and layout exactly as you want, with no changes necessary, may be time consuming. The solution is to locate a theme that is close enough, and then make changes to that theme until you are satisfied. Making changes can be accomplished in several ways:

1. Modify the theme’s files until they do want you want;
2. Ensure that the theme supports local changes, and use that support;
3. Make a sub-theme if your theme of choice does not support local changes.

The first option is not a good one to use. Because themes are evolving with bug and security fixes, you want to be able to grab a new version of your theme when one is released. Making changes to the theme's files prevents you from doing this without a complicated and error prone file merging process. Believe me, you do not want to use this method!

The second option is an okay solution if your theme supports local changes. Not all themes do; it is up to the theme developer to provide a method for local changes. A theme supports local changes when an empty CSS file is provided for you in which to place your localized CSS modifications. Using this approach, you can only change things controlled by CSS, such as font, colors, images and layout, but often that is all you will need. However, this technique ends up being little better than the first option. If your changes are limited to CSS, you'll only have one changed file to remember. But if your changes include modifications to the theme's images, you are back to the situation where an error prone file merging process is required when a new version of the theme is released.

The third option is the best one. Even in cases where a theme supports local changes, I choose to sub-theme. Why? Because themes receive bug and security fixes. When that occurs, you need to download the new version and replace the older version in order to get the bug or security fix. In the situation where I’ve made local modifications to a theme, I need to remember that I’ve made local changes, copy any modified files out of the theme directory before I overwrite the older version with the newer version, and then copy the changed files back. Yeah, often this is only one file, and needing to remember to copy one file out before updating is not too bad if you are only maintaining one web site. However, if you’re a professional like me, you maintain quite a few web sites. Remembering or checking for local changes is a time consumer you simply don’t have to put up with when you can simply use a sub-theme.

Sub-theming is a technique built into Drupal, so it does not depend upon your chosen theme’s developer to support. Sub-theming creates a new theme by starting with another theme, called the base theme, and then any item you specify in your sub-theme files overrides the same item in the base theme. Plus you can create new CSS classes, new page regions, and pretty much do whatever you want – building on top of your base theme. A sub-theme lives in its own directory, separate from its base theme, so when a new version of the base theme is released, you can just over-write the old base theme files with the new files and you are good to go. Creating a sub-theme is also trivial, and provides the maximum amount of control short of creating your own theme from scratch.

A more advanced Drupal developer can create a stand-alone theme. This is a topic I will not be covering in this tutorial. Creating your own theme is not necessarily difficult, but to do a good job, you need to learn several topics in depth that are fairly complex, and those topics need to be employed all at once to create a good Drupal theme. For those interested in learning how to create themes from scratch, I strongly recommend [amazon 0137136692 inline] by Konstantin Kafer; that is the first Drupal book I read, and I still consider it the best one. I only recommend creating your own theme for graphic designer / web developer professionals who intend to specialize in theme development. It is a large body of knowledge to learn, and for most of us, sub-theming offers all the flexibility we need.

Overview of Customizing the Logic of Your Site
In a similar manner as Drupal themes, Drupal has plug-in modules providing additional functionality beyond what is in a standard install of Drupal. Plus, Drupal.org has a collection of over 7000 community contributed modules for Drupal 6, and over 500 for the unreleased-at-the-time-of-writing Drupal 7. Just as with themes, you can browse through the available modules and easily download and install them to add new functionality to your site. I will not be going into how to download and install a Drupal module, because that information is documented in many places already.

Sometimes it can be convenient to simply write PHP logic directly into a page. This is also an easy way to add java script to only a few pages of your site. When I first started with Drupal, before I’d read any books, I created an accounting company’s intranet using this method. Now that I know better, I’d create a custom module. But in some situations, writing PHP directly into a node can be handy. For developers needing (or required) to use Drupal and do not have the time to properly learn Drupal’s structure and development API, using PHP directly in nodes can be a project saver. However, anytime a larger-than-minor project is implemented in this manner, the “owners” need to be briefed on the difficulty this technique places on site management. Placing PHP directly into your nodes is nice, but it mixes content with function in a hard-coded manner. Modifying the “code base” of your PHP when it is intermixed with content is harder than creating a custom module and throwing all your logic in there.

Finally, writing a custom module is the preferred method, and it is really simple. For most Drupal projects I do today, I create an empty module at the beginning of the project, and use it for custom logic and useful code snippets.

To enable you to jump directly to the site modification technique you care about most, here’s a set of links directly to each sub-tutorial:

• How to Search for Drupal Themes, Modules and Information
  
• How to Check if a Theme supports Local Changes
• How to Customize a Site’s Appearance by Creating a Sub-Theme
• How to Make Changes to a Drupal Theme
• Inserting and Using PHP in your Drupal Site's Content
• The basics of using Java Script in Drupal
• How to write your own Drupal module

In each of the sub-tutorials, I give step-by-step instructions, and useful tips I’ve learned. If you have any questions or suggestions for how I can improve the above, please write a comment. Constructive comments will be followed as much as possible.