Theming Views on Drupal 6 (the simple way)

Thu, Mar 11, 2010 by Erico Nascimento

There are several ways you can theme a view on Drupal, and this tutorial will describe a simple and quick way to accomplish just that. I assume that you’re familiar to working with Views and CCK, so I won’t go in much detail on the process of creating the view and content type.

For this example I’m creating a block simple view that will display a teaser for the 3 latest blog posts.

First thing we’ll have to do is create the actual template file on the themes folder (I’d recommend that you create a folder for all the views, but this is optional). We’ll start by going to the views interface to find out how that file should be named.

On the Views interface select “Theme: information” under “Basic Settings”.

You’ll see a list of the possible files you can use listed from the most general(full page)on top to the most specific on the bottom. We’re going to be selecting one option on the “Row Output”. If you don’t need to be too specific about theming that view, you can use the second option. Copy the file name and create that file on your themes folder.

Back to the view interface again. Select “rescan template files” and the file you created should be highlighted on the interface.

Here is where the real theming begins. We’re going to create the variables we need on the template file. In this case, I’ll be creating $title and $body variables.

Go to your views interface under “fields.” However, the links to the fields you want to use are found at the status bar, on the bottom of the browser. We’re looking for the information on the last section of the link. For the Title field, my link looks like this: http://domainname.com/admin/build/views/nojs/config-item/footer_blog/block_1/field/title so the information we’re looking for is “title”.

Knowing that you can set up or title variable like this: $title = $fields['title']->content; And repeating the process for the body will get you something like this: $body = $fields['body']->content;

Now that you have your variables set, can go ahead and theme your file at will! You’ll find yourself dealing with a very simple and clean template file!

Do you have a different technique to theme your views? Share with us!

Anonymous posted on May 5, 2010 1:14 pm

After selecting a different theme from the drop down and saving the view.When i recheck the settings ,it is set back to the default using theme.
Is it a bug in views ? if not then what is the purpose of using the drop down here.

Ace posted on April 19, 2010 5:54 pm

Thank you for placing these screen shots up! I was looking all over for these simple instructions on how to create a theme for Views. Amazingly (or typical) I couldn't find these simple instructions in the plethora of documentation on Drupal's Web site, or the Views module's landing page. I'd been RTFM, but the documentation is always written as if one developer is speaking with another... not for someone that hasn't been involved in every facet of Drupal or Views from ground zero.

Thanks again! This really helps!

robb posted on March 19, 2010 9:20 pm

Thank you so much for this post. It took me forever to find the variable to simply display the body field in my view theme.

$fields['body_1']->content; is not very intuitive.

And thus ends my many-hour search for something I thought should be basic.

Gots to love Drupal.

Drupal Theme Garden posted on March 16, 2010 1:45 pm

Thanks for your post.
it's similar to http://www.group42.ca/theming_views_2_the_basics.

igor posted on March 15, 2010 6:50 am

another may be http://drupal.org/project/semanticviews
it's on the way to be included into views3 http://drupal.org/node/740686

Post new comment

The content of this field is kept private and will not be shown publicly.
  • Web page addresses and e-mail addresses turn into links automatically.
  • Allowed HTML tags: <a> <em> <strong> <cite> <code> <ul> <ol> <li> <dl> <dt> <dd> <img> <h2>
  • Lines and paragraphs break automatically.

More information about formatting options