By Anonymous (not verified) on

I'm trying to theme a view I created in my Drupal 6 site using Views 2.

I have 5 fields for a custom node type (title, image, date, description and URL). I would like to be able to create (or copy) a .tpl.php file in which I can specify where the image goes, where the date goes, how many divs surround the URL, etc. and put it all in a loop (to create each node for the view).

However, the Views 2 theme information only seems to output a loop with $field->content in it. I've read the help section on Using Views Templates, but still can't work out how to tell the .tpl.php file where to put the specific fields (title, image, URL, etc.)

Any help getting my head around this would be much appreciated!

⋅ Categories: Drupal 6.x

Comments

mistresskim’s picture

mistresskim commented

Just asked this Q last week! You can output individual fields in your views-view-fields--VIEWNAME.tpl.php file like this:

print $fields['field_name']->content;

So

$fields['title']->content for the title

$fields['your_image_fieldname_fid']->content prints your image with name your_image_fieldname

These instructions are actually written in the last paragraph of the help page you linked to but the first part of the page lead me astray into thinking I could get everything from the $row variable.

Anonymous’s picture

Anonymous (not verified) commented

Thanks newkid!

I had seen that section of the help file, but didn't realise I had to use the values from the actual Theme: Information page (I was trying to use values output from the $row variable).

I now have a working views-view-fields.tpl.php file that looks like this:

<div class="my-custom-node">
  <div><?php print $fields['field_screenshot_fid']->content; ?></div>
  <div><?php print $fields['field_date_value']->content; ?></div>
  <div><?php print $fields['field_title']->content; ?></div>
  <div><?php print $fields['field_description_value']->content; ?></div>
  <div><?php print $fields['field_url_url']->content; ?></div>
</div>

At first, I still had the foreach loop from the original views-view-fields.tpl.php, but quickly got rid of that when I realised I didn't need it either.
Thanks again!

nelslynn’s picture

nelslynn commented

Is there a way to have more control over a view's output? How would one output the fields of a view similar to this:

<div class="col_main">
  <div><?php print $fields['field_image_fid']->content; ?></div>
  <div><?php print $fields['field_date_value']->content; ?></div>
  <div><?php print $fields['field_title']->content; ?></div>
</div>

<div id="col_right"</div>
<ul>
  <li><?php print $fields['field_thumbnail_fid']->content; ?></li>
</ul>

Is it possible to separate the fields of a view such as this??

Thanks...

mcfilms’s picture

mcfilms commented

All of you are further along the learning curve than me. Subscribing!

A list of some of the Drupal sites I have designed and/or developed can be viewed at motioncity.com

lizbethalml’s picture

lizbethalml commented

sorry I found the solution... it might work...

rcharamella’s picture

rcharamella commented

I need to output each field value within the loop so that I can specify the css with which to fomat it. I need each row of data to be inside of a 1 row, 2 column table. The current table output generated by the default views-view-table.tpl.php doesn't give me the granularity I need. 

<?php foreach ($rows as $count => $row): ?>
 <table class="upcoming_listing">
  <tbody>
      <tr>
          <?php foreach ($row as $field => $content): ?>
          <td class="<?php print $fields[$field]; ?>">
            <?php print $content; ?>    // I need to generate a row that shows one column with one of the fields value and another column with 4 field values that I can wrap with css
          </td>
        <?php endforeach; ?>
      </tr>
  </tbody>
</table>
<?php endforeach; ?>

Thanks in advance for any help you can give.

justageek’s picture

justageek commented 
<?php foreach ($rows as $count => $row): ?>
<table class="upcoming_listing">
  <tbody>
      <tr>
          <?php foreach ($row as $field => $content): ?>
<!-- column 1 --?
          <td class="<?php print $fields[$field]; ?>"> 
               <?php print $row['my_field_1'];?>
          </td>

          <td class="<?php print $fields[$field]; ?>">
            <?php  print $row['my_field_2'];?><br />
            <?php  print $row['my_field_3'];?><br />
            <?php  print $row['my_field_4'];?><br />
            <?php  print $row['my_field_5'];?><br />
           </td>

        <?php endforeach; ?>
      </tr>
  </tbody>
</table>
<?php endforeach; ?>
UNarmed’s picture

UNarmed commented

Hey how do i find what my field names are?

Jasonrj’s picture

Jasonrj commented

I was just stuck on this problem for a while. The easiest way I found was to go in to edit your view and hover over the field links and then look in the status bar. You will see a very long URL that ends with the exact field name. Something like ......../default/field/*THIS IS THE FIELD NAME*

mcfilms’s picture

mcfilms commented

Hi people,

I have been following this thread and reading what I can on theming. I have a very specific thing I would like to do, and if I can get this, I think everything else will fall in place. Most of the questions on here have been about theming the elements inside a views node display. I would like to step back and control the display of a series of nodes.

I am using Views 2 to generate 4 nodes in a block. Each of these nodes has a picture and a caption that links to a full rendering of that specific node. So far so good. I have done all that and stuck it into a block. I feel like I am making good progress making my site look like the original design. You can see it, and the problem, at:
http://motioncity.com/drupal/

As you can see, the 4 Views2 nodes are stacked one on top of the other. I would like to have them align right next to each other. According to Dev Module Themer, the file I THINK I want to edit is views-view-fields.tpl.php.

I understand moving it to my theme directory and rebuilding the registry. What I am unclear on is how to edit this file. I guess I was hoping it would reference the block and I could somehow apply a display: inline tag somewhere. But that's just not the case. It really looks like a loop that cycles through the field elements and creates the node.

SO, my questions:

1. Am I looking in the wrong place? Should I edit something else besides views-view-fields.tpl.php?

2. Can I just address that through my CSS by setting the left column block to display: inline, This did not work.

3. Alternatively, can I create 4 DIV elements in this DIV and push my content into them?

If you've read this far, thanks for having a look. Any help would be appreciated

Jerry

A list of some of the Drupal sites I have designed and/or developed can be viewed at motioncity.com

justageek’s picture

justageek commented

I think you will need to look at the page source and pull our very specific classes then theme them so that they display as you want them to, you might have to give them a width and float:left for them to line up one after the other, I'm not even sure you need the display: inline. But to answer your question, in general, I think you can do all of this with css.

If you need to resort to a template file, you don't really edit an existing file, you create a new one specific to your view. If you click the "Theme information" link in your view, it gives you all the possible ways to override the output and shows you how to name the necessary php file to accomplish each method.

The views-view-field.tpl.php overrides output at a data field level, I think.

If you names your view 'myview', then the override for the views-view-field.tpl.php for the 'title' field would be:

views-view-fielda--myview--title.tpl.php

I don't think that's what you need. I think you can do it with css, otherwise you might need to override the overall view output, and you name the template based on the Style of view (table, grid, html list,etc). Again, clicking Theme: information will tell you all of this info.

mcfilms’s picture

mcfilms commented

(This probably isn't the right place for this, but it is a follow-up to what was posted.)

Justageek, do you work freelance? Are you interested in helping me troubleshoot this?

I recognize that I am in over my head and I think I really need to just hire someone to lend a hand. Intuitively, I know what you are saying. I looked at view source to see HTML produced. It looks like Views is just cycling through and incrementing my row name. So I see:

<div class="view-content">
        <div class="views-row-1 views-row-odd views-row-first">
-- then the elements in that piece. then a close div and the next...
  </div>
  <div class="views-row-2 views-row-even">

Right. So then I edited my CSS and added this:

    .views-row-2
  {
  background-color:#00FF00
  }

    .views-row-3 views-row-odd
  {
  background-color:#FFCC00
  }

Giving a color background to posters two and three. Unfortunatly it also gave a color background to position 2 and 3 of a views-created menu too!

I can't sort out how to get finer granularity on the selection. I'm not even sure exactly how to position the elements. I guess my CSS skills are lacking and I need to find somebody who knows how to do this.

Do you think you can?

Thanks!

A list of some of the Drupal sites I have designed and/or developed can be viewed at motioncity.com

justageek’s picture

justageek commented

Yes I do freelance work, send me a pm and we can discuss.

JohnnyHa’s picture

JohnnyHa commented

Any of you two know how to remove the space these fields create ? Because when you output lets say 2 fields it will be a space between them, except date and title, they are together. But other fields liker teaser or link will create space. Have worked with tons of people to solve this mystery but everyone has given up so far. spent several hours trying to figure this out.
Its not a CSS issue, that much we have figured so far. This is something Drupal is outputting all by itself.

justageek’s picture

justageek commented

What type of view are you creating (what Style and Row Style)

tenx’s picture

tenx commented

suscribing

i will need to know this soon

rootwork’s picture

rootwork
he/him
Primary language English
Location 🇺🇸 US-Pacific 🌎 Chinook (Multnomah, Clackamas) & Cowlitz lands 🌹 Portland, OR
commented

At the Drupalcon doc sprint today, I worked hard to revamp the theming views 2 handbook page with lots of how-to steps. Please take a look and feel free to edit and/or leave comments with modifications.

drm’s picture

drm commented

So I was just giving these detailed template files a try. I have an unformatted view and need to place a thumbnail on the left, two text fields side-by-side on the upper right, and a multi-line text area below them, but still to the right of the photo.

I was getting some odd results, so I just tried using the default field template file that the view theme information link provides. When I used that file and rescanned, without changing a letter in it (it just has the print $output statement), the thing got screwed up. The field content was replaced by a lot of jibberish that looked something like CSS, but not all or exactly.

So I decided for now to not use them and just place everything via position:relative in a css file.

Shouldn't using the default template file not change the display?

fumbling’s picture

fumbling commented

Anyone know the easiest way to change the color of the alternating white/grey row stripes in the views table template? Didn't see anything in the main view table tpl file that indicated where to go to do that.

WorldFallz’s picture

WorldFallz commented

It's probably just a standard drupal themed table-- you should be able to do it with the right css. Maybe something like:

div.view tr.odd {
  background-color: #000;
}
div.view tr.even {
  background-color: #fff;
}
begona’s picture

begona commented

How can show the list of the comments that the node has???

I dont know how to do this, This thread help me a lot but I dont know how to do that

Kind Regards

WorldFallz’s picture

WorldFallz commented

It's not good practice to hijack a thread-- they're free so create you own!

In any case, you just need to add the 'node: comment count' field to your view-- it's very fruitful to browse the views options to see what's available, especially for fields, arguments, filters, and sorting criteria.

flowbyte’s picture

flowbyte commented

Subscribing.

drupal3013’s picture

drupal3013 commented

I need to put this code 

$output = preg_match_all('/<img.+src=[\'"]([^\'"]+)[\'"].*>/i', $fields["body"]->content, $matches);
$first_img = $matches[1][0];

if (!empty($first_img)) {
     print "<img src='$first_img'>";
}

to show the first image in as a thumb but i don't know where to put it

mcfilms’s picture

mcfilms commented

I wouldn't do it that way. I'd create two views. The first could show record 1 to 1 (the first record only. And that one could show the fancy image. Then I would add another View (using blocks or a View Attachment) and display the records starting at number 2.

Hope that helps.

A list of some of the Drupal sites I have designed and/or developed can be viewed at motioncity.com

drupal3013’s picture

drupal3013 commented

can you please explain more
I don't understand