Главная » Файлы » Информеры для uCoz » Информеры для uCoz

Последний комментарий пользователя uCoz
[ · Скриншот ] 15.04.2012, 00:42
Последний комментарий пользователя uCoz



Выкладываю очередную дизайнерскую мелочь, под названием, как вы уже поняли, последний комментарий пользователя, данный вид комментарий я создал в двух основных цветовых гаммах, в светлом и тёмном варианте.

Установка:

Админ панель => Инструменты => Информеры => Создать информер

- Раздел: ( Комментарии )
- Модуль: ( Все модули )
- Количество материалов: ( 5 )
- Количество колонок: ( 1 )
теперь открываем информер и копируем туда следующий код:

HTML-Code

Code
<div class="uzer_coment_v">   
   <div class="uzer_name">   
   <!--?if($USERNAME$)?--> <a href="$PROFILE_URL$" target="_blank">$USERNAME$</a><!--?else?-->$NAME$<!--?endif?-->   
   </div>   
   <div class="uzer_data">$DATE$</div>   
  </div>   

  <div class="uzer_massage">   
   <a href="$ENTRY_URL$" target="_blank">   
   <!--?if($USER_AVATAR_URL$)?-->   
  <img class="coment_avatar" src="$USER_AVATAR_URL$" /><!--?else?--><img class="coment_avatar" src="http://joomla.ucoz.com/Comentarii/no_avatar.jpg" alt="no" /><!--?endif?-->   
   $MESSAGE$   
   </a>   
  </div>


Теперь устанавливаем информер у вас на странице, в нужное вам место:

Code
<div class="uzer_coment">   
   [b]тут ваш информер[/b]   
  </div>


Теперь копируем css в ваш файл стилей:

CSS-Code

Code
/* Последние комментария пользователей   
  ------------------------------------------*/   
  .uzer_coment {   
   overflow: hidden;   
   width:300px;   
   background: #fff;   
   border:1px solid #D6D6D6;   
   border-bottom:none;   
  }   

  .uzer_coment_v {   
   float:left;   
   width:300px;   
   height:27px;   
   background: url('fon_uzer_coment_v.png') repeat-x top;   
   border-top: 1px solid #fff;   
  }   
     
  .uzer_coment_v a:link,   
  .uzer_coment_v a:visited {color:#888;}   
  .uzer_coment_v a:hover {color:#333;}   
     
  .uzer_coment_v a:link,   
  .uzer_coment_v a:visited,   
  .uzer_coment_v a:hover {   
   text-decoration:none;   
   font:11px Verdana,Arial,Helvetica, sans-serif;   
   font-weight: bold;   
   text-shadow: 1px 1px 1px #fff;   
  }   

  .uzer_name {   
   float:left;   
   padding: 6px 0px 0px 10px;   
  }   
     
  .uzer_data {   
   float:right;   
   font:11px Verdana,Arial,Helvetica, sans-serif;   
   font-weight: bold;   
   color:#888;   
   text-shadow: 1px 1px 1px #fff;   
   padding: 6px 10px 0px 0px;   
  }   
     
  .uzer_massage {   
   background: url('fon_uzer_coment_ten.png') repeat-x top;   
   width:290px;   
   float:left;   
   overflow: hidden;   
   padding: 10px 5px 10px 5px;   
   border-bottom: 1px solid #D6D6D6;   
  }   
     
  .uzer_massage :link,   
  .uzer_massage :visited {   
   display: block;   
   text-decoration: none;   
   color:#555;   
  }   

  .uzer_massage:hover {   
   color:#555;   
   background: url('fon_uzer_coment_ten.png') repeat-x top #F3F3F3;   
  }   

  .coment_avatar {   
   width:45px;   
   height:45px;   
   float:right;   
   background: #F3F3F3;   
   padding: 3px;   
   margin-left: 5px;   
   border:1px solid #D6D6D6;   
  }   
  /* -------------------------------------- */


Не забудьте изменить, в выше предоставленных css стилях, ширину основных ячеек width: на нужные вам значения, чтобы данный вид информера, вписался в ваш дизайн сайта.
Категория: Информеры для uCoz | Добавил: kevin | Теги: ucoz, последний, Информеры uCoz, комментарий, пользователя
Просмотров: 697 | Загрузок: 0 | Рейтинг: 0.0/0
Всего комментариев: 0
Добавлять комментарии могут только зарегистрированные пользователи.
[ Регистрация | Вход ]