怎样优化Drupal的Views模块生成的HTML代码呢？

Drupal建站 - Drupal方法心得 Friday, 23 April 2010 15:50

这是个问题；用Drupal在本地做测试站的时候，上一版使用Views+Panels做输出和布局，用的是蛮开心的，但是看看Panel生成的HTML结构及重量，实在想哭。于是现在的版本呢，就是写自定义模板来做页面布局，使用Views来生成绝大多数的内容。

慢慢的coder人格的洁癖又犯了，看着Views生成的那一堆有用的没用的HTML，又流出眼泪水了。当然Views的输出是可以用模板覆盖的方式来自定义的，但是这事我现在还拿不准应该怎样去做才能让不同的View使用不同的自定义模板。

刚刚受地球自转影响，突然想起去Modules里面找找看，使用“views”+“template”作为关键词，看中两个，接下来试试看：

其中一个是号称“开发者轻量级优化版本Panels”的Custom Page；当然这个是有关页面局部结构自定义的东东，属于Panels那个范畴，和今天主要念叨的Views不是一个方面，先备忘着。

然后就是这个Semantic Views，多好，看名字就对路，语义化Views；进去看了下应该就是我想要的了：

This Views plugin makes unformatted styles, field row styles and other output more readily configurable without needing to override template files. Instead of overriding row style templates for views where you want to specify different HTML elements (tags) and class attributes, you can specify these inside the Views UI and avoid overriding templates for each view.

作者贴心的给了个范例，用两段代码对比了该模块使用前后的区别，类似骗傻叉小姑娘的那些减肥药广告里面的减肥前后对比图；有的一看就不是一个人，上当的人就不该减肥，该治眼病。

使用前：

<div class="views-row views-row-1 views-row-odd views-row-first">
  <div class="views-field-title">
    <span class="field-content"><a href="/node/1">Augue Magna Cui Conventio Valetudo</a></span>
  </div>
  <div class="views-field-type">
    <span class="field-content">Story</span>
  </div>
  <div class="views-field-teaser">
    <div class="field-content">
      <p>
      node (story) - Abigo bene feugiat loquor neo lenis qui imputo. Suscipere molior obruo typicus jus euismod ille illum meus. Acsi populus pecus populus lobortis metuo voco. Aptent plaga incassum. Iriure cui cui commoveo eum hos dolor ex consectetuer. Typicus eros vulputate defui comis nobis humo. Ulciscor abigo occuro. Sagaciter tego dolore. Voco iusto jus. Abdo dolor verto gilvus mos iaceo vel loquor.
      </p>
    </div>
  </div>
  <div class="views-field-delete-node">
    <label class="views-label-delete-node">Delete link:</label> <span class="field-content"><a href="/node/1/delete&amp;destination=semantic-views-demo">delete</a></span>
  </div>
  <div class="views-field-edit-node">
    <label class="views-label-edit-node">Edit link:</label> <span class="field-content"><a href="/node/1/edit&amp;destination=semantic-views-demo">edit</a></span>
  </div>
</div>

使用后：

<div class="first odd">
  <h2 class="title"><a href="/node/1">Augue Magna Cui Conventio Valetudo</a></h2>
  <div class="node-type">
    Story
  </div>
  <p>
    node (story) - Abigo bene feugiat loquor neo lenis qui imputo. Suscipere molior obruo typicus jus euismod ille illum meus. Acsi populus pecus populus lobortis metuo voco. Aptent plaga incassum. Iriure cui cui commoveo eum hos dolor ex consectetuer. Typicus eros vulputate defui comis nobis humo. Ulciscor abigo occuro. Sagaciter tego dolore. Voco iusto jus. Abdo dolor verto gilvus mos iaceo vel loquor.
  </p>
  <div>
    <label>Delete link:</label> <a href="/node/1/delete&amp;destination=semantic-views-demo%2Funformatted-semantic">delete</a>
  </div>
  <div>
    <label>Edit link:</label> <a href="/node/1/edit&amp;destination=semantic-views-demo%2Funformatted-semantic">edit</a>
  </div>
</div>