10 great modules for Drupal theming and site-building

If you're new to Drupal, and even if you're not, you may find the process of putting together a site to be rather baffling. With over 25,000 modules to choose from, it can be challenging to find the one that will solve your particular problem. This article will show you some useful Drupal modules for implementing common design components such as slideshows, contact forms, menu configurations, and more.

This article assumes some familiarity with Drupal and the fundamentals of setting up and configuring a site. Some of the more obvious and essential modules aren't included here (e.g. Views).

Context

Context module used to provide different colour schemes for different sections of a site.

 

Context admin interfaceDo you need to do something different with one part of your site? Context is ideal for dividing your site into sections, based on various criteria, and apply different "reactions" to those sections. You can create a section based on content type, menu path, taxonomy term, user roles, and more. Reactions include:

  • add blocks to regions
  • control which menu item is active
  • add different titles and subtitles
  • add a unique class to the HTML body tag

jCarousel

jCarousel in use on a design portfolio site

Configuring a View to display as a jCarouselThis module makes the popular jCarousel plug-in available to Drupal. jCarousel is normally used to display and scroll multiple images in a row. There are many configuration options, and it's simple to turn any view into a jCarousel.

jCarousel isn't just for images either. Pretty much anything Views can output can be put into a jCarousel. There are several simple themes included, or you can completely override the designs with your own images and CSS.

Views slideshow

Views Slideshow in action

Setting a view to display as a Views SlideshowThis is another way of creating slideshows in various configurations. It is very similar to jCarousel, and has very similar usage and configuration options. Instead of displaying several images in a row, however, Views Slideshow is best used when displaying and scrolling one image at a time.

Wondering which carousel module to use? jCaoursel is great if you want to display and scroll multiple images in a row (or column). Views slideshow is better if you want to display one image at a time. Both modules allow you to include other content – pretty much anything you can add to a View, you can add to a slideshow.

Colorbox

Colorbox modules used to enarge screenshots on a portfolio site.

Admin interface for setting fields to display in a colorboxThere are many JavaScript Lightbox scripts out there. These modules allow you to link a photo (or text, or whatever), to a large version of the image, in a pop-up overlay. Colorbox is one of the few options with a well-maintained Drupal implementation.

The module integrates well with both fields and Views. You can easily set an image field or View to display in a colorbox. It also provides a very powerful colorbox trigger field to Views, which can allow you to do some pretty neat things.

Lightbox2 and Shadowbox are two other useful options. I personally found Colorbox to have more usable controls within Drupal than Lightbox2, and Shadowbox requires a lisence for commercial use. The comparison of Lightbox-type modules is currently rather out of date but may be helpful.

Menu block

Menu block used to display a section of a menu tree

Menu block admin interfaceAh, the mysterious Drupal menu system. It's simple to display a flat list of menu links, but what if you want to something different? What if you want the whole tree? Or part of a tree? It's common for a design to show a top-level set of links in a horizontal menu, with related sub-navigation in a sidebar. How do you do that?

Enter Menu block. This module can output sections of a menu tree in different configurations. You can also configure menu blocks to follow the active page, which makes it possible to create one menu block for each sub-section of a menu. Make sense? I hope so.

The configuration options can be rather confusing, but with a little fliddling you can get just about any menu output you could wish for.

Contact form blocks

Screenshot of Contact Form blocks placed in a footer
 

The default Drupal contact form isn't exactly the most configurable thing in the world. Changing the title or adding intro text can be a pain. And what if you want to have multiple contact forms in different places on your site? Or maybe your designer has done something wacky like put the form in a footer or sidebar. 

The Contact form blocks module exposes contact forms as blocks. You could add one to a simple page containing the rest of your contact information, making the content easier for clients to edit themselves.

Each contact form category gets its own block, so you can have different types of forms (going to different people), in different locations on the site. The settings for the module allow you to select which categories should have blocks available.

Conditional stylesheets

Conditional stylesheets added to a theme's .info file

Ah, IE 7. The source of hours of frustration (now that IE 6 is out of the picture). I'm sure you know that you can serve alternate CSS to IE using conditional comments. But how do you use these with Drupal?

You could create your own html.tpl.php and put it in there. Or you could use the drupal_add_css() function in your template.php file. Or you could use a module created especially for this purpose.

Conditional Stylesheets allows you to add special stylesheet files for IE, based on the conditional comment syntax, in your theme's .info file. The module will then insert the stylesheets in the <head> of every page along with the rest of your CSS files.

Devel/Devel generate/Devel themer

Screenshot of Devel Themer in action
 

Devel generate admin interfaceDevel is a module created especially for developers, but it also has some add-ons that are very useful for thememers and site-builders like you.

Getting clients to deliver content ahead of time is wishful thinking. But we all need something to work with while developing content types and associated views, taxonomies, menus, and template files. This is where devel generate comes in. It can create node content, taxonomy terms, menus, users, and more. Just tell it what you want it to create, and off it goes!

Devel themer is an associated module that is created just for themers. This module provides lots of information that primarily helps you to figure out where a certain bit of code comes from. Is there a template file for that? A theme function? If your best guesses aren't getting you anywhere, devel themer will help you out.

As you can see in the screenshot above, devel themer can mess up the display of your theme. It's best to turn it on when you need it and turn it off again when you're done.

Dummy image

Dummy images replace missing on a site in development

If you've used Devel Generate to create some fake content, you've probably noticed that the images it creates don't look so good with your beautiful theme. Dummy image can fix that! It replaces all the images on your site with images from a third-party provider. You can choose from four service providers: PlaceKitten, Flikr Holder, Lorem Pixum, and the clean and simple dynamic dummy image generator.

This tool can be rather slow, so it might not work for you if you're on a sluggish server.

Drush

Drush used to install and enable modules, and clear the cache (highlights added)

If you're heard of Drush, you probably think it's just for developers too. Not so! Drush makes downloading and enabling modules (among other things) much faster and easier. Need to download several modules at once? No problem, just enter drush dl module1 module2. Do you want to clear the cache without navigating to the performance screen? Enter drush cc.

I know what you're thinking. You're not really familiar with command-line tools. Not to worry, we have an article for that. Check out SSH: It's really not that scary.

Discussion

What are your favourite Drupal modules for site building and theming? Post your own favourites (with example sites!) in The Webmaster Forums discussion on this article. Your examples may be featured a a follow-up to this article with even more great Drupal modules for theming and site-building.

Megan McDermott's picture

About the Author

Megan is co-founder and editor of A Padded Cell and administrator at The Webmaster Forums. She has been designing websites since 1997, with expertise in design, information architecture, usability, HTML/CSS, Drupal theming, and more. She is available for short-term or ongoing freelance work in any of those areas. Read her web design blog at MeganMcDermott.com or check out her portfolio.