Как сделать весь вид связным?

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> 

Это мой вид поле screenshoot, я хочу, чтобы сделать кликабельную всю коробку:

Я попытался с

<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

Я думаю, что это скорее проблема с HTML, чем Drupal. Тег <a> является встроенным тегом, и вы разместили внутри него теги <div>. Естественное отображение тега <a> сделает это, только текст будет доступен для клика.

Что вы можете сделать, так это использовать CSS, чтобы сделать блок-элемент <a>, тем самым сделав кликабельную зону доступной для всего блока.

Сначала добавьте класс к вашей ссылке:

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

Тогда в вашем CSS, сделать <a> тега, отображающим как блок.

a { 
    display:block; 
} 

Это должно сделать трюк.