Theme wizard in Views with Drupal 5

Customising views is even easier with Theme Wizard.

The requirements for this tutorial are:

  • Drupal 5.10
  • Views 5.x-1.6

Step 1 Get theme code

Views has a theme wizard which generates the necessary code to override the default theme so you can customize and style the view output.
Go to Administer >> Site Building >> Views then click on Theme wizard from the views tab.
node-30fig1.png

Step 2 Select a view

From the Select a view drop down just choose which view you want the theme code to be generated for also select Simple List from the Select Theme Typedrop down.
node-30fig2.png

Step 3 All the code

Once you have generated the code, you’ll get 3 sets of text areas with a bunch of code. The first is a function which you have to place in your template.php this will override the views theme function.

The second is the actual template which you’ll be styling and customising. The third is a css file which gives you the option to add the required css in that file. You don’t really needs this file if you are going to place all css code in your theme style.css.

Template.php

node-30fig3.png
Grab all the code from the “This code goes in your template.php file:” text area and open your theme template.php and paste the code in there.

Template file

node-30fig4.png
Grab all the code from “This code goes in a file named views-list-VIEWNAME.tpl.php:” text area or in this example “This code goes in a file named views-list-latest_recipes.tpl.php:” latest recipes is the name of the view. Theme wizard takes care of generating all this.

CSS code

node-30fig5.png

Get the css code and place it in a file the same way we did the template file appear.

Now that you have a template file for each single item in your view, you can add/remove div and do pretty much whatever you want.