Drupal – Customize a Specific View Layout by Views Template

Sometimes we need to change the view template file (.tpl.php) in order to customized the layout of the specific view. Before you start editing, you have to find out the corresponding .tpl.php for your view. This can be found in the Views setting page as shown below.

 

The current template is views-view.tpl.php which is located at <drupal_root>/sites/all/modules/views/theme. But we should not edit this template file directly since it control the layout of all views. Instead, we should copy the views-view.tpl.php to our current theme folder and rename it to views-view–MusicView–page-1.tpl.php where we should put our modification.

views-view–MusicView–page-1.tpl.php

...
  <?php if ($attachment_before): ?>
    <div class="attachment attachment-before">
      <?php print $attachment_before; ?>
    </div>
  <?php endif; ?>

  <?php if ($rows): ?>
    <div class="view-content">
      <!-- Add a div before showing the content -->
      <div id="eureka">Eureka!</div>
      <?php print $rows; ?>
    </div>
  <?php elseif ($empty): ?>
    <div class="view-empty">
      <?php print $empty; ?>
    </div>
  <?php endif; ?>
...

 

Then you can rescan the template file and you should find the current template is switched to views-view–MusicView–page-1.tpl.php.

 

The layout is changed.

 

Done =)

One thought on “Drupal – Customize a Specific View Layout by Views Template”

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 )

Google photo

You are commenting using your Google 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 )

Connecting to %s

This site uses Akismet to reduce spam. Learn how your comment data is processed.