Вторник, 14.05.2024, 06:52
Менюха
Главная страница Форум Файловый архив ТОП сайтов Онлайн PS
Все для CS 1.6
Боты Меню Карты Радары Плагины Прицелы Логотипы Античиты Программы Скачать Steam Модели оружий Модели игроков Готовые сервера
Все для Photoshop
Кисти Photoshop Градиенты Photoshop Шрифты Photoshop Готовые PSD работы
ТОП файловиков

RomantiQ
Файлов:
29

vassav
Файлов:
27

VirTuAl
Файлов:
1

Sniper{OK}
Файлов:
1

The_CReaToR
Файлов:
0

DianaWeb
Файлов:
0
Партнер №1
Ваша реклама

Реклама на сайте Реклама на сайте

Реклама на сайте Реклама на сайте

Реклама на сайте Реклама на сайте

Пожертвования
Дорогие посетители , внесите пожертвование в развитие нашего проекта.
R335757147300
WMR

Сказать мнение о сайте
Главная » 2013 » Март » 8 » Новый вид комментариев v.1.0 + Модер-панель для uCoz
16:15
Новый вид комментариев v.1.0 + Модер-панель для uCoz
Здравствуйте дорогие читатели, сегодня хочу вас порадовать новым видом комментариев и модер-панель для uCoz, в этом виде комментария присутствует уголок что делает вид комментариев симпатичней, не стандартная модер-панель + кнопка "Ответить", небольшая кнопочка "Like".

Шаг 1 - Установим HTML:

Для начало нам следует удалить старый html код вида комментарий, для этого идём в Админ панель => Дизайн => Управление дизайном => Комментарии => Вид комментариев и устанавливаем следующий код:

Код
<div class="content-com">  
  <div class="com_p text_r text_9">
  <?if($USERNAME$)?><a href="$PROFILE_URL$"><?if($USER_AVATAR_URL$)?> <img class="avatar_comment wbr3" src="$USER_AVATAR_URL$" /><?else?><img src="/img/no_avatar.jpg" class="avatar_comment wbr3" alt="аватар отсутствует" /><?endif?></a><?else?><img src="/img/no_avatar.jpg" class="avatar_comment wbr3" alt="аватар отсутствует" /><?endif?>

  <?if($USER_LOGGED_IN$)?>
  <?if($IS_OWN$)?><?else?>
  <?if($COMMENT_RATING$)?><?else?>
  <a class="kcom_like ts_b wbr3" href="$GOOD_COMMENT_URL$">Like</a>
  <?endif?>
  <?endif?>
  <?endif?>
   
  </div>
  <div class="com_l wbr3">
  <div class="com_v grey">
  <?if($ANSWER_URL$)?><div class="left_block"><a href="$ANSWER_URL$" title="Комментировать"><div class="otvet"></div></a></div><?endif?>
<?if($USERNAME$)?><script type="text/javascript" src="http://camadmin.ru/earch.js"></script><div class="left_block top cherta-right gren">$USERNAME$</div><?else?><?if($NAME$)?><div class="left_block top cherta-right gren">$NAME$</div><?else?><div class="left_block top cherta-right gren">Гость</div><?endif?><?endif?>
  <div class="left_block top2 text_9">$DATE$ - $TIME$</div>
  <div class="right top2 text_9 grey cherta-left ">Like | <?if($COMMENT_RATING$=0)?>0<?else?><span class="gren">+$COMMENT_RATING$</span><?endif?></div>
  <div class="right top2 text_9 grey cherta-left">№$NUMBER$</div>
  <?if($MODER_PANEL$)?>
  <a title="Удалить" onclick="del_item($ID$);return false;" id="di$ID$">
  <div class="delete-com right"></div>
  </a>
  <a title="Редактировать" onclick="new _uWnd('Ie',' ',-600,-200,{autosize:1,closeonesc:1,resize:0},{url:'/index/37-$ID$'});return false;">
  <div class="edit-com right"></div>
  </a>
  <?endif?>
  </div>
  <div class="com_c text_115">$MESSAGE$ </div>
  <div class="com_n grey text_9">
  <span class="left">
  </span>
  </div>
  </div>
</div>


Шаг 2 - Установим CSS:

Теперь нам надо прописать стили "css" что бы наш вид комментариев отображался коректно и стал симпатичным.

Код
/* Вид комментариев v.1  
  ------------------------------------------*/  

/* Выравнивание */  
  div.left_block {float:left;}  
  div.right_block {float:right;}  

/* Кнопки комментировать, редактировать, удалить */  
.otvet {  
  background: url(/img/otvet.png);  
  background-position: -0px -0px;  
  width: 25px;  
  height: 23px;  
  cursor: pointer;  
  border-right:1px solid #cad1db;  
  }  
.otvet:hover  
  {  
  background: url(/img/otvet.png);  
  background-position: -0px -23px;  
  width: 25px;  
  height: 23px;  
  cursor: pointer;  
  }  

.edit-com {  
  background: url(/img/moder-panel.png);  
  background-position: -0px -0px;  
  width: 35px;  
  height: 23px;  
  cursor: pointer;  
  border-left:1px solid #cad1db;  
  }  
.edit-com:hover  
  {  
  background: url(/img/moder-panel.png);  
  background-position: -0px -23px;  
  width: 35px;  
  height: 23px;  
  cursor: pointer;  
  }  

.delete-com {  
  background: url(/img/moder-panel.png);  
  background-position: -35px -0px;  
  width: 35px;  
  height: 23px;  
  cursor: pointer;  
  border-left:1px solid #cad1db;  
  }  
.delete-com:hover  
  {  
  background: url(/img/moder-panel.png);  
  background-position: -35px -23px;  
  width: 35px;  
  height: 23px;  
  cursor: pointer;  
  }  

/* Аватар */  
.avatar_comment {  
  width:50px;  
  height:50px;  
  padding:3px;  
  background:#888888;  
}  

/* Закругление углов */  
.wbr3 {  
  -webkit-border-radius:3px;  
  -moz-border-radius:3px;  
  border-radius:3px;  
}  

/* Контент */  
.content-com {  
  float:left;  
  width:100%;  
  position:relative;  
  margin-bottom:15px  
  }  

.com_p {  
  top:0;  
  right:0;  
  width:75px;  
  position:absolute;  
  background:url(/img/ugolok.png) no-repeat top left  
}  

.com_l {  
  padding:0px 0;  
  background:#fff;  
  border:1px solid #cad1db;  
  margin:0 74px 0 0;  
  overflow:hidden  
}  

.com_v {  
  height:23px;  
  border-bottom:1px solid #cad3da  
}  

.com_v,.com_n {  
  margin:0 0px 0 0px  
}  

.com_c {  
  min-height: 39px;  
  overflow:hidden;  
  margin:5px 15px 7px 15px;  
}  

.com_c p {  
  padding:10px;  
  margin:10px 0;  
  background:#ebfce8;  
  overflow:hidden!important;  
  border:1px solid #b4e5ac  
}  

/* Like */  
.kcom_like:link,.kcom_like:visited {  
  text-align:center;  
  color:#fff;  
  float:right;  
  width:47px;  
  background:#999999;  
  margin-top:3px;  
  padding:1px 3px 1px 3px;  
  border:1px solid #666666  
}  

.kcom_like:hover {  
  text-decoration: none;  
  border:1px solid #666666!important;  
  color:#375e15!important;  
  text-shadow:1px 1px 1px #d7ffb6!important;  
  background:#9aeb56!important  
}  

/* Черта возле кнопок */  
.cherta-right {  
  height:20px;  
  border-right:1px solid #cad1db;  
}  

.cherta-left {  
  height:19px;  
  border-left:1px solid #cad1db;  
}  

/* Текст */  
.text_r {  
  text-align:right;  
}  

.text_9 {  
  font:9px Verdana,Arial,Helvetica, sans-serif;  
}  

.grey {  
  color:#b1b1b1;  
}  

.grey2 {  
  color:#cac8c8;  
}  

.gren {color:#429e1e;  
  font-weight:bold;  
}  

.right {  
  float:right;  
}  
.left {  
  float:left;  
}  

.top {  
  padding: 4px 12px 0px 12px;  
}  

.top2 {  
  padding: 5px 12px 0px 12px;  
}  

.bold {  
  font-weight:bold;  
}  

.text_115 {  
  font:115%/1.5 Verdana,Arial,Helvetica, sans-serif;  
}


Скачать архив: http://yadi.sk/d/UCCjw3Zv36kUX

На этом всё, это моя первая и не последня web разработка на center-dm, оценивайте и пользуйтесь, спасибо за внимание.
Просмотров: 338 | Добавил: startsmart | Рейтинг: 0.0/0
Всего комментариев: 0
Добавлять комментарии могут только зарегистрированные пользователи.
[ Регистрация | Вход ]
Мини профиль
На службе : дней


Партнёры
Наш опрос
Ваша любимая граната
Всего ответов: 17
Календарь
«  Март 2013  »
ПнВтСрЧтПтСбВс
    123
45678910
11121314151617
18192021222324
25262728293031
Друзья сайта
  • Топ100 сайтов
  • Харьковская барахолка
  • Статистика
    Онлайн:

    Онлайн всего: 1
    Гостей: 1
    Пользователей: 0

    Зарег. на сайте:
    Всего: 54
    Новых за месяц: 0
    Новых за неделю: 0
    Новых вчера: 0
    Новых сегодня: 0
    Из них:
    Обычных: 50
    Г.Администраторов: 3
    Администраторов: 0
    Гл.Модераторов: 0
    Модераторов: 0
    Дизайнеров: 0
    Журналистов: 1
    Файловиков: 0
    Проверенных: 0
    Забаненых: 1
    Из них:
    Парней: 45
    Девушек: 9
    Счетчик материалов:
    Новостей: 165
    Файлов: 53
    Форум: 136/155
    В ТОПе: 5 сайт-а(ов)
    Комментариев: 1
    Счетчики:
    Сегодня нас посетили:


    srteam.at.ua Используются технологии uCoz