Hey Drupal-ers!

Man I love my new Drupal site! I'm so excited to add a whole new world of functionality to my next site. I've been figuring things out fairly good by myself too (with a little help from the Handbooks, Forums, Drupal Dojo, Lullabot and any other resource I can find).

So here's the thing... view theming has got me beat down, hog-tied, ball-gagged and feeling dirty all over... Anyway, I've looked at a lot of resources, I've tried to figure out what the 'Theme Wizard' actually does, I've examined the famed "http://drupal.org/node/42597" URL which is referenced every time someone asks about views theming... I don't get it.

I'd like to create a theme file (views-name-tpl.php) to customize my view, but I'm not sure what variables I can change. Does anyone know of a resource where I can find a view theme template override that I can add code to or adjust?

I'd be glad to write a step by step for other noobs when I finally get this thing figured out...

Thanks a ton guys!

Comments

dnewkerk’s picture

Hey Mike, glad you're diggin Drupal :D

From your description it sounds like you're seeking "the basics" rather than the meaty crazy stuff with Views theming :) As you probably know, Views is essentially a tool that spits out "lists of nodes" (and/or the fields thereof, and according to the filters and settings you specify). By default Views displays this output as "teasers" of the whole nodes (like blog format), styling them however your theme usually styles teasers. However, every node is made up of a series of "fields" of various data, and Views is able to spit all (or specific) fields out that make up your node individually, each field as a "list item" in an unordered HTML list, or as an HTML table depending on your settings. The Views Theme Wizard basically gives you access to the HTML of that list. At the heart of it what you have is a set of variables, one for each field (denoted like $this) which you can then reorder, restyle with HTML and CSS, or whatever you want to do to them.

Steps: 1) The Theme Wizard only works with "List View" types of Views... ensure that you've selected the "List View" type on the Edit page of your View, and also tell the View what you want it to "list" (in the Fields section, select the fields you want listed). You should also add the usual Filters as needed such as Node: Published and Node: Type. 2) Save the View and go to the Theme Wizard page. 3) Select the View you want to theme from the drop down list. 4) Under Select Theme Type, choose "Simple List" and press the Select Theme Type button. 5) Copy and paste the code as instructed on the page.

You'll have a chunk of code given to you that you just paste, as is, into your template.php file. Also you'll have a chunk of code that you need to make a new file for in your theme directory and name it as specified above the box that contains the code (e.g. views-list-nameofview.tpl.php). That file contains the variables you have at your disposal to work with (you can also get at more data to use in the View but that's more advanced). You don't "have" to make a new CSS file. You can either add the CSS classes suggested by the Views Theme Wizard to your own CSS file and style each variable that way, or you can strip out everything in the file and add your own CSS and HTML around the variables as you see fit.

Also, here's a little tip I've found useful... lists are a handy way in many cases to style the output of your field variables, though if you don't want the output of your Views to have HTML list items, you can adjust one line in the code given you for template.php...
Change:

    return theme('item_list', $items);

To:

    return implode("",$items); // Remove unneeded list item HTML, from http://drupal.org/node/136136

Hope this helps clear things up for you a bit :) This amount of Views theming should get you through most of what you need - occasionally if you need even more refined control of how a given field is output you may have to learn how to "dig" the data you need out of the $view or $node (when the time comes, ask about that and people will show you how to expose and use that data). Good luck!

-- Dave
absolutecross.com

uasport’s picture

Thanks Keyz, you definitely help me by leaps and bounds. One question though, whats the best ways to theme the item list without screwing up every other item list in my site? I used the code you posted to kill the item lists but couldn't find a way to separate each item into some sort of container to begin theming them. Any ideas?

uasport’s picture

i found out that I could just edit the view-viewname-tpl.php generated by the theme wizard to my liking. Its on now!

tflmike’s picture

Keyz-

You're totally extra super wicked bra! Thanks a TON! :D This tells me everything I need to know! We should put you post in the "how to theme views" handbook....

Anyone know how we could do that?

dnewkerk’s picture

Thanks Mike and Ron :) Glad I was able to help.
Actually, I'm on the Drupal documentation team... so I'll see about adding my little "Views theming basics" tip to the Handbook. I'll probably have to rewrite and refine it a bit to meet the documentation guidelines, but as soon as I can I'll put it in there :)

Go Drupal! :D

-- Dave
absolutecross.com