Вид комментариев для uCoz
827материалов
228тем на форуме
3004комментария
6160пользователей

Вид комментариев для uCoz


Описание:

Красивый, с выделением вид материалов, для модуля "Комментария" на сайт uCoz. Данный вид подойдет как под светлый, так и под темный дизайн сайта. В виде аватар пользователя закруглен, а текст комментариев находятся на сером фоне. При написание комментария вами он находится с левой стороны, а при ответе он располагается с правой стороны. Вид очень прост в установке и не требует скачивания.

Установка:

1. Заходим в ПУ - Управление дизайном - Таблица стилей (CSS) и ставим в самый низ данный код:
Код
/* Вид материалов для модуля комментария на сайт uCoz */    
.com_wp {border-radius:50%;background:#fff;width:65px;height:65px}    
    .ob_wp { width:73px;height:73px;background: #20242b;border-radius:50%; }    
       
    .ob_wp1 { width:81px;height:81px;background:rgba(255,255,255,0.3);;border-radius:50%; }    
       
    .mess_wp{box-shadow: 0 1px 1px rgba(0, 0, 0, 0.5);border-radius:4;background: #efefef;    
    background: -moz-linear-gradient(top, #efefef 0%, #dbdbdb 100%);    
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#efefef), color-stop(100%,#dbdbdb));    
    background: -webkit-linear-gradient(top, #efefef 0%,#dbdbdb 100%);    
    background: -o-linear-gradient(top, #efefef 0%,#dbdbdb 100%);    
    background: -ms-linear-gradient(top, #efefef 0%,#dbdbdb 100%);    
    background: linear-gradient(to bottom, #efefef 0%,#dbdbdb 100%);    
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#efefef', endColorstr='#dbdbdb',GradientType=0 );    
    }    
    .tim_wp{background:d7d7d7;border-radius:4px;}    
    #triangle-left {    
    width: 0;    
    height: 0;    
    border-top: 7px solid transparent;    
    border-right: 9px solid #e1e1e1;    
    border-bottom: 7px solid transparent;    
    }#triangle-left1 {    
    width: 0;    
    height: 0;    
    border-top: 7px solid transparent;    
    border-left: 9px solid #e1e1e1;    
    border-bottom: 7px solid transparent;    
    }    
/*--------------------------*/

2. Заходим в ПУ - Управление дизайном - Вид комментариев и полностью заменяем имеющий код на этот:
Код
<?if($CLASS$)=='cBlock1'?>    
    <div style="padding-bottom:9px;">    
    <table cellspacing="0" width=100%><tr><td width=96 valign=top>    
    <div class="ob_wp1"><div style="padding-top:4px;padding-left:4px">    
    <div class="ob_wp">    
    <div style="padding-top:4px;padding-left:4px"> <?if($USER_AVATAR_URL$)?><a href="$PROFILE_URL$" title="$USERNAME$"><img src="$USER_AVATAR_URL$" width=65 height=65 class="com_wp"></a><?else?><a href="$PROFILE_URL$" title="$USERNAME$"><div class="com_wp"></div></a><?endif?>    
    </div> </div> </div></div>    
       
       
    <div style="margin-left:-15px"> <center>    
    <?if($MODER_PANEL$)?>    
    $MODER_PANEL$    
    <?endif?>    
    </center></div>    
    </td><td valign=top>    
       
    <div style="position: absolute;margin-left:-9px;margin-top:14px;"><div id="triangle-left"></div></div>    
    <div class="mess_wp">    
    <div style="padding:6px">    
    <table><tr>    
    <td valign=top><div class="tim_wp"><div style="font-family:Tahoma;color:#797979;padding-left:7px;padding-right:7px;padding-top:4px;padding-bottom:7px">$TIME$</div></div></td>    
    <td><div style="font-family:Tahoma;color:#595959;padding-left:7px;"><b>$MESSAGE$</b></div></td>    
    </tr></table>    
    </div>    
       
    </div>    
    </div>    
    </td></tr></table>    

    <?else?>    
    <div style="padding-bottom:9px;">    
    <table cellspacing="0" width=100%><tr><td valign=top>    
    <div class="mess_wp">    
    <div style="padding:6px">    
    <table><tr>    
    <td valign=top>    
    <div class="tim_wp"><div style="font-family:Tahoma;color:#797979;padding-left:7px;padding-right:7px;padding-top:4px;padding-bottom:7px">$TIME$</div></div></td>    
    <td><div style="font-family:Tahoma;color:#595959;padding-left:7px;"><b>$MESSAGE$</b></div></td>    
    </tr></table>    
    </div>    
       
    </div>    
    </div>    
    </td><td width=96>    
    <div style="position: absolute;margin-left:-2px;margin-top:14px;"><div id="triangle-left1"></div></div>    
    <div style="float:right">    
    <div class="ob_wp1"><div style="padding-top:4px;padding-left:4px">    
    <div class="ob_wp">    
    <div style="padding-top:4px;padding-left:4px"> <?if($USER_AVATAR_URL$)?><a href="$PROFILE_URL$" title="$USERNAME$"><img src="$USER_AVATAR_URL$" width=65 height=65 class="com_wp"></a><?else?><a href="$PROFILE_URL$" title="$USERNAME$"><div class="com_wp"></div></a><?endif?>    
    </div> </div> </div></div></div>    
    <div style="margin-right:-24px"> <center>    
    <?if($MODER_PANEL$)?>    
    $MODER_PANEL$    
    <?endif?>    
    </center></div>    
    </td></tr></table>    
    <?endif?>

ЗАКАЗАТЬ УСТАНОВКУ

Скрипт опубликовал:
...
Логин на сайте: ...
Группа: ...
Статус: ...
Информация о скрипте:
Дата добавления материала: 23.07.2015 в 15:00
Материал просмотрен: 856 раз
Категория материала: Скрипты для uCoz
К материалу оставлено: 5 комментариев

Пожаловаться
Сказать спасибо
Источник

5 комментариев


trem200
Александр @trem200 23.07.2015 20:361
+1
Вид комментариев отличный. Побольше бы таких файлов.
Romchik
Роман @Romchik 23.07.2015 20:382
0
Мне тоже нравится! А другие чем плохи?
trem200
Александр @trem200 24.07.2015 00:583
+1
Ну не знаю даже, что сказать. Скрипт очень сильно понравился.
Oksana
Оксана @Oksana 24.07.2015 01:294
+1
Красиво выглядит. Спасибо!
avatar
Олег Хан @Oleg7777 17.01.2016 18:035
0
1. А как посмотреть демку?
2. Если юзер цитирует часть коммента другого юзера тот как это форматируется в этих комментах?
3. Не видел демку, потому непонятно как будет выглядеть подпись юзера под картиной юзера, на скиншоте вообще подписей под юзером нет и какой никнейм юзра непонятно и будет ли оно отображаться тоже в этом скрипте тоже не ясно.

Ну а вообще неплохо, сильно разнообразит форум с однотипными сообщениями.
avatar
Вход через социальные сети
Работа в компании uCoz
uSocial - социальные кнопки
uLike – кнопка «Мне нравится»
Статистики нашего сайта