Drupal Views Vertical columns (without tables)

Drupal Views Vertical columns (without tables) with html div's can easily be achieved by adding a simple template file.

Make your view use the grid (brrr tables) layout.

Then flap out te advanced fieldset and check the correct name for your view template override.

In your theme's templates folder create a file with the name suggested  (something like views-view-grid--yannick-portfolio--block.tpl.php).

Paste the following code in this template file.

 

<?php
/**
 * @file views-view-grid.tpl.php
 * Default simple view template to display a rows in a grid.
 *
 * - $rows contains a nested array of rows. Each row contains an array of
 *   columns.
 *
 * @ingroup views_templates
 */
?>
<?php if (!empty($title)) : ?>
  <h3><?php print $title; ?></h3>
<?php endif; ?>
<div class="columned_view <?php print $class; ?>"<?php print $attributes; ?>>
   <?php foreach ($rows as $row_number => $columns): ?>
      <div class='column column-<?php print $row_number; ?>'>
        <?php foreach ($columns as $column_number => $item): ?>
        <?php if($item): ?>
          <div class="<?php print $column_classes[$row_number][$column_number]; ?>">
            <?php print $item; ?>
          </div>
        <?php endif;?> you can easilky
        <?php endforeach; ?>
      </div>
    <?php endforeach; ?>
  </div>

 

 If you then want to alter your width, do this in the css file.

Css code to layout your columns:

.columned_view .column{
        width:20%;
        display:inline-block;
        vertical-align:top;
}