Новое на форуме
Pets do not have fears / Питомцы больше не боятся вещей
Mafia 3 60 FPS Unlock
SafeCracker v1.1 / Взлом сейфа в GTA 5
Категории раздела
Вёрстка шаблонов [2]
Шаблоны [3]
Скрипты [4]
Партнёры сайта
SILADesign - Студия дизайна и графики
Студия разработки веб-дизайна и графики по низким ценам в кратчайшие сроки.
ZorNet: Создание сайта на uCoz
На сайте найдете интересные решения по созданию сайтов
Nk-CS.Ru - Все для вашего портала uCoz
Огромный выбор файлов и статей о бесплатном хостинге ucoz.
PLAYJOY.Club - Играть в радость
Проект игровых серверов Counter-Strike.
Предложить партнёрство
Все для твоей игры! MIR-DEVIL.RU - Все для Web дизайна Hi-Vault.ru - Привет убежище - моды, аддоны, руководства! Читерский портал для геймера В тылу врага - моды, аддоны и другое! Мир игровых новостей! IPSGuru.Ru
Статистика сайта

Рейтинг@Mail.ru
Всего
Юзеров
Гостей
Онлайн всего: 7
Гостей: 7
Пользователей: 0

Сегодня авторизовались

DESTEQ, Harvus, Raccoon, VIP, wegogjti
Горизонтальный топ пользователей по репутации для uCoz

Горизонтальный топ пользователей по репутации для uCoz


Информер горизонтальный топ пользователей который показывает юзеров по репутации, от того у кого больше всех репутации на сайте, до того у кого меньше. Топ пользователей по репутации.

Топ пользователей по репутации как на RootGames.Ru на данный момент, пример можете увидеть в персональной странице пользователя в самом низу на нашем сайте.
Подойдет как для светлых, так и для тёмных дизайнов, если слегка изменить стили.
При наведении на аватарку пользователя она прокручивается.
Красиво будет смотреться в персональной странице пользователя или на форуме.

Сам по себе информер расположен горизонтально и по размерам он достаточно большой, но это можно легко исправить с помощью CSS.

Установка:
Создаём информер - [ Пользователи · Материалы · Репутация · Материалы: 8 · Колонки: 8 ]

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

В сам шаблон информера вставляем следующий код:
Код
<div class="rg-top-user"> <a href="$PROFILE_URL$" title="Профиль пользователя"> <div class="rg-top-user-ava"><img src="<?if($AVATAR_URL$)?>$AVATAR_URL$<?else?>/designs_4/no-avatar-2017.png<?endif?>"><span title="репутация пользователя">$REPUTATION$</span></div> </a> <a href="$PROFILE_URL$" class="rg-top-user-name"><b>$USERNAME$</b></a> <span>$GROUP_NAME$</span> </div>


Добавляем стили в таблицу стилей CSS:
Код
.rg-top-user { margin: 5px 0; text-align: center; } .rg-top-user span { font-size: 12px; display: block; margin: 5px 0 0 0; } .rg-top-user-ava { border-radius: 50%; width: 80px; height: 80px; position: relative; margin: 0 auto; margin-bottom: 15px; } .rg-top-user-ava span { position: absolute; background: #fffdfd; border-radius: 100%; border: 1px solid #e4e4e4; padding: 10px; color: #222122; width: 16px; height: 16px; font-size: 14px; top: -5px;  right: -10px; font-weight: bold; } .rg-top-user-ava img { border: 1px solid #e4e4e4; padding: 2px; opacity: .7; transition: .8s; border-radius: 50%; width: 80px; height: 80px; } .rg-top-user-ava img:hover { opacity: 1; -moz-transform: rotate(360deg); -ms-transform: rotate(360deg); -webkit-transform: rotate(360deg); -o-transform: rotate(360deg); transform: rotate(360deg); border-color: #f96c04; } .rg-top-user-name { background: #f1f1f1; padding: 3px 7px; border-radius: 3px; transition: .2s; margin: 0 0 0 5px; text-decoration: none !important; } .rg-top-user-name:hover { background: #f96c04; color: #fff !important; }


И вставляем код информера $MYINF_#$ в нужное вам место.
Готово.

Источник: rootgames.ru


Всего комментариев: 0
Имя *:
Email *:
Код *: