» » » » Красивый вид комментариев для ucoz

Скрипт коментарий для uCoz - Красивый вид комментариев для ucoz


Установка:

Этот код вставте в вид комментариев:
Code
<style type="text/css" media="all">@import url(/comm.css);</style>
<div class="expandable_note_box2">
  <div class="expandable_note_bottom2">
  <div class="expandable_note_box1">
  <div class="expandable_note_bottom1">
  <div class="expandable_note_box3">
  <div class="expandable_note_bottom3">
  <div class="middle1">
  <div class="middle2">
  <div class="inside">
<div class="comname">написал:
  <?if($USERNAME$)?><b><u>$USERNAME$</u></b><?else?><b>$NAME$</b><?endif?> ($DATE$ $TIME$)</div>
   
<div class="dleft">
<div class="avatar">
<?if($USER_AVATAR_URL$)?><span>
<a href="$PROFILE_URL$" title="$USERNAME$"><img src="$USER_AVATAR_URL$" border="0" /></a></span><?endif?>
</div>

<div>
</div>
<div>
</div>
<div>
<font color="red"></font></div>
  </div>
  <div class="dright">
  <div class="drightinn">
  <div class="cmoreinfo">
<?if($COMMENT_RATING$<0)?><span class="myWinError"><b>$COMMENT_RATING$</b></span><?else?><?if($COMMENT_RATING$=0)?><span style="color:gray;"><b>$COMMENT_RATING$</b></span><?else?><span class="myWinSuccess"><b>+$COMMENT_RATING$</b></span><?endif?><?endif?>  <?if($GOOD_COMMENT_URL$)?><a href="$GOOD_COMMENT_URL$"><img src="http://s37.ucoz.net/img/icon/thumbu.png" width="13" align="absmiddle" border="0" title="Хороший пост"></a> <a href="$BAD_COMMENT_URL$">
  <img src="http://s37.ucoz.net/img/icon/thumbd.png" width="13" border="0" align="absmiddle" title="Плохой пост"></a><?else?><img src="http://s37.ucoz.net/img/icon/thumbu_.png" align="absmiddle" width="13" border="0" title="Хороший пост"> <img src="http://s37.ucoz.net/img/icon/thumbd_.png" width="13" align="absmiddle" border="0" title="Плохой пост"><?endif?>
<div class="clr">
  </div>
</div>
</div>
  <div class="cmaincont">
$MESSAGE$<br><?if($ANSWER$)?><b>Ответ</b>: $ANSWER$<?endif?>
<?if($SIGNATURE$)?>
--------------------
<div cclass="signature">$SIGNATURE$</div><?endif?>


   
  </div>
  </div>
  <div class="clr">
  </div>
  <div class="cmorelink">
  <span class="arg">$MODER_PANEL$</span>
  <span class="arg"></span>
  </div>
  </div>
  </div>
  </div>
  </div>
  </div>
</div>
  </div>
  </div>
</div>


Это вставляем в css стили(в самый низ):
Code
div.expandable_note_box1 {
  background-image: url("/img/top1.jpg");
  background-position: top left;
  background-repeat: no-repeat;
   
  }
  div.expandable_note_box3 {
  background-image: url("/img/top3.jpg");
  background-position: top right;
  background-repeat: no-repeat;
  padding-top: 35px;
   

  }
  div.expandable_note_box2 {
  background-image: url("/img/top2.jpg");
  background-position: top left;
  background-repeat: repeat-x;

  }
   
  div.expandable_note_box2 div.middle1 {
  background-image: url("/img/middle1.jpg");
  background-position: left;
  background-repeat: repeat-y;
  }
   
  div.expandable_note_box2 div.middle2 {
  background-image: url("/img/middle2.jpg");
  background-position: right;
  background-repeat: repeat-y;
  }
div.expandable_note_box1 div.inside {
  padding-left: 30px;
  padding-right: 20px;
   
  }
   
  div.expandable_note_bottom1 {
  background-image: url("/img/bottom1.jpg");
  background-position: bottom left;
  background-repeat: no-repeat;
   
  }
  div.expandable_note_bottom3 {
  background-image: url("/img/bottom3.jpg");
  background-position: bottom right;
  background-repeat: no-repeat;
  padding-bottom: 50px;
   

  }
  div.expandable_note_bottom2 {
  background-image: url("/img/bottom2.jpg");
  background-position: bottom left;
  background-repeat: repeat-x;

  }
/*comments*/

div.inside .dleft {
  float: left; width: 110px;  
  font-size: 0.9em;
  font-family: Tahoma, Arial, sans-serif;
  color: #878787;
  line-height: 14px;
}
div.inside .dleft a {
  color: #878787;
}

.avatar {
  padding: 3px;
  margin-bottom: 6px;
}

.avatar span img {
  display: block;
  width: 110px; height: auto;
   
  }

.cmoreinfo { font-size: 10px; color: #939393; background: transparent url("../img/linepoint.gif") repeat-x left bottom; padding-bottom: 8px;}
.cmoreinfo ul, .cmoreinfo li { background: none; padding: 0; margin: 0; list-style: none; line-height: 30px;}
.cmoreinfo ul { float: left; width: 49%; }

.cmaincont { padding-top: 8px; color: #000000; font: 14px;}
.comname { font-size: 14px; font-family: Arial, sans-serif; }
.comname, .comname a { color: #c70045; }

div.inside .dright { margin-left: 120px; }
*html div.inside .drightinn { width: 98%; }
div.inside .drightinn { overflow: hidden; }

.signature { color: #e6bfd8; }
.slink { color: #878787; }

.cmorelink { padding-left: 120px; height: 20px; padding-top: 20px; }
.cmorelink a { color: #e72c6d; }

.newstitle { margin-left: 15px; }
.newstitle a { color: #5b5b5b !important; }


Создаем в корне сайта папку "img" и кидаем туда картинки из архива.
Готово.

  Просмотров: 3268 | Категория: Ucoz-комментарии | Добавил: NA

Другие новости


Поделиться ссылкой


Ссылка:
BB-code:
HTML:
|
Уважаемый посетитель, Вы зашли на сайт как незарегистрированный пользователь.
Мы рекомендуем Вам зарегистрироваться либо войти на сайт под своим именем.
Sandro пишет: | 24 июня 2012 16:33
что куда устанавливать???
AID пишет: | 24 июня 2012 16:39
Смотри установку в материале.