Theming views in drupal 6

Taking as an example the view previously built to display the blogs page, I wanted to add an image on each of the outputted blog entries. This involves adding a division in the markup to accommodate an image on the background, therefore a tpl.php file that allows me to carry out the modifications on this particular view has to be created. I copied the views.view-list.tpl.php (which is the generic template for all views that wrap their rows in a list) from the modules folder, and pasted it into my theme folder.

Next thing is adding some specificity so that only the view to the blog page is affected, leaving the others as they are. Views provides a handy theming wizard in the Views UI, clicking on “theme: information” under basic settings. Doing so reveals a list of possible template file name candidates. Available template names will apply theming to various levels of the view, from broad to more specific. “views-view-list–Viw-to-blogs-page.tpl.php” served my purpose. In this file what I did was adding a div to act as the image placeholder on line 18, the result:

<?php foreach ($rows as $id => $row): ?>

<div></div>

<li class=”<?php print $classes[$id]; ?>”><?php print $row; ?></li>

<?php endforeach; ?>

The .imgplaceholder class contains the following attributes in line 318 of the file html-elements.css:

.imgplaceholder {

background-image:url(images/abs2.png);

background-repeat:no-repeat;

position:relative;

top:20px;

left:10px;

height:35px;

}

This was of help:

http://www.group42.ca/theming_views_2_the_basics

Advertisements

Posted on April 5, 2010, in Uncategorized. Bookmark the permalink. Leave a comment.

Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out / Change )

Twitter picture

You are commenting using your Twitter account. Log Out / Change )

Facebook photo

You are commenting using your Facebook account. Log Out / Change )

Google+ photo

You are commenting using your Google+ account. Log Out / Change )

Connecting to %s

%d bloggers like this: