Как изменить дизайн комментариев в blogspot



Комментарий – это мнение читателя. И читатель вашего блога сможет выразить свое мнение только написав комментарий к вашей статье. Для того, чтобы читателю было максимально удобно и приятно выражать свое мнение нужно создать максимально комфортные и удобные для этого условия, то есть сделать красивое и удобное окошко комментирования.Но бывает так, что окно для отправления комментариев выглядит весьма сомнительно (Огромная дата отправки коммента, не приятный цвет окна комментирования и т. д.). Но конечно – же есть очень простой способ исправить это безобразие. А именно, нам нужно просто изменить дизайн окна комментирования.

Итак, сначала сделаем резервную копию шаблона (на всякий случай). Ну а далее заходим в дизайнер шаблонов, вкладка Css и вписываем следующий код:

/* comment beauty */
#comments-block dt {padding:2px 10px 0px 10px; margin:10px 0px 10px 0px; font-weight:900;}
#comments-block dt a {text-decoration:none; font-size:15px; font-family:Arial; color:#FF6600;}
.comment-body {margin:0px 10px 0px 10px;}
.comment-body p {padding:15px 15px 15px 20px; font-size:13px; color:#2B2B2B; margin-bottom:5px;border-left:5px solid #cccccc; border-bottom:1px dotted #cccccc; background-color: #ffffff;}
#comments-block .comment-timestamp a {text-decoration:none; font-size:9px; font-weight:300; color:#cccccc; margin-left:-30px;}
#comments-block .comment-timestamp img {margin-left:30px;}
/* comment beauty */

После этого вам нужно лишь настроить вид комментариев под дизайн вашего blogspot блога. Ниже представлены наиболее важные места для настройк дизайна.

* comment beauty */
#comments-block dt {padding:2px 10px 0px 10px; margin:10px 0px 10px 0px; font-weight:900;}
#comments-block dt a {text-decoration:none; font-size:15px; font-family:Arial; color:#FF6600;}
.comment-body {margin:0px 10px 0px 10px;}
.comment-body p {padding:15px 15px 15px 20px; font-size:13px; color:#2B2B2B; margin-bottom:5px;border-left:5px solid #000bff; border-bottom:1px dotted #cccccc; background-color: #ffffff;}
#comments-block .comment-timestamp a {text-decoration:none; font-size:9px; font-weight:300; color:#cccccc; margin-left:-30px;}
#comments-block .comment-timestamp img {margin-left:30px;}
/* comment beauty */

15px – размер ника комментирующего

#2B2B2B – Цвет шрифта. (Серый)

#FF6600 – Цвет ника. (Оранжевый)

solid #000bff – цвет левой границы окна комментирования. (Синий)

dotted #1e9d67 – цвет нижней границы коммента. (Темно – серый)

#ffffff – фон окна комментирования. (Белый)

Красивый дизайн – это одно из основополагающих успеха хорошего блога. Так что прорабатывайте до мелочей свой дизайн и будьте успешны.

Спасибо за добавление этой статьи в:

Комментариев: 5

    • Ola
    • Октябрь 5 2010 в 16:23

    я б изменила. только код моего шаблона заблокирован.

    Ответить

    • Tramp
    • Октябрь 7 2010 в 14:18

    Хм… интересная ситуация. А что вы такого необычного делали с шаблоном?

    Ответить

    • Рома
    • Январь 28 2011 в 1:10

    Подскажите пожалуйста, как сделать такое окно комментариев?

    http://s60.radikal.ru/i167/1101/f1/90fde8cb241b.png

    Ответить

    • Максим
    • Март 4 2015 в 13:18

    Сейчас попробую

    Ответить

Написать комментарий

  • rss
  • rss
  • rss
  • rss