» »

Информер по просмотру файлов на сайте

Информер по просмотру файлов на сайте

Вы можете вывести в красивом по дизайн информер самый просматривающий материал на главную страницу в контейнере вашего сайта. Он простой и будет учитывать только просмотры, где больше всего было, то тот материал на первой странице. Но на главной также будет само изображение, на нем будет прописана категория, где находится и в какой. Но и безусловно само название, оно будет уже под картинкой, как по клику картинки самой или названию, вы прямо переходите на выбравший вами статью или файл. Здесь нужно заметить, если у вас несколько модулей подключено, кроме форума, будут все учитываться.

Примерно так на интернет ресурсе будет визуально смотреться.



Переходим к установке:

Создаем в панели администратор информер с параметрами.

[ Комментарии · Материалы · Дата добавления материала D · Материалы: 3 · Колонки: 1 ]

Код
<div class="com-film">
<li>
<a href="$PROFILE_URL$"><?if($USER_AVATAR_URL$)?><div class="com-film-img"><img src="$USER_AVATAR_URL$" border="0"></div><?else?><div class="com-film-img"><img src="http://zornet.ru/Ajaxoskrip/Forma_skriptov/zZdU4oy.jpg" alt="avatar" /></div><?endif?></a>  
<a href="$PROFILE_URL$">$USERNAME$</a>  
<div class="com-film-detali">$DATE$ в $TIME$</div>
<p><i class="fa fa-pencil" aria-hidden="true"></i> $MESSAGE$</p>  
<div class="com-film-l"><a href="$ENTRY_URL$">Читать</a></div>
</li>
</div>


CSS:

Код
.publ_vid_populyar {margin-bottom: 10px; display: inline-block; background-color: #fff;text-align: center;}  
  .publ_vid_img_populyar {}  
  .publ_vid_img_populyar img {width: 100%;height: 220px; object-fit: cover;}
  .publ_vid_title_populyar {padding: 3px 3px 5px 5px;}
  .publ_vid_title_populyar a {font-family: "PT Sans"; color: #555555; font-size: 14px; padding: 0; text-transform: uppercase; line-height: 1.5; word-spacing: 2px;}
  .publ_vid_title_populyar a:hover {color: #C47575;}
  .publ_vid_cat_populyar {background: #75BCC4; color: #fff; display: block; font-size: 13px; height: 28px; line-height: 28px; margin: -33px 0 0 0px; padding: 0 15px; position: absolute; width: auto; font-family: monospace;}
  .publ_vid_cat_populyar a {color: #fff;font-family: monospace;}
  .publ_vid_cat_populyar a:hover {text-decoration: underline;}


PS - по форме он будет вертикальный, где вы можете намроить размер изображение, чтоб больше выставить.

Источник: uCoNet.Ru
18.12.2016 Просмотров: 726 Комментарий: (8)

Поделиться в социальных сетях

Материал разместил

Комментарий: 8
FeStemBer
FeStemBer 18.12.2016 22:521
0
Что то встречал похожее, но здесь категория только добавлена. Вижу что углы закругленные, но в стилях не могу найти стиль, который за это отвечает.
Kosten
Kosten 18.12.2016 23:273
0
Чтоб закруглить, просто в стилях нужно прописать border-radius: 5px; и здесь вы сами можете выставлять. Если судить по изображению, то там на 3 пикселя сделано.
Kolinkor
Kolinkor 18.12.2016 23:252
0
Для кино сайта или блога такой информер подойдет.
Tergran
Tergran 19.12.2016 01:004
0
Но меньше его по ширине не как не сделать, разве что уже только. Но по этому поводу есть много форматов для этого.
Kosten
Kosten 19.12.2016 01:215
0
Вообще то он сейчас на блоге стоит, и отлично вписывается в дизайн.
avatar
monarch 23.02.2017 22:036
0

Это ваще не то что написано - Информер по просмотру файлов на сайте
Это вывод коментов.
Сопрано
Сопрано 24.02.2017 00:348
0
Стили подключи и все нормально будет.
avatar
monarch 23.02.2017 22:067
0
аватарку менять под картинку надо , лень
Когда готовый код - поставил и не ковыряться
52a
avatar