Drupal 7：视图中的硬编码布局

Question

在我的一个 D7 项目中，我使用了几个 tpl 文件来制作视图模板。请参阅下面的一些 tpl 文件代码。然而，我的客户已经审查了代码并发表了评论：

Hard coding layout in Views. Instead of creating blocks with different display layouts (same display layouts are the same in other places), there is a code with the layout on the Views result that it depends on the key of the result.

我听不懂他说的重点。如果您愿意，我可以分享一些额外的编码/管理面板屏幕截图

这里有一些 tpl 文件：

1.

<div id="programmes" class="page-section">
    <div class="container">
      <h1 class="section-heading"><?php echo t('OUR');?> <?php echo count($rows); ?> <?php echo t('key Programmes');?></h1>
      <h3><?php echo t('The XXX operate');?> <?php echo count($rows); ?> <?php echo t('key programmes to ensure the greatest global impact:');?></h3>
      <div class="programblock" >
      <?php
       if($rows) {
       $count = 1;
       foreach($rows as $id => $row)
       {
            $title       = $view->render_field('title', $id);
            $description = $view->render_field('field_programme_description', $id);
            $image       = $view->render_field('field_programme_image', $id);
            $icon        = $view->render_field('field_programme_icon', $id);
            $color       = $view->render_field('field_programme_background_color', $id);
        ?>  
          <a href="#" class="programcard w-inline-block" style="background-color:<?php echo !empty($color) ? $color : '#FFFFFF' ?>"><img src="<?php echo $image; ?>" class="progimage">
              <div class="programtext">
                  <div class="w-clearfix">
                      <div class="progtabicon smallpti"><?php echo $icon; ?><br></div>
                  </div>
                  <div>
                      <h2 class="progtitle"><?php echo $title; ?></h2>
                      <div><?php echo $description; ?></div>
                      <div class="readmorecard"><?php echo t('Read More...'); ?></div>
                  </div>
              </div>
          </a>
       <?php
          $count++;
       }
       }
       ?>
      </div>
    </div>
  </div>

2.

<div id="s5" class="relevant-news">
    <div class="container w-clearfix">
        <h3 class="section-heading"><?php echo t('Related content'); ?></h3>

        <?php
        if ($rows) {
            foreach ($rows as $id => $row) {
                $image = $view->render_field('field_image', $id);
                $body = $view->render_field('body', $id);
                $title = $view->render_field('title', $id);

                $date = $view->render_field('field_news_publist_date', $id);
                $formatted_date = date('d F Y', strtotime($date));

                $programme = $view->render_field('field_news_programme', $id);
                $type = $view->render_field('field_tags', $id);
                ?>
                <div class="_4-block nomar4">
                    <a href="#" class="nl2 w-inline-block">
                        <div class="tag" data-ix="tagtext"><span class="cblu"></span><span class="uhcgreen"> </span><span class="jyel"></span><br></div><img src="<?php echo $image; ?>" alt="image" class="cardimage">
                        <div class="card-text">
                            <div class="cardtitle"><?php echo $title; ?></div>
                            <div class="tagtext alt"><?php echo $formatted_date; ?></div>
                            <div><?php echo $body; ?></div>
                            <div class="tagtext alt"><?php echo $programme; ?></div>
                        </div>
                        <div class="pagetype news">
                            <div><span class="fa"></span> <?php echo $type; ?></div>
                        </div>
                    </a>
                </div>
        <?php
            }
        }
?>


    </div>
    <div class="container"><a href="#" id="more" class="button reverse w-button"><span class="fa"></span> <?php echo t('View all News &amp; Media'); ?></a></div>
</div>

3.

<?php  global $base_url;?>
<?php
   if(!empty($rows)){
    $articles = array();
    $video    = array();
    $gallery  = array();
    $carousel = array();
    foreach($rows as $article){
        $nid = $article['nid'];
        $node = node_load(trim($nid));
        if($node->type == 'article'){
            $articles[] = $nid;
        }elseif($node->type == 'news_video'){
            $video[] = $nid;
        }elseif($node->type == 'news_gallery'){
           $gallery[] = $nid;
        }
        $slider = 0;
        if($node->type != 'article'){
            $carousel[] = $nid;
        }
    }
    $items = array();
    $count = 0;
    if(!empty($carousel)){
            $slider = 0;
            foreach($carousel as $nid){
                $items[$slider][] = $nid;
                $count++;

                if(($count % 5) == 0) {
                $slider++;
                }
            }
    }
?>


    <!--Show stiky images-->
    <div class="container w-clearfix">
      <?php
        $i = 0;
        for($i = 0; $i < count($articles); $i++){
        $nid                = (int) $articles[$i];
        $node               = node_load(trim($nid));
        $title              = $node->title;
        $image              = file_create_url($node->field_image[LANGUAGE_NONE][0]['uri']);
        $news_type_id       = $node->field_tags[LANGUAGE_NONE][0]['tid'];
        $news_type          = taxonomy_term_load($news_type_id);
        $programmes         = $node->field_news_programme[LANGUAGE_NONE];
        $type_name          = $news_type->name;
        $type_icon          = path_icon($news_type->field_news_icon[LANGUAGE_NONE][0]['icon']);
        $description        = !empty($node->field_short_description[LANGUAGE_NONE]) ? $node->field_short_description[LANGUAGE_NONE][0]['value'] : "";
        $date               = $node->field_news_publist_date[LANGUAGE_NONE][0]['value'];
        $program_name       = array();
        $program_short_name = array();
        $node_url           = drupal_get_path_alias('node/' . $nid);
      ?>
      <div class="_2block nomar special">
        <a href="<?php print $node_url;?>" class="nl2 bgimage w-inline-block" style="background-image:linear-gradient(180deg, rgba(21, 36, 49, 0), #152431), url('<?php echo $image;?>');background-repeat:no-repeat;background-size:cover;">
          <div class="pagetype">
            <div><span class="fa fa-<?php print $type_icon;?>"></span> <?php echo $type_name;?></div>
          </div>
          <div class="card-text"></div>
          <?php if(!empty($programmes)){ ?>
                <div class="tag">
                   <?php foreach($programmes as $key2 => $pro){
                       $programme            = taxonomy_term_load($pro['tid']);
                       $bundle               = $programme->field_icon_programme[LANGUAGE_NONE][0]['bundle'];
                       $icon                 = path_icon($programme->field_icon_programme[LANGUAGE_NONE][0]);
                       $program_name[]       = $programme->name;
                       $program_short_name[] = $programme->field_short_name[LANGUAGE_NONE][0]['value'];
                       ?>
                        <i class="<?php echo $icon;?>"></i>
                   <?php } ?>
                    <br>
                </div>
          <?php } ?>
          <div class="card-text forcedown">
                <div class="cardtitle bigct"><?php echo $title;?></div>
                <div class="tagtext alt"><?php echo date("d M Y", strtotime($date));?></div>
                <div><?php echo $description;?></div>
                <?php if(!empty($program_short_name)){?>
                <div class="tagtext"><?php echo implode($program_short_name, ', ');?></div>
                <?php }?>
          </div>
        </a>
      </div>
      <?php
            if($i == 1) {
                break;
            }
        }
      ?>
    </div>

Answer 1

首先，视图为创建的一个视图提供多个 "Display"。它允许您创建此视图的一些不同的显示来处理和管理 data/display。 - 您可以创建类似 "Page" 的显示，这样您的视图将拥有自己的 url。 - 你可以创建另一个像 "Block" 这样的显示，所以它提供了一个你可以添加到 region

的块

Small tutorial for view creation

第二件事是了解可用的模板挂钩覆盖，这样您就可以更改 html 并显示视图：

如果我的视图名为 "test" 并且我的显示名为 "block" ，我可以用文件

覆盖

views-view--test--block.tpl.php

How theming function work

第三，模板不得包含函数调用，它会产生一些性能问题，这不是一个好的做法。只有 $variables 必须是 echo 或 printed。您可以查看 views module 文件夹下的 "themes" 以了解。

最后，如果您需要在渲染之前修改一些数据，您可以使用几个挂钩 custom modules 或 template.php 来修改它

List of hooks available

希望对你有帮助:)

Drupal 7：视图中的硬编码布局

Drupal 7: Hard coding layout in Views

drupal

drupal-7