Время:
Новых сообщений: Нет
Вы на форуме дней
Ваша группа: Гость
Ваш IP: 3.139.83.210
Logical-Portal — молодежный портал со своей изюминкой, каждый сможет найти что-то интересное и полезное для себя, например наш форум общения с которым вам обязательно нужно ознакомиться.
  • Страница 1 из 1
  • 1
Форум общения - Logical-portal » Урна » Собрание скриптов uCoz » Красивый Вид комментариев для uCoz (3 штук)
Красивый Вид комментариев для uCoz (3 штук)
Сообщение оставлено 19.01.2012 в 01:50:15 | Сообщение #1
5 видов комментариев,сверстал Rulez-dn22

И так приступим к установке.
Установим первоначальный нужный html код по этому пути: Панель управления > Дизайн > Управление дизайном Ю Комментарии > Вид комментариев (удаляем старый код и устанавливаем новый):

Code
<div class="$CLASS$">     
    <div class="vid_comments_os">     
    <div class="vc_top">     
    <div class="vc_name"><strong>$USERNAME$ $NAME$</strong><a href="$EMAIL_JS$" title="Email"> ( E-mail )</a><span> | $DATE$ | $TIME$</span></div>     
    <div class="vc_nomer"><a href="#ent$ID$" onclick="if (document.getElementById('comEnt$ID$')){$('body').scrollTo( { top:$('#comEnt$ID$').offset().top-22, left:0}, 500 );return false;}" name="ent$ID$">$NUMBER$</a> </div>     
    <div class="vc_reiting">     
        
    <a href="$GOOD_COMMENT_URL$"><img src="http://www.center-dm.ru/ucoz/vid_coment/plus_01.gif" alt="+" title="Хороший пост"/></a>     
    <span class="post_r">($COMMENT_RATING$)</span>     
    <a href="$BAD_COMMENT_URL$"><img src="http://www.center-dm.ru/ucoz/vid_coment/minuc_01.gif" alt="-" title="Плохой пост"/></a>     
        
    <img src="http://www.center-dm.ru/ucoz/vid_coment/plus_02.png" alt="+" title="Хороший пост"/>     
    <span class="post_r">($COMMENT_RATING$)</span>     
    <img src="http://www.center-dm.ru/ucoz/vid_coment/minuc_02.png" alt="-" title="Плохой пост"/>     
        
        
    <img src="http://www.center-dm.ru/ucoz/vid_coment/plus_02.png" alt="+" title="Хороший пост"/>     
    <span class="red">($COMMENT_RATING$)</span>     
    <img src="http://www.center-dm.ru/ucoz/vid_coment/minuc_02.png" alt="-" title="Плохой пост"/>     
        
        
        
    </div>     
</div>     
<div class="vc_center"><a href="$PROFILE_URL$" title="$USERNAME$"><img class="coment_avatar" alt="" src="$USER_AVATAR_URL$" /></a><a href="$PROFILE_URL$" title="$USERNAME$"><img class="coment_avatar" alt="" src="http://www.center-dm.ru/site/no_avatar.jpg" /></a><img class="coment_avatar" alt="" src="http://www.center-dm.ru/site/no_avatar.jpg" />$MESSAGE$</div>     
<div class="vcc_otvet"><strong>Ответ</strong>: $ANSWER$</div>     
<div class="vc_bottom"><a href="$ANSWER_URL$">Ответить</a> $MODER_PANEL$</div>     
    </div>     
</div>


Теперь нам нужно выбрать один из пяти дизайнов, Но код уже вставляем ПУ>Дизайн>CSS и в конце кода CSS вставляем нужный нам код(под картинкой):

№1 Белый вид комментариев



Code
/* Comments Style */     
.cBlock1,     
.cBlock2 {     
    float:left;     
    overflow: hidden;     
    width:100%;     
    margin-bottom: 15px;     
    outline: 1px solid #d7d7d7;     
    border: 1px solid #fff;     
}     

.cBlock1 {background: #f6f6f6;}     
.cBlock2 {background: #e5e5e5;}     

.vid_comments_os {     
    float:left;     
    width:95%;     
    padding: 5px 15px 5px 16px;     
}     

.vid_comments_os a:link,     
.vid_comments_os a:visited {color:#2e6fac;}     
.vid_comments_os a:hover {color:#31ac2e;}     
img {border: none; }     
a {outline: none; text-decoration:none!important; }     

.vc_top {     
    float:left;     
    width:100%;     
    padding: 0px 0px 5px 0px;     
}     

.vc_name {     
    font: 10px Verdana,Arial,Helvetica, sans-serif;     
    text-shadow: 1px 1px 1px #fff;     
    float:left;     
    padding: 3px 0px 0px 0px;     
}     
        
.vc_name strong {color:#4EA62C;}     
.vc_name span {color:#999;}     

.vc_reiting {     
    font: 11px Verdana,Arial,Helvetica, sans-serif;     
    float:right;     
}     

.vc_reiting img {float:left; padding-top: 6px;}     
.vc_reiting span {float:left; padding: 2px 5px 0px 5px; font-weight: bold;}     

.vc_nomer {     
    font: 11px Verdana,Arial,Helvetica, sans-serif;     
    float:right;     
    font-size:19px;     
    margin-left: 15px;     
}     

.vc_nomer a:link,     
.vc_nomer a:visited {color:#C7C7C7;}     
.vc_nomer a:hover {color:#2C68A6;}     

.vc_center {     
    float:left;     
    text-align:justify;     
    font: 115%/1.5 Verdana,Arial,Helvetica, sans-serif;     
    color:#555;     
    width:100%;     
}     

.coment_avatar{     
    float:right;     
    width:50px;     
    height:50px;     
    padding:3px;     
    margin: 0px 0px 10px 15px;     
    border: 1px solid #fff;     
}     

.vc_center {     
    color:#555;     
    width:100%;     
}     

.vcc_otvet {     
    color:#555;     
    padding: 5px 5px 5px 5px;     
    background: #fff;     
    border: 1px solid #d7d7d7;     
    width:98%;     
    margin: 10px 0px 10px 0px;     
}     

.vc_center,     
.vcc_otvet {     
    float:left;     
    overflow: hidden;     
    text-align:justify;     
    font: 115%/1.5 Verdana,Arial,Helvetica, sans-serif;     
}     

.vc_bottom {     
    clear:left;     
    text-align:right;     
    padding: 0px 0px 0px 0px;     
}     

.post_r {color: #888;}     
.red {color: #a71a1a;}     
.gren {color: #1da71a;}     
.grey {color: #999;}


№2 Черный вид комментариев



Code
/* Comments Style */     
.cBlock1,     
.cBlock2 {     
    float:left;     
    overflow: hidden;     
    width:100%;     
    margin-bottom: 15px;     
}     

.cBlock1 {background: #555;}     
.cBlock2 {background: #333;}     

.coment_avatar,     
.cBlock1,     
.cBlock2 {     
    outline: 1px solid #2c2c2c;     
    border: 1px solid #838383;     
}     

.vid_comments_os {     
    float:left;     
    width:95%;     
    padding: 5px 15px 5px 16px;     
}     

.vid_comments_os a:link,     
.vid_comments_os a:visited {color:#9cbdd3;}     
.vid_comments_os a:hover {color:#87dd85;}     
img {border: none; }     
a {outline: none; text-decoration:none!important; }     

.vc_top {     
    float:left;     
    width:100%;     
    padding: 0px 0px 5px 0px;     
}     

.vc_name {     
    font: 10px Verdana,Arial,Helvetica, sans-serif;     
    text-shadow: 1px 1px 1px #111;     
    float:left;     
    padding: 3px 0px 0px 0px;     
}     
        
.vc_name strong {color:#4EA62C;}     
.vc_name span {color:#999;}     

.vc_reiting {     
    font: 11px Verdana,Arial,Helvetica, sans-serif;     
    float:right;     
}     

.vc_reiting img {float:left; padding-top: 6px;}     
.vc_reiting span {float:left; padding: 2px 5px 0px 5px; font-weight: bold;}     

.vc_nomer {     
    font: 11px Verdana,Arial,Helvetica, sans-serif;     
    float:right;     
    font-size:19px;     
    margin-left: 15px;     
}     

.vc_nomer a:link,     
.vc_nomer a:visited {color:#C7C7C7;}     
.vc_nomer a:hover {color:#2C68A6;}     

.vc_center {     
    float:left;     
    text-align:justify;     
    font: 115%/1.5 Verdana,Arial,Helvetica, sans-serif;     
    color:#b5b5b5;     
    width:100%;     
}     

.coment_avatar{     
    float:right;     
    width:50px;     
    height:50px;     
    padding:3px;     
    margin: 0px 0px 10px 15px;     
}     

.vc_center {     
    color:#b5b5b5;     
    width:100%;     
}     

.vcc_otvet {     
    color:#ececec;     
    padding: 5px 5px 5px 5px;     
    background: #7d7d7d;     
    border: 1px solid #959595;     
    width:98%;     
    margin: 10px 0px 10px 0px;     
}     

.vc_center,     
.vcc_otvet {     
    float:left;     
    overflow: hidden;     
    text-align:justify;     
    font: 115%/1.5 Verdana,Arial,Helvetica, sans-serif;     
}     

.vc_bottom {     
    clear:left;     
    text-align:right;     
    padding: 0px 0px 0px 0px;     
}     

.post_r {color: #858585;}     
.red {color: #ef7575;}     
.gren {color: #8fef75;}     
.grey {color: #999;}


№3 Оранжевый вид комментариев



Code
/* Comments Style */     
.cBlock1,     
.cBlock2 {     
    float:left;     
    overflow: hidden;     
    width:100%;     
    margin-bottom: 15px;     
    outline: 1px solid #ffa24a;     
    border: 1px solid #fff;     
}     

.cBlock1 {background: #fff0e1;}     
.cBlock2 {background: #fff4db;}     

.vid_comments_os {     
    float:left;     
    width:95%;     
    padding: 5px 15px 5px 16px;     
}     

.vid_comments_os a:link,     
.vid_comments_os a:visited {color:#e98d34;}     
.vid_comments_os a:hover {color:#2222be;}     
img {border: none; }     
a {outline: none; text-decoration:none!important; }     

.vc_top {     
    float:left;     
    width:100%;     
    padding: 0px 0px 5px 0px;     
}     

.vc_name {     
    font: 10px Verdana,Arial,Helvetica, sans-serif;     
    text-shadow: 1px 1px 1px #fff;     
    float:left;     
    padding: 3px 0px 0px 0px;     
}     
        
.vc_name strong {color:#4EA62C;}     
.vc_name span {color:#999;}     

.vc_reiting {     
    font: 11px Verdana,Arial,Helvetica, sans-serif;     
    float:right;     
}     

.vc_reiting img {float:left; padding-top: 6px;}     
.vc_reiting span {float:left; padding: 2px 5px 0px 5px; font-weight: bold;}     

.vc_nomer {     
    font: 11px Verdana,Arial,Helvetica, sans-serif;     
    float:right;     
    font-size:19px;     
    margin-left: 15px;     
}     

.vc_nomer a:link,     
.vc_nomer a:visited {color:#C7C7C7;}     
.vc_nomer a:hover {color:#2C68A6;}     

.vc_center {     
    float:left;     
    text-align:justify;     
    font: 115%/1.5 Verdana,Arial,Helvetica, sans-serif;     
    color:#555;     
    width:100%;     
}     

.coment_avatar{     
    float:right;     
    width:50px;     
    height:50px;     
    padding:3px;     
    margin: 0px 0px 10px 15px;     
    border: 1px solid #f6c65d;     
}     

.vc_center {     
    color:#555;     
    width:100%;     
}     

.vcc_otvet {     
    color:#555;     
    padding: 5px 5px 5px 5px;     
    background: #fff;     
    border: 1px solid #f6c65d;     
    width:98%;     
    margin: 10px 0px 10px 0px;     
}     

.vc_center,     
.vcc_otvet {     
    float:left;     
    overflow: hidden;     
    text-align:justify;     
    font: 115%/1.5 Verdana,Arial,Helvetica, sans-serif;     
}     

.vc_bottom {     
    clear:left;     
    text-align:right;     
    padding: 0px 0px 0px 0px;     
}     

.post_r {color: #888;}     
.red {color: #a71a1a;}     
.gren {color: #1da71a;}     
.grey {color: #999;}  
 
 
   
Сообщение оставлено 25.01.2012 в 01:43:08 | Сообщение #2
14
Белый взял... спасибо grin
 
<a href="http://logical-portal.ru/index/8-215721" target="_blank"><img src="http://liiion911.ru/bb_1_3_215721.png" /></a>
 
   
Форум общения - Logical-portal » Урна » Собрание скриптов uCoz » Красивый Вид комментариев для uCoz (3 штук)
  • Страница 1 из 1
  • 1
Поиск:
 
Графика от: Megas, GraFOS | Дизайн сверстал E.A.
Хостинг от uCoz
Яндекс.Метрика