如何使整个视图可链接？

Question

我希望整个视图可以链接。

这是我的重写规则：

<div class="news_column_wrapper z-depth-1 card">
<div class="news_column_images card-image">[field_images]</div>
<div class="news_column_content_wrapper">
<div class="news_column_created"><i class="fa fa-clock-o"></i>&nbsp;[created]</div>
<div class="news_column_title">[title]</div>
</div>
</div>

这是我的查看字段屏幕截图，我想让整个框可点击：

我试过

    <div class="news_column_wrapper z-depth-1 card">
<a href="[path]">
        <div class="news_column_images card-image">[field_images]</div>
        <div class="news_column_content_wrapper">
        <div class="news_column_created"><i class="fa fa-clock-o"></i>&nbsp;[created]</div>
        <div class="news_column_title">[title]</div>
        </div>
</a>
        </div>

但没有任何反应。我怎样才能做到这一点？

Answer 1

我认为它比Drupal更像HTML问题。 <a>标记是内嵌标记，您在其中放置了<div>个标记。 <a>标签的自然显示将使该文本可以被点击。

您可以使用CSS来使<a>成为块元素，因此，使可点击区域扩展到整个块。

首先在链接中添加一个类：

<a class='block_link'>
    <h2>My title</h2>
    <div>My content</div>
</a>

然后，在您的CSS中，使<a>标记显示为块。

a {
  display:block;
}

这应该可以解决问题。