行的Drupal视图水平布局

Question

我是 Drupal 主题的新手，我的任务是在首页上显示文章列表。我创建了一个视图，还创建了自定义视图模板，用于可能覆盖样式和标记。我已经准备好响应式标记，以便在其中显示 Drupal 文章内容。当前视图将文章图像、标题和正文显示为垂直列表，我正在尝试使用给定的标记水平显示它们。我花了好几个小时试图找出一种方法来做到这一点，但没有成功，任何帮助将不胜感激。布局如下：

标记可以在这里找到：

<section class="category-row people-row container">
    <h1><a href="#">Category</a></h1>
    <div class="row">
    <!-- medium article format-->
    <article class="col-md-8 col-xs-12 article-medium pull-left">              <figure><a href="#"><img src="http://xxxx" alt="REPLACE THIS WITH        STORY TITLE"></a></figure>
        <div class="teaser">
            <h2><a href="#">xyz</a></h2>
            <p>Donec id elit non mi porta gravida at eget metus. Fusce dapibus, tellus ac cursus commodo, tortor mauris condimentum nibh, ut fermentum massa justo sit amet risus. Etiam porta sem malesuada magna mollis euismod. Donec sed odio dui. </p>
        </div>
    </article>

    <!--small article format-->
    <article class="col-md-4  col-xs-6 article-small pull-right mpu-holder">
        <h2 class="hide">Advert</h2>
        <div>
            <img src="images/mpu.jpg" width="300" height="250" alt=""/>
        </div>
    </article>

    <!--small article format-->
    <article class="col-md-4  col-xs-6 article-small pull-right">
        <figure><a href="#"><img src="http://xxxx" alt="REPLACE THIS WITH STORY TITLE"></a></figure>
        <div class="teaser">
            <h2><a href="#"> Etiam porta sem malesuada magna mollis euismod sem malesuada magna mollis euismod</a></h2>
            <p>Donec id elit non mi porta gravida at eget metus. Fusce dapibus, tellus ac cursus commodo, tortor mauris condimentum nibh, ut fermentum massa justo sit amet risus. Etiam porta sem malesuada magna mollis euismod. Donec sed odio dui. </p>
        </div>
    </article>

    <!-- link to category listing page-->
    <div class="col-md-12 clearfix">
        <a href="#" class=" more-link">More people stories &#8594;</a>
    </div>

  </div> <!--end row-->

</section> <!-- end container -->

谢谢

莫

Answer 1

您的目标最好通过创建 2 个视图（或更准确地说，为您的视图创建两个显示）来实现。

• 主区域一个显示 - 可以设置为仅显示第一个结果。
• 侧边栏的一个显示。在第二个视图中，您可以将广告粘贴在标题区域中，然后将该视图作为块输出。将其设置为跳过第一个结果，该结果将由主视图显示。

然后，您可以将这些显示中的每一个嵌入panels，并为每个显示提供不同的上下文。这将允许您根据需要将任意数量的这些“集合”添加到您的页面中，每个集合都显示来自不同分类术语的内容。