Drupal 7自定义视图主题

时间:2015-09-28 11:40:07

标签: drupal-7 drupal-views drupal-theming

我的HTML如下:

        <div class="top-grids">
        <div class="container">
            <div class="col-md-4 top-grid text-center">
                <div class="top-grid-pic">
                    <img src="images/pic01.png" title="Boots" />
                    <span>Boots</span>
                </div>
                <div class="top-grid-pic-info">
                    <a href="single-page.html">Seeall</a>
                </div>
            </div>
            <div class="col-md-4 top-grid text-center">
                <div class="top-grid-pic">
                    <img src="images/pic02.png" title="Boots" />
                    <span>Casual</span>
                </div>
                <div class="top-grid-pic-info">
                    <a href="single-page.html">Seeall</a>
                </div>
            </div>
            <div class="col-md-4 top-grid text-center">
                <div class="top-grid-pic">
                    <img src="images/pic03.png" title="Boots" />
                    <span>Formal</span>
                </div>
                <div class="top-grid-pic-info">
                    <a href="single-page.html">Seeall</a>
                </div>
            </div>
            <div class="clearfix"> </div>
        </div>
    </div>

在Drupal 7中,我创建了一个视图(块)并将其命名为#34;特色产品&#34;。我添加了两个字段 - 图像和标题。请检查附带的屏幕截图。

enter image description here

在完成同样的操作后,我创建了一个名为&#34; views-view-field - new-uc-products - block.tpl.php&#34;并编写如下代码:

<div class="top-grids">
        <div class="container">
                <?php print $output; ?>

        </div>

并将其置于&#39;模板&#39;文件夹中。

现在我看到了drupal站点和包含以下HTML结构的View Source文件:

&#13;
&#13;
 <div class="view-content">
      <table class="views-table cols-0" >
       <tbody>
          <tr class="odd views-row-first">
                  <td >
            
<div class="top-grids">
			<div class="container">
					<div class="col-md-4 top-grid text-center">
<div class="top-grid-pic"><div class="product-image"><div class="main-product-image"><a href="http://localhost/uberdrupal/sites/default/files/styles/uc_product_full/public/515sRCSoS9L._SX331_BO1%2C204%2C203%2C200_.jpg?itok=lji5BBNF" title=""><img typeof="foaf:Image" src="http://localhost/uberdrupal/sites/default/files/styles/uc_product/public/515sRCSoS9L._SX331_BO1%2C204%2C203%2C200_.jpg?itok=4Exqjiv3" alt="" title="" /></a></div></div>
								</div>
</div>

          </td>
                  <td class="views-field views-field-title" >
            
<div class="top-grids">
			<div class="container">
					<span>Twisted</span>
					</div>
					<div class="top-grid-pic-info">
						<a href="single-page.html">See All</a>
					</div>
				</div>								</div>
</div>
&#13;
&#13;
&#13;

有人可以告诉我如何自定义视图模板,以便它可以按照我的需要显示HTML?

由于

1 个答案:

答案 0 :(得分:0)

转到admin / structure / views / settings并进行这些设置 Settings

然后转到您的视图,在高级下,您将拥有主题:信息。单击它,您将看到一个tpl文件列表,您可以根据需要更改html。