Светлый вид комментариев для сайта uCoz сделает ваш сайт привлекательнее

17.07.2025 просмотров

392 |

Добрый день. совсем не давно в интернете нашел отличный скрипт для uCoz, который сделан для модуля "Комментариев". Отличное решение для светлых дизайнов, думаю более продвинутые пользователи смогут изменить цвет для своего сайта при помощи Таблицы стилей CSS и Фотошопа, а если кто-то не может самостоятельно изменить цвет пишите в комментариях и мы обязательно вам поможем!
Этот вид комментариев для uCoz совершенно бесплатен, установка делается в пару кликов и все это я вам распишу по шагово.
И так давайте приступим к установке:

Шаг №1. Установка html кода.

Открываете ПУ(Панель управления) - Вид комментариев удаляете весь код и вставляете новый код:

Код

<div class="cell_comment">
<div class="comment_top">
  <strong class="comment_name"><?if($USERNAME$)?>$USERNAME$ <?else?>$NAME$<?endif?></strong>
  <span> пишет: | $DATE$ | $TIME$ <?if($MODER_PANEL$ && $EMAIL$)?><a href="$EMAIL_JS$" title="Email"> ( E-mail )</a><?endif?></span>
  <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$"><strong class="comment_number">#$NUMBER$</strong></a>
  <?if($ENTRY_URL$)?><a class="comment_page" href="$ENTRY_URL$" target="_blank" title="Перейти на страницу материала">Страница с комментарием </a><?endif?>
  <?if($MODER_PANEL$)?><span class="comment_mp">$MODER_PANEL$</span><?endif?>
  </div>

  <div class="comment_message">
  <?if($USERNAME$)?><a href="$PROFILE_URL$"><img class="comment_avatar" alt="$USERNAME$" src="<?if($USER_AVATAR_URL$)?>$USER_AVATAR_URL$<?else?>http://www.center-dm.ru/img/no_avatar.jpg<?endif?>" /></a><?else?><img src="http://www.center-dm.ru/img/no_avatar.jpg" class="comment_avatar" alt="аватар отсутствует" /><?endif?>
  $MESSAGE$
  <?if($ANSWER$)?><div class="comment_answer_admin"><a href="/index/8-1" ><img class="comment_avatar_admin" alt="админ" src="http://www.center-dm.ru/avatar/1DM.jpg"></a>$ANSWER$</div><?endif?>
  </div>

  <div class="comment_bottom">
  <?if($ANSWER_URL$)?><a href="$ANSWER_URL$" class="comment_answer">Ответить</a><?endif?>
  <strong> <?if($COMMENT_RATING$>0)?>Like | +$COMMENT_RATING$ <?endif?> <?if($COMMENT_RATING$=0)?><?if($GOOD_COMMENT_URL$)?><?else?>Like |<?endif?> $COMMENT_RATING$ <?endif?></strong>
  <?if($GOOD_COMMENT_URL$)?><a class="comment_like" href="$GOOD_COMMENT_URL$">Like</a><?endif?>
  </div>

</div>

Обратите внимание, что аватар и ссылка на страницу администратора в ячейки системной переменной $ANSWER$ отвечающий за отображение ответа от администратора, следует прописать вручную.

Шаг №2. Установка CSS

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

Код

/* Вид комментариев для uCoz v.5
------------------------------------------*/
.cell_comment {
  float:left;
  width:100%;
  color:#666;
  background:#fff;
  margin: 10px 0px;
  border: 5px solid #bdd3e0;
  border-radius:3px; overflow: hidden;
}

.comment_top {
  float:left;
  width:100%;
  padding:5px 0px;
  background:#F4F8F9;
  border-bottom: 1px solid #E6F0F2;
}

.comment_name{
  margin-left: 20px;
  color:#34AB63;
}

.comment_number {
  float:right;
  background:#f5f7f9;
  margin-right: 20px;
}

.comment_top span {
  font:9px Verdana,Arial,Helvetica, sans-serif;
  color:#999;
}

.comment_mp,
.comment_page {
  float:right;
  margin-right: 20px;
}

.comment_message {
  float:left;
  font:115%/1.5 Verdana,Arial,Helvetica, sans-serif;
  text-align:justify;

  width:94%;
  overflow: hidden;
  padding: 10px 20px 15px 20px;
}

.comment_avatar {
  float:right;
  width:50px;
  height:50px;
  margin: 0px 0px 10px 20px;
  border: 3px solid #bdd3e0;
  border-radius:3px;
}

.comment_bottom {
  float:left;
  width:100%;
  padding:6px 0px 5px 0px;
  background:#F4F8F9;
  border-top: 1px solid #E6F0F2;
  font:10px Verdana,Arial,Helvetica, sans-serif;
}

.comment_answer:link,
.comment_answer:visited{
  float:left;
  margin: 0px 0px 0px 20px;
  background:#8cbec9;
  padding: 2px 7px 2px 7px;
  text-shadow: 1px 1px 1px #5d97a4;
  color:#fff;
}

.comment_answer:hover {
  background:#9dd0db;
}

.comment_answer:active {
  box-shadow:inset 0px 0px 3px #5a95a2!important;
}

.comment_like:link,
.comment_like:visited{
  float:right;
  background:#8ec98c;
  padding: 2px 7px 2px 7px;
  text-shadow: 1px 1px 1px #4aa44c;
  color:#fff;
}

.comment_like:hover {
  background:#abe6a9;
}

.comment_like:active {
  box-shadow:inset 0px 0px 3px #349932!important;
}

.comment_bottom strong {
  float:right;
  padding: 2px 10px 2px 10px;
  background:#dde9d9;
  margin-right: 20px;
}

.comment_answer_admin{
  float:left;
  width:94%;
  margin-top: 10px;
  padding: 10px 20px 10px 20px;
  background:#f4ecec;
  border-radius:3px;
}

.comment_avatar_admin{
  float:right;
  width:50px;
  height:50px;
  margin: 0px 0px 10px 25px;
  border: 3px solid #dca2a2;
  border-radius:3px;
}

.cell_comment a:hover img {
  filter: progid: DXImageTransform.Microsoft.Alpha(opacity=85);
  -moz-opacity: 0.7;
  opacity: 0.7;
  filter: alpha(opacity=85);
}

Вот и все вы только, что установили новый светлый вид комментариев для сайта uCoz. Задавайте вопросы не стесняйтесь!

Рубрика: Комментарии Автор:Посетить автора Теги: вид комментариев

Рекомендуем прочитать

Сервис статистики LiveInternet

Профессиональная работа с различным...

Электронные рассылки

Изготовление сайтов

Хочешь больше «лайков»?

Циклы статей как способ продвижения...

Графические заголовки, используемые...

Зачем писать прибыльные статьи для ...

Посредничество в интернете

Как составить семантическое ядро

Сдача собственных сайтов в аренду

Причины бана в Яндексе

Минусы рекламы сайта в печатных изд...

Адаптация сайта под интернет-реклам...

Как определяется цена на продвижени...

Flash-плеер для сайта по игре S.T.A...

Возможности специфической «скрытой»...

4 основных фильтра поисковой систем...

Как зарабатывать через интернет

Новогодняя шапочка на баннере стати...

Новый плеер S.T.A.L.K.E.R.

Как возможности Web 3.0 скажутся на...

Как правильно добавлять контент на ...

Технические моменты подготовки сайт...

Выбор веб-дизайнера и основые ошибк...

Адаптивная верстка веб-страниц

Заработок в сети с помощью постинга

Как улучшить индексацию сайта, испо...

Заработок посещением сайтов

Как улучшить поведенческие факторы?

Что такое тошнота слов документа, з...

Рип сайта LetitBit.net для uCoz

На что нужно обратить внимание при ...

Каким должен быть сайт дистанционно...

Дизайн интернет-магазина. Обратная ...

Способы продвижения сайтов в Яндекс

Санкции поисковых систем, применяем...

4 ключевые задачи контента

Создание сайта под контекстную рекл...

Как увеличить количество регистраци...

3 причины высокого показателя отказ...

4 недостатка табличной верстки

Особенности продвижения сайтов в Go...

Схема продвижения регионального сай...

Преимущества использования готовых ...

Скрипт баллов для uCoz

Как повысить позиции в ПС

Чем отличается корпоративный дизайн...

Как сделать сайт с удобной навигаци...

Как создать интернет-магазин?

HTML. Как это было раньше?

Интернет заработок - все бесплатно!...

Что такое Trustrank?

Веб-дизайн: вредные советы. Часть 2...

Голубой шаблон для uCoz

Причины выпадения сайта из индекса

Способы интернет-заработка в турист...

Верстка с помощью слоев

Что такое стильный веб-сайт?

Продвижение сайта через социальные ...

Как из обычного сайта сделать стиль...

Как попасть в Яндекс Каталог

Как выбирать шаблон для uCoz - два ...

Контекстная реклама – один из основ...

Бан в Яндексе/Яндекс забанил/Yandex...

Сравнение Google Analytics и Яндекс...

5 типов аудитории сайта

10 ошибок начинающих веб-дизайнеров

Как определяется примерная стоимост...

Мини профиль+красивое черное меню д...

Влияние цвета ссылок на увеличение ...

6 составляющих убеждающего текста

Что должен уметь хороший SEO-оптими...

Преимущества создания сайтов на Joo...

Как правильно составить анкор-лист?

Внутренняя оптимизация информационн...

Сравнение Бегуна с Директом

9 ключей к успеху веб-студии

Как фрилансеру правильно оценить св...

Серфинг как один из видов заработка...

Зарабатываем в интернете на реферат...

9 секретов эффективной внешней опти...

Как добавить социальные кнопки на с...

Красивые Flash Часы на тему S.T.A.L...

Black Seo или черная оптимизация

Достоинства статейного продвижения

Irene шаблон для uCoz

Что приводит к уменьшению продаж в ...

Влияние HTML5 на SEO

BLUish шаблон для uCoz

Внешние факторы ранжирования сайта ...

Грамотная перелинковка страниц сайт...

Продвижение сайтов через блоги

Где можно купить домены с тИЦ и PR?

Что такое конверсия сайта?

Белое меню для сайта (Красивое!)

Основное правило выгодной контекстн...

Что нужно знать для создания сайта?

Знакомство с HTML

4 этапа разработки логотипа

Как покорить сердце Яндекса?

Добавлять комментарии могут только зарегистрированные пользователи.
[ Регистрация | Вход ]

Гость

O-uCoz.com

Светлый вид комментариев для сайта uCoz сделает ваш сайт привлекательнее

Рекомендуем прочитать