Как сделать ссылку на картинку в виде новостей

голоса: 0

Здравствуйте. У меня стоит вот такой код для вида материалов в модуле новости. Картинка там некликабельная и стоит в самом диве. Я хочу сделать ее кликабельной (чтобы ссылка вела на полный материал), но никак не могу понять в какое место ставить код ссылки и как это оформить. Помогите пожалуйста.

<div class="news news5">  <?if($IMG_URL1$)?><a href="$ENTRY_URL$"><div class="news-img" style="background-image: url($IMG_URL1$);"></div></a><?else?><div class="news-img"></div><?endif?>  <a class="news-title" href="$ENTRY_URL$">$TITLE$</a>   <div class="news-details"> <span class="news-details-time"><i class="fa fa-clock-o"></i>&nbsp; $DATE$&nbsp;&nbsp;&nbsp;</span> <span class="news-details-cats"><i class="fa fa-book"></i> <a href=$CATEGORY_URL$>$CATEGORY_NAME$&nbsp;&nbsp;&nbsp;</a></span> <span class="news-details-reads"><i class="fa fa-eye"></i> : $READS$&nbsp;&nbsp;&nbsp;&nbsp;</span>  <span class="news-details-comm"><i class="fa fa-comments"></i> : <a href=$COMMENTS_URL$>$COMMENTS_NUM$</a></span>&nbsp;&nbsp;$MODER_PANEL_RIGHT$  </div>  <div class="news-mes">  $MESSAGE$  </div>  <a class="more" href="$ENTRY_URL$">Читать далее <span>&#8594;</span></a> </div>

Адрес сайта http://paranormal-news.ru
| Автор: | Категория: Новости сайта

Ответов: 1

голоса: 0
Добавил в ваш код правки, выделил красным, так попробуйте.
| Автор:

Спасибо, но такой код не работает.

Все искажает (см скриншот)

не надо картинок. сделайте правки для осмотра, может что-то не то сделали

Код ставлял в точности тот же какой скопировал выше

 <div class="news news5">  <?if($IMG_URL1$)?><a href="$ENTRY_URL$"><div class="news-img" style="background-image: url($IMG_URL1$);"></div></a><?else?><div class="news-img"></div><?endif?>  <a class="news-title" href="$ENTRY_URL$">$TITLE$</a>   <div class="news-details"> <span class="news-details-time"><i class="fa fa-clock-o"></i>&nbsp; $DATE$&nbsp;&nbsp;&nbsp;</span> <span class="news-details-cats"><i class="fa fa-book"></i> <a href=$CATEGORY_URL$>$CATEGORY_NAME$&nbsp;&nbsp;&nbsp;</a></span> <span class="news-details-reads"><i class="fa fa-eye"></i> : $READS$&nbsp;&nbsp;&nbsp;&nbsp;</span>  <span class="news-details-comm"><i class="fa fa-comments"></i> : <a href=$COMMENTS_URL$>$COMMENTS_NUM$</a></span>&nbsp;&nbsp;$MODER_PANEL_RIGHT$  </div>  <div class="news-mes">  $MESSAGE$  </div>  <a class="more" href="$ENTRY_URL$">Читать далее <span>&#8594;</span></a> </div>

 

 

Paranormal,
Внесите те правки которые я советовал, посмотрим проблему.
Я же только что выше вам написал. что ЭТО НЕ РАБОТАЕТ.  Код ссылки вообще никогда не работает, если внтури него дивы стоят. В этом и проблема.
Paranormal,

Тогда переделывайте вид материалов и делайте вывод фото не фоном к диву, а блоком внутри дива подобно так:

<?if($IMG_URL1$)?><div class="news-img"><a href="$ENTRY_URL$"><img src="$IMG_SMALL_URL1$" alt="$TITLE$" /></a></div><?else?>
<div class="news-img"><a href="$ENTRY_URL$"><img src="ссылка на фото когда у материала нет фото" alt="$TITLE$" /></a></div>
<?endif?>

Снова не получается. Ставлю вот этот код

 <?if($IMG_URL1$)?><div class="news-img"><a href="$ENTRY_URL$"><img src="$IMG_SMALL_URL1$" alt="$TITLE$" /></a></div><?else?><div class="news-img"><a href="$ENTRY_URL$"><img src="http://paranormal-news.ru/img/no_image.jpg" alt="$TITLE$" /></a></div> <?endif?>

В итоге  вот

Paranormal,

Все получается, просто размер фото зафиксируйте ширину и высоту. Сделайте как я говорил, и после в стили пропишите:

.news5 .news-img img {width: 270px; height: 170px;}

У меня же тогда адаптивность нарушится. Там код адаптивный, при уменьшении разрешения картинка на весь экран выводится.
Paranormal,
Внесите правки чтобы я увидел результат (проблему) иначе вам не помогут так как представлять проблему не видя ее и в результате помочь невозможно.
...