As a block on my homepage I'm trying to output:

  <li><a><img><p>Node 1</p></a></li>
  <li><a>Node 2</a></li>
  <li><a>Node 3</a></li>
  <li><a>Node 4</a></li>

where each <li> represents a node, and the image/text supplied by CCK fields attached to each node.

Currently, I'm using a block view to output nodes 2-4, and an Attachment view to present the first node as outlined here: http://www.agileapproach.com/blog-entry/the-views2-attachment-display

The problem is my output ends up more like this:

<div class="attachment attachment-before">
  <div class="view view-homepage-news ..">
    <div class="item-list">
        <li class="views-row ...">  
          <a><img><p>Node 1</p></a>            
  </div> <!-- /.view -->
<div class="item-list">
    <li class="views-row ..."><a>Node 2</a></li>
    <li class="views-row ..."><a>Node 3</a></li>
    <li class="views-row ..."><a>Node 4</a></li>

I can probably bend that output suit my purpose, but it will involve a lot of templating and configuration. I'd also like to avoid using CSS and/or JavaScript to modify the output, unless that's my only option.

Given this, what's the easiest way to get the output closer to what I need it to be?

Edit: here's some rough php code I'm using in the customfield php code field (based on Jeremy French's suggestion: Here's the code I'm using in my PHP Code customfield:

  if ($static == 1) {
    $img_path = imagecache_create_path('news_image_thumbnail', $nd->field_image[0]['filepath']);
    print '<a><img src="' . $img_path . '"><p>Node 1</p></a>';
  } else {
    print "<a>Node $static</a>";

4 Answers 4


You could do something with views_customfield.

You add a php field, get it only to display the markup you want (no containing elements) and output a value only for row number 1.

  • This looks great! It's seems like a clean way to do it. Commented Mar 17, 2011 at 1:34

I personally use preprocess functions to do this, something like the following:

function HOOK_preprocess_views_view_fields(&$vars) {
  if ($vars['view']->name == 'VIEW_NAME' && $vars['view']->row_index == 1) {
    // Do stuff here.

I'm not sure if I'm understanding your question correctly, but I believe you could use Semantic Views module for this. If you set the Style under Basic Settings to Semantic Views, you'll then have an option under the Semantic Views settings to set a "first class attribute", which will help you target the first list item in your view in your theme's style.css file.

  • Semantic Views looks great, and will definitely clean up the output, but I want to avoid relying on CSS to hide the extra markup I would be outputting. Otherwise I would probably just use li:first-child to do what I need. Commented Mar 17, 2011 at 1:33
  • I'm just curious, since I'm still learning myself, but what's the rationale behind not wanting to use CSS to modify the first item in a list view?
    – Jay
    Commented Mar 17, 2011 at 12:52
  • 1
    mostly the extra HTML it will produce. Case in point: the site I'm working on will be used by some users with dialup connections -- every byte counts in these cases. Also, using CSS feels like a hack: maintenance wise, administrators shouldn't have to modify the CSS to modify the HTML output. That should be done in Drupal. Commented Mar 18, 2011 at 3:33

The easiest solution is with a custom template. It doesn't need to be a lot of work though. With the theming information available in the views interface you can see what template you need to change. All you need to do, is to add some code to print the extra items for the first node. Views will loop through each row, so should be easy.

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Not the answer you're looking for? Browse other questions tagged or ask your own question.