Главная » 2013 » Июнь » 9 » Дополнительная панель информации для форума (Скрипты для ucoz)
09.06.2013, 01:19

Дополнительная панель информации для форума




Этот дополнительный бар состоит из пяти кнопок: "Персональная страничка пользователя", "Отправка личного сообщения", "ICQ", "Skype" и "Веб-сайт юзера". При нажатии на три последние из иконок будет выползать дополнительное окно с соответствующей информацией. А если поле, опять же этих трех кнопок, не заполнена, то кнопка (иконка) будет неактивной. В общем устанавливайте и оценивайте.

Установка

1. Для начала вам нужно активировать поле Skype, если оно не активировано. Делается это очень просто, но если вы не знаете как, то прочитайте специальный материал по этой теме. Займет это у вас не больше минуты.

2. Заходим в ПУ -> Управление дизайном -> Таблицу стилей CSS и вставляем следующее:

Код
.bg_icons {background: #e8e8e8; height:27px;display:inline-block;text-align:center;border:1px solid #d1d1d1; -webkit-border-radius: 3px;-moz-border-radius: 3px;border-radius: 3px;padding:0px 4px; font-family:verdana,arial,helvetica;font-size:8pt; color:#C8C8C8;}
a.ico_1 {background:url(http://updatesite.ru/uds/1/1.png) no-repeat 0 0px;width:22px; height:23px;display:inline-block;*display:inline;margin-top:3px;}
a.ico_1:hover {background-position:0px -44px;}
a.ico_2 {background:url(http://updatesite.ru/uds/1/2.png) no-repeat 0 0px;width:22px; height:23px;display:inline-block;*display:inline;margin-top:3px;}
a.ico_2:hover {background-position:0px -44px;cursor:pointer;}
a.ico_3 {background:url(http://updatesite.ru/uds/1/3.png) no-repeat 0 0px;width:22px; height:23px;display:inline-block;*display:inline;margin-top:3px;}
a.ico_3:hover {background-position:0px -44px;cursor:pointer;}
a.ico_4 {background:url(http://updatesite.ru/uds/1/4.png) no-repeat 0 0px;width:22px; height:23px;display:inline-block;*display:inline;margin-top:3px;}
a.ico_4:hover {background-position:0px -44px;cursor:pointer;}  
a.ico_5 {background:url(http://updatesite.ru/uds/1/5.png) no-repeat 0 0px;width:22px; height:23px;display:inline-block;*display:inline;margin-top:3px;}
a.ico_5:hover {background-position:0px -44px;cursor:pointer;}  
a.ico_55 {background:url(http://updatesite.ru/uds/1/5.png) no-repeat 0 -22px;width:22px; height:23px;display:inline-block;*display:inline; margin-top:3px; cursor:default}
a.ico_44 {background:url(http://updatesite.ru/uds/1/4.png) no-repeat 0 -22px;width:22px; height:23px;display:inline-block;*display:inline;margin-top:3px; cursor:default}
a.ico_33 {background:url(http://updatesite.ru/uds/1/3.png) no-repeat 0 -22px;width:22px; height:23px;display:inline-block;*display:inline;margin-top:3px; cursor:default}
a.ico_22 {background:url(http://updatesite.ru/uds/1/2.png) no-repeat 0 -22px;width:22px; height:23px;display:inline-block;*display:inline;margin-top:3px; cursor:default}
.in_piu {background:#cccccc;border:1px solid #ababab;-webkit-border-radius: 5px;-moz-border-radius: 5px;border-radius: 5px; padding:5px; color:#202223; width:188px;}
.oa {padding:2px 0px 5px 5px;}


3. Далее переходим в Форум-> Вид материалов и вставляем следующий код туда, где хотим видеть эту панельку (либо после аватара, либо после строк о количестве сообщений, репутации и т.д.) :

Код
<style type="text/css">
.icq$ID$ {display:none;position:absolute;width:200px;margin-left:76px;margin-top:3px;background:#dddddd;border:4px solid rgba(0,0,0,0.10); text-align:left; -webkit-border-radius: 5px; -moz-border-radius: 5px; border-radius: 5px; text-shadow:0px 1px 0px #eee;z-index:999;padding:5px;color:#202223;}
.icq$ID$:after, icq$ID$:before {bottom:100%;border:solid transparent;content:'';position:absolute;}
.icq$ID$:after {border-bottom-color:#dddddd;border-width:8px;left:10%;margin-left:-8px;}  
.skype$ID$ {display:none;position:absolute;width:200px;margin-left:100px;margin-top:3px;background:#dddddd;border:4px solid rgba(0,0,0,0.10); text-align:left; -webkit-border-radius: 5px; -moz-border-radius: 5px; border-radius: 5px;text-shadow:0px 1px 0px #eee;z-index:999;padding:5px;color:#202223;}
.skype$ID$:after, skype$ID$:before {bottom:100%;border:solid transparent;content:'';position:absolute;}
.skype$ID$:after {border-bottom-color:#dddddd;border-width:8px;left:10%;margin-left:-8px;}
.home$ID$ {display:none;position:absolute;width:200px;margin-left:126px;margin-top:3px;background:#dddddd;border:4px solid rgba(0,0,0,0.10); text-align:left;-webkit-border-radius: 5px; -moz-border-radius: 5px; border-radius: 5px;text-shadow:0px 1px 0px #eee;z-index:999;padding:5px;color:#202223;}
.home$ID$:after, home$ID$:before {bottom:100%;border:solid transparent;content:'';position:absolute;}
.home$ID$:after {border-bottom-color:#dddddd;border-width:8px;left:10%;margin-left:-8px;}
</style>
<div align="center" class="bg_icons">
<a href="$PROFILE_URL$" target="_blank" class="ico_1"></a>
<?if($PM_URL$)?><a href="$PM_URL$" class="ico_2"></a><?else?><a onclick="" class="ico_22"></a><?endif?>  
<?if($ICQ$)?><a onclick="$('.icq$ID$').slideToggle(100);" class="ico_3"></a>
<?else?><a onclick="" class="ico_33"></a><?endif?>  
<?if($MSN$)?><a onclick="$('.skype$ID$').slideToggle(100);" class="ico_4"></a></a>
<?else?><a onclick="" class="ico_44"></a><?endif?>  
<?if($HOME_PAGE$)?><a onclick="$('.home$ID$').slideToggle(100);" class="ico_5"></a></a>
<?else?><a onclick="" class="ico_55"></a><?endif?>  
</div>

<div class="icq$ID$">
<div class="oa"><b>ICQ</b> пользователя:</div>
<input class="in_piu" value="$ICQ$">
</div>
<div class="skype$ID$">
<div class="oa"><b>Skype</b> пользователя:</div>
<input class="in_piu" value="$MSN$">
</div>
<div class="home$ID$">
<div class="oa"><b>Сайт</b> пользователя:</div>
<input class="in_piu" value="$HOME_PAGE$">
</div>


Дополнительно. Ищем там же $USER_DETAILS_ICON_BAR$ и удаляем, так как все иконки, которые там находятся, есть в нашем баре.
Материал взят с сайта infoscript.ru
Внимание! Копирование данного материала запрещено без указания ссылки на сайт Infoscript.ru
Источник/Автор: http://updatesite.ru/
Категория: Скрипты uCoz | Просмотров: 1053 | Добавил: sold93 | Рейтинг: 4.0/1 |
Теги: панель, дополнительная, форума, информации, для
Пока комментариев нет. Ты можешь быть первым!
Добавлять комментарии могут только зарегистрированные пользователи.
[ Регистрация | Вход ]