In my recent advocacy for Drupal as being perfect for small websites and designers, I have decided to start writing tutorials. These tutorials will be perfect for web designers, rather than developers, because that's the area I see myself in. Drupal has a steep learning curve, but once the concepts are tackled, I think it's accessible enough for people who don't know how to write code.

I'm going to start with what I consider the basics. I'll assume (unless I get requests for it) that you've already set up a basic installation of Drupal, and are staring at the basic, boring Garland theme. Since we're designers, I'm going to assume that you will not want to use a stock template, and would rather design your own web site yourself. (Many developers, by contrast, are happy with a default theme, and are only interested in writing fantastic functionality. Good for them. We'll install their modules into our own fancy designs.)

Before we jump into the configuration of Drupal for your own site, this tutorial will simply walk you through the concepts. Once you understand the concepts, it will be easier to make your own decisions about what to install and how.

Drupal's Structure - Core, Modules and Themes

Drupal is organized in such a way as to allow developers to do their thing (write code) separate from the design, which in Drupal-speak, is referred to as the "theme." Core code is kept separate from additional functionality (called contributed modules) so as to allow easy updating and maintenance when new Drupal versions come out.

Now, even in core modules included in a plain vanilla installation of Drupal, some modules are optional, and do not require to be installed. We'll talk about that later.

Contributed modules are uploaded to the folder /sites/all/modules/, which you will have to create, and then enabled or disabled via the Site Building > Modules page. There are tons of modules out there that can do all sorts of nifty things for you. Modules can be downloaded from http://drupal.org/project/Modules. (Make sure that you download a stable version for the correct version of Drupal! Because this is a community website, many projects are still in development, but may not be ready for regular production use!)

Themes are located in a similar location in your Drupal installation, at /sites/default/themes. This is another folder you should create, as well. You will notice that there are already modules and themes folders set up in your Drupal intallation, but these have core Drupal files in them. As mentioned previously, you should avoid messing with the core files, and create the folders for contributed modules and themes. You can download pre-built themes here: http://drupal.org/project/Themes

A note about themes in Drupal: if you're new to Drupal, you'd be best off to use a pre-built theme, and modify the look-and-feel (XHTML/CSS) to suit your design, since there is PHP and other Drupally stuff in there. I usually start with the default Garland theme and copy it over to my sites/default/themes folder and edit out all the junk and start fresh.

Drupal Modules You'll Need

Now that we understand the structure of Drupal, it's important to note that I think Drupal's basic installation doesn't do a whole lot. I find that I really need to install a handful of other contributed modules no matter what the project is. Here are the modules you will likely need:

1. Views (http://drupal.org/project/views)
   It has a very ambiguous title, and if you don't know what it is, you wouldn't pay any attention to it. However, Views is probably the most important and most powerful module, and there has been lots of discussion about including it in Core, in future Drupal releases. Anyhoo, what does it do? Views allows you display your site's content in practically any way you can think of. Take my home page, for example. I used views to randomly select a single portfolio entry and display it on the front page.
   
   Another example of Views at work is my entire portfolio page. The top part of "Featured Projects" is a view which displays specific information about each project. I displayed a "teaser" view of the project at the top, and set it up to automatically link to the full project. The rest of the portfolio page is also created using Views, displaying thumbnails and titles of each portfolio entry. If I had lots of portfolio items, it would be a simple thing to make the portfolio only display a certain number of items per page, and then set up additional pages with pagination (previous and next links) to handle overflow. Views is also used on my site to have the latest blog entry on the home page. We'll explore views in more detail in a later tutorial.
   
   
2. Content Contruction Kit/CCK (http://drupal.org/project/cck)
   CCK makes Views even more powerful. By default, Drupal comes with a handful of content types. Blog postings, Story, Book and Pages. If you're new to Drupal, and you want to display your portfolio on it's own page, you might initially try to create a new piece of content called a "Page" (logical enough) to put your portfolio in.
   
   Really, a better way to think about your site is not in terms of how the links are set up, but rather the types of content being displayed. Let's think about that for a second. Say, you're trying to set up a portfolio site. What types of content are there? Well, there's regular text, like an "About Me" page, portfolio entries, featured projects and maybe testimonials. What I would do with CCK is create a new Content Type for each one. Then, when you want to add to your portfolio, you simply go to "Create Content > Portfolio Entry" enter the information, and if you set up a View already, it would automatically add your entry to the apporpriate place! WOW!
   
   I also mentioned Testimonials. You would create a new content type for testimonials, add a testimonial, and using Views, you could display a random testimonial on the right hand side of every page of your site! Thinking about your site in terms of the type of content you want to display will allow you to manipulate and change the display of that content very easily. It would make redesigning a cinch, because all you would do is create a new theme, modify the views a little bit, and bam! All the same content but in a fancy new display!
   
   
3. ImageCache (http://drupal.org/project/imagecache)
   Another strangely named module... thanks Developers! ImageCache is totally awesome for designers! It allows you to set up image-processing presets to use in places like Views. for example, you can automatically set up a scale and crop of your portfolio item, and even add an overlaid watermark! So, every time you add a new portfolio entry, you don't need to resize it, Drupal will resize it for you! PLUS, if you have different views of your portfolio items, it can use a different preset for each view. For example, back in my Featured Projects example, I have 3 different image presets. One for the top of the portfolio page, and when you click to view that project, it will then have thumnails on the page. When you click the thumbnail, you get the larger size image. All processed automatically!
   
   There are even some wackier uses of ImageCache, like this site: http://thevintageaviator.co.nz
   
   
4. Administration Menu (http://drupal.org/project/admin_menu)
   This module simply makes administrative tasks much easier. Nuff said.
5. PathAuto(http://drupal.org/project/pathauto)
   This module creates user- and search-engine-friendly URLs

Other important modules are FieldField, ImageField, and Link which are important modules for CCK and Views (you need ImageField for ImageCache, too!). Token is useful for PathAuto (among others).

Next tutorial I'm going to talk about Drupal's layout and basic configuration. Then we'll move on the much-more-fun theming.