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

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

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

Категория Информеры, Бесплатно
Авторwaak
Просмотры1231
Комментарии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;
}

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

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

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

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

Меню

Полезно

Комментарии

pa patali2k

Спасибо большое!

06-06-2025 в 05:58 материал

waak

на все страницы вывести можно скриптом через запрос на персональную страницу пользователя а на странице со списком закладок я вывел так

Код

У вас $NUM_ENTRIES$ заклад<?if($NUM_ENTRIES$%10=0||$NUM_ENTRIES$%10>4||$NUM_ENTRIES$%100>10&&$NUM_ENTRIES$%100<15)?>ок<?else?><?if($NUM_ENTRIES$%10=1)?>ка<?else?>ки<?endif?><?endif?>

05-06-2025 в 22:07 материал

pa patali2k

Добрый день! Waak подскажи как вы сделали У вас N закладок, у меня выходит 1-5 например, так если можете подскажите как вывести кол.во закладок пользователя например в мини профиль, чтоб кол.во закладок показывало на любой странице

04-06-2025 в 16:51 материал

pa patali2k

Добрый день!
Сегодня снова попробовал установить скрипт и он снова не заработал, все перерыл, изменял, убирал и никак не заводился.
Решение: В общих настройках сайта нужно переключить Версия библиотеки jQuery: на jquery-1.12.4.min.js
В общем теперь просьба, не могли бы переписать скрипт закладок под jquery-3.6.0.min.js