Главная / Каталог скриптов для uCoz / Информеры, Бесплатно

Информер топ 5 пользователей

Добавлено 12-12-2017 в 02:21

Категория Информеры, Бесплатно
Авторwaak
Просмотры1092
Комментарии8
Понравилось8

Здравствуйте! сегодня решил сделать ещё один вид материалов для информера.
Посидев по думав какой же ему вид придать как оформить и в голову пришла идея поиграть с цветом и на мой взгляд вышло не плохо!

Описание

Информер выводит 5 пользователей сортируя их по репутации,
У каждого пользователя свой цвет в информере,
Вывод аватара пользователя,
Вывод ника пользователя,
Вывод группы пользователя в которой он находится.

Я не стал выводить рейтинг пользователей так как посчитал что это не обязательно но если будет время может добавлю версию с рейтингом.

Вид информера

Демо работы смотрим тут

Установка

Для начало нам нужно создать сам информер для этого просто перейдём в Панель управления затем Информеры и нажмём кнопку создать информер

Параметры информера
Пользователи · Материалы · Репутация · Материалы: 5 · Колонки: 1
и кнопочку создать!

В шаблон информера поместить код

Код

<?if($NUMBER$="1")?>
<a href="$PROFILE_URL$" title="Перейти в профиль $USERNAME$">
  <div class="talantlev_top">
<div class="talantlev_top_ava_bs"><div class="talantlev_top_ava_bs_img"><?if($AVATAR_URL$)?><img src="$AVATAR_URL$"><?else?>
<img src="http://talantlev.ucoz.ru/img/talantlev.png"><?endif?></div></div>
  <div class="talantlev_top_user">
  <b>$USERNAME$</b>
  <span>$GROUP_NAME$</span>
  </div>
</div>
</a>
<?endif?>

<?if($NUMBER$="2")?>
<a href="$PROFILE_URL$" title="Перейти в профиль $USERNAME$">
  <div class="talantlev_top2">
<div class="talantlev_top_ava_bs2"><div class="talantlev_top_ava_bs_img2"><?if($AVATAR_URL$)?><img src="$AVATAR_URL$"><?else?>
<img src="http://talantlev.ucoz.ru/img/talantlev.png"><?endif?></div></div>
  <div class="talantlev_top_user2">
  <b>$USERNAME$</b>
  <span>$GROUP_NAME$</span>
  </div>
</div>
</a>
<?endif?>

<?if($NUMBER$="3")?>
<a href="$PROFILE_URL$" title="Перейти в профиль $USERNAME$">
  <div class="talantlev_top userF">
<div class="talantlev_top_ava_bs"><div class="talantlev_top_ava_bs_img"><?if($AVATAR_URL$)?><img src="$AVATAR_URL$"><?else?>
<img src="http://talantlev.ucoz.ru/img/talantlev.png"><?endif?></div></div>
  <div class="talantlev_top_user">
  <b>$USERNAME$</b>
  <span>$GROUP_NAME$</span>
  </div>
</div>
</a>

<?endif?>

<?if($NUMBER$="4")?>
<a href="$PROFILE_URL$" title="Перейти в профиль $USERNAME$">
  <div class="talantlev_top2 userFs">
<div class="talantlev_top_ava_bs2"><div class="talantlev_top_ava_bs_img2"><?if($AVATAR_URL$)?><img src="$AVATAR_URL$"><?else?>
<img src="http://talantlev.ucoz.ru/img/talantlev.png"><?endif?></div></div>
  <div class="talantlev_top_user2">
  <b>$USERNAME$</b>
  <span>$GROUP_NAME$</span>
  </div>
</div>
</a>
<?endif?>
<?if($NUMBER$="5")?>
<a href="$PROFILE_URL$" title="Перейти в профиль $USERNAME$">
  <div class="talantlev_top userFsu">
<div class="talantlev_top_ava_bs"><div class="talantlev_top_ava_bs_img"><?if($AVATAR_URL$)?><img src="$AVATAR_URL$"><?else?>
<img src="http://talantlev.ucoz.ru/img/talantlev.png"><?endif?>
</div></div>
  <div class="talantlev_top_user">
  <b>$USERNAME$</b>
  <span>$GROUP_NAME$</span>
  </div>
</div>
</a>
<?endif?>

На страницу где будет выводится информер вставьте код

Код

<div class="talantlev_top_user_bs">
  <div class="talantlev_top_user_bs_name">
  <b>TOP-5</b>
  <span>ЛИДЕРЫ САЙТА</span>
  </div>
</div>
  $MYINF_Номер вашего информера$

Внимание в коде выше нужно заменить текст в данной строчке $MYINF_Номер вашего информера$ на номер вашего информера

Ну и в конце добавим стили к нашему информеру
Панель управление > Таблица стилей в самый конец

Код

.talantlev_top_user_bs {
  background: #5D5252;
  padding: 30px 10px;
  color: #FFF;
}
.talantlev_top_user_bs b {
  display: block;
  text-align: center;
  font-size: 22px;
}
.talantlev_top_user_bs span {
  display: block;
  text-align: center;
  font-size: 14px;
  font-weight: 100;
  color: rgba(255,255,255,.7);
}

.talantlev_top {
  background: #5392CF;
  padding: 30px 10px;
  color: #FFF;
  position: relative;
  overflow: hidden;
}
.talantlev_top_user b {
  display: block;
  font-size: 18px;
}
.talantlev_top_user span {
  display: block;
  font-size: 14px;
  font-weight: 100;
  color: rgba(255,255,255,.7);
}

.talantlev_top_ava_bs {
  position: absolute;
  right: -35px;
  top: 50%;
  margin-top: -75px;
  width: 150px;
  height: 150px;
  overflow: hidden;
  border-radius: 50%;
  background: #FFF;
}

.talantlev_top_ava_bs_img {
  width: 80px;
  height: 80px;
  overflow: hidden;
  border-radius: 50%;
  margin: 35px;
  border: 5px solid #5392CF;
}
.talantlev_top_ava_bs_img img {
  object-fit: cover;
  width: 80px;
  height: 80px;
}

.talantlev_top2 {
  background: #5C944D;
  padding: 30px 10px;
  color: #FFF;
  position: relative;
  overflow: hidden;
}
.talantlev_top_user2 b {
  display: block;
  font-size: 18px;
  text-align: right;
}
.talantlev_top_user2 span {
  display: block;
  font-size: 14px;
  font-weight: 100;
  color: rgba(255,255,255,.7);
  text-align: right;
}

.talantlev_top_ava_bs2 {
  position: absolute;
  left: -35px;
  top: 50%;
  margin-top: -75px;
  width: 150px;
  height: 150px;
  overflow: hidden;
  border-radius: 50%;
  background: #FFF;
}

.talantlev_top_ava_bs_img2 {
  width: 80px;
  height: 80px;
  overflow: hidden;
  border-radius: 50%;
  margin: 35px;
  border: 5px solid #5C944D;
}
.talantlev_top_ava_bs_img2 img {
  object-fit: cover;
  width: 80px;
  height: 80px;
}

.userF {
  background: #D5A326;
}

.userF .talantlev_top_ava_bs_img {
  border: 5px solid #D5A326;
}

.userFs {
  background: #5C5C5C;
}

.userFs .talantlev_top_ava_bs_img2 {
  border: 5px solid #5C5C5C;
}

.userFsu {
  background: #A97DC1;
}
.userFsu .talantlev_top_ava_bs_img {
  border: 5px solid #A97DC1;
}

Оставить комментарий

Добавлять комментарии могут только зарегистрированные пользователи.

Регистрация Вход

Создать сайт
Бесплатно

Меню

Полезно

Комментарии

waak

К сожалению, у меня нет сайта, на котором был бы активен данный модуль, чтобы посмотреть, работает он там или нет.

04-03-2024 в 08:01 материал

Fr Frag

Для модуля новости не работает

03-03-2024 в 05:55 материал

web_master

при добавлении комментарии выдает ошибку в консоли:

POST http:сайт/index/ 404 (Not Found)

29-02-2024 в 16:58 материал

web_master

UPD: так будет работать , + в конце будут показывать и проценты...

Код

<?($OTHER2$-$OTHER1$)/$OTHER2$*100 ?>

А так будет без процентов:

Код

<?int(($OTHER2$-$OTHER1$)/$OTHER2$*100)?>

25-02-2024 в 23:06 материал

web_master

Скрипт не работает почему-то

25-02-2024 в 22:09 материал

waak

Не за что! Я бы делал больше но просьб мало а самому сидеть придумывать не всегда есть время по этому и обновления идут редко

07-02-2024 в 18:26 материал

ed edik2009

Спасибо.Поставил все работает. К сожалению эпоха сайтостроения Юкоз прошла. Ваш сайт один из немногих который, хоть что то обновляет материалы для в этой системы (Скрипты, Шаблоны, Графика и т.д)

07-02-2024 в 08:08 материал

waak

Здравствуйте! вы наверное не совсем понимаете смысл данного раздела, Что бы я мог выполнить вашу просьбу я должен понимать что именно вам нужно а в вашей просьбе нет конкретики и по этому выполнить её не получится

27-01-2024 в 15:12 материал

di dinyslamsinger

От души