Design and Prototyping for Drupal

Chapter 14. Managing Your Code: Some Modules that Can Help

Once you’ve broken down your layout, settled on your base theme, and wrangled your Views code, you can finally start theming your site. But where do you get started? How do you find the right selector to apply your CSS to? This is where it helps to add a couple of tricks. You can do a lot with themes and Views rewrite options in terms of cleaning up the code Drupal gives you so you can theme more efficiently. However, there are still issues with some of the ways that Drupal outputs code. The following modules can help.

Block Class

Block Class (drupal.org/project/block_class) is a little module that does something very important: it allows you to give any block its own class, independent of what Drupal wants to call it. This is useful, for example, when you want to create a block of featured content, or even a new class called “green” that you apply to random blocks in your theme.

For example, going back to our home page for Urban Homesteaders Unite, one of the things that we’re creating is an “about this site” block that describes what people can do here. If we look under the hood at what Drupal calls this block, we’ll see something akin to Figure 14-1.

Figure 14-1. See that long list of class names that’s highlighted? That’s our block.

Now, we’ve already got some styling set in this block just from our typography defaults. But ...