Over time I have collected a number of modules and tools that have helped me to do theme Drupal sites more efficiently. This post is all about sharing that information with you!
If you aren't using Devel for your theme development, you are either not doing a lot of custom templates or preprocess function (of which I consider this module a must-have for), or you are using a more difficult '<pre>' wrapper for your variables. Devel provides a nice display of your arrays so you can easily target the items that you are looking for and keep the rest hidden.
When you're theming a Drupal site, the last thing you want is to have to come back after the job is done to re-style an element that wasn't there before. This module helps you with this. It creates nearly all displays of Drupal elements (form elements, tables, menus, status messages, ect.) so you can see how they all look on one page. This module alone can save you hours of bug-testing your theme trying to find all of these display scenarios.
This module is specifically for Drupal 6, because Drupal 7 has this functionality built right into the Views module. This allows you to control what wraps each view row as well as control how you wrap each field of the view's output. This module is a must-have for Drupal 6 views theming and will save time re-writing the output of most of your view fields and/or creating custom templates for each of your fields. You can quickly wrap your field in a <div>, <li>, <span> or what ever you want and give it a class that makes sense.
Certain themes, like Fusion, come ready for Skinr use. Others require some code to be placed in a few of your template files. The best thing about Skinr in my opinion is that you can set up a collection of pre-determined block styles so when you hand a site off to a client, their site manager doesn't have to add specific classes to blocks or know how to style them specifically. They can use an option menu to select between the styles that you have set up.
Menus can be fun in Drupal, sometimes all you need is for one menu item to have a specific class. This module allows not only that, but for you to add almost what ever kind of attribute you want. We have used this before to get shadowbox galleries to pop-up straight from a primary menu link, by adding a rel attribute. There are a lot of possibilities with this module, and it is easier than creating preprocess functions for all of these various abilities.
Display Suite is a great module for getting a light-weight level of control similar to panels. I think this is a great module for quick layout design. Display Suite is great for displaying Nodes, Taxonomies, and User pages and only gets better with Drupal 7!
And now for some extras that don't really have anything to do with Drupal...
This Firebug extension is perfect for those clients who nit-pick every pixel of a design when they see it in a browser. This program allows you to upload a graphic that you can place as an overlay on the website. This will ensure that your spacing is precise and your margins are exact, so when they say, "There is too much/not enough space" you can say with certainty, "It matches your mockup exactly." - at least in Firefox.
Eye Dropper is a simple Chrome plugin that allows you to select a color straight from a web page. You can be sure that when a client asks for a color that they've found on another website, you can easily get the exact color without searching the CSS or saving the image and opening it in photoshop to get the color.
This is another Chrome plugin that allows you to hover over a web page and view the elements. This is similar to firebug, but I thought this module was much better for Chrome than the Firebug extension.
Do you have a favorite tool that I haven't listed? I hope you will share it in a comment below!
Leave A Comment