Комментарии старый вариант статьи

Меня вполне устраивает форма комментариев, которая используется в Blogger. Поколдовав со стилями и HTML, можно изменить её вид и функционал на своё усмотрение. Предлагаю протестировать конечный результат в Приложении1.

Содержание.

  1. Добавить ответ на конкретный комментарий Blogger.
  2. Заменить "коммент." на "комментария".
  3. Включить счётчик комментариев.
  4. Чередование фона чётных-нечётных комментариев.
  5. Убрать слово "Комментирует..."
  6. Настроить показ аватара анонимных комментаторов.
  7. Аватар автора без загрузки изображения в профиль.
  8. Стиль имени комментирующего.
  9. Сделать смайлики в комментариях.
  10. Изменить комментарий.
  11. Эффект появляющихся комментарий. Кнопка показать/скрыть.
  12. Как запретить индексировать мнения читателей блога на Blogger.
  13. Чтобы комментировать блог могли пользователи социальной сети.
  14. Сервис Disqus.
  15. Гаджет "Последние комментарии".
  16. Как сделать особенный стиль отзыва автора блога.
  17. Комментировать с Главной страницы Blogger.
  18. Гаджет ТОП комментаторов и мои настройки.
  19. Ссылки "Новые"/"Старые" над комментариями Blogger.

Редактирование производим на вкладке "Дизайн"-"Изменить HTML". Устанавливаем галочку "Расширить шаблоны виджета". Для поиска фрагментов кода используется комбинация клавиш CTRL+F. Перед внедрением лучше сделать резервную копию шаблона (ссылка "Загрузить весь шаблон"), а перед сохранением, проверять результат, нажав кнопку "Просмотр". Код CSS следует прописывать перед:
/* Widgets
------------------------------------------------------------------------------------- */
Размещение стилей Css в шаблоне Blogger.
Размещение стилей Css в шаблоне Blogger.

Добавить ответ на конкретный комментарий Blogger.

Я часто встречала упрёки, что, мол, нельзя ответить на отзыв конкретного человека. Это можно скорректировать, добавив в ваш комментарий ссылку на отзыв, на который вы отвечаете вида @<a href="#c2778332992639980746">Геннадий</a>. Для чего создаём всплывающую форму.
Форма комментария в ответ на конкретный отзыв.
Форма комментария в ответ на конкретный отзыв.
Код:
<dd class='comment-footer'>
  <span class='comment-timestamp'>
    <a expr:href='data:comment.url' title='comment permalink'>
      <data:comment.timestamp/>
       </a>
      <b:include data='comment' name='commentDeleteIcon'/>
    </span>
</dd>
заменяем на:
<dd class='comment-footer'>
  <span class='comment-timestamp'>
    <a expr:href='data:comment.url' title='comment permalink'>
      <data:comment.timestamp/>
       </a>
      <b:include data='comment' name='commentDeleteIcon'/>
    </span>
  <span class='comment-reply'>
<a expr:href='&quot;https://www.blogger.com/comment.g?blogID=идентификационный_номер_вашего_блога&amp;postID=&quot; + data:post.id + &quot;&amp;isPopup=true&amp;postBody=%40%3C%61%20%68%72%65%66%3D%22%23&quot; + data:comment.anchorName + &quot;%22%3E&quot; + data:comment.author + &quot;%3C%2F%61%3E#form&quot;' onclick='javascript:window.open(this.href, &quot;bloggerPopup&quot;, &quot;toolbar=0,location=0,statusbar=1,menubar=0,scrollbars=yes,width=400,height=450&quot;); return false;'>[Отправить комментарий]</a>
  </span>
    </dd>
В данном фрагменте нужно указать ваш идентификационный номер блога. Его можно узнать, когда вы находитесь в панели управления блогом, в адресной строке браузера.
Отображение blogID Blogger в строке браузера.
Отображение blogID Blogger в строке браузера.
Теперь стили CSS. Определяем отступ.
.comment-reply {float: right;
  margin: 0px -27px 0px 0px;}
Далее можно изменить [Отправить комментарий] на код изображения. Например: Ответить на комментарий <img border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg3KBjNGXMp0aOr2GjHPGR9dkuojvqZxb6Fj8kzAV4WkdW-6O0-N0Ja6hbCqO6I3K_23dEtWLATgKjQBZV8zMNXLAgcpBZA66AriDChDgQNVn5OvvFKKPpxuFjP4d-oMDRZ1qlzZzEkvjyZ/s1600/reply.png" />

Заменить "коммент." на "комментария".

В статье об оптимизации заголовков h1, h2, h3 в разделе о заголовке h4 описаны действия, необходимые для раскрытия сокращения "коммент.". А также изменения стиля слов "Нет комментариев." и "Отправить комментарий".

Включить счётчик комментариев.

Нумерация отзывов Blogger.
Нумерация отзывов Blogger.
С помощью скрипта можно пронумеровать отзывы читателей блога.

В код:
<dl expr:class='data:post.avatarIndentClass' id='comments-block'>
   <b:loop values='data:post.comments' var='comment'>
    <dt expr:class='&quot;comment-author &quot; + data:comment.authorClass' expr:id='data:comment.anchorName'>
     <b:if cond='data:comment.favicon'>
       <img expr:src='data:comment.favicon' height='16px' style='margin-bottom:-2px;' width='16px'/>
     </b:if>
     <a expr:name='data:comment.anchorName'/>
     <b:if cond='data:blog.enabledCommentProfileImages'>
       <data:comment.authorAvatarImage/>
     </b:if>
     <b:if cond='data:comment.authorUrl'>
       <a expr:href='data:comment.authorUrl' rel='nofollow'><data:comment.author/></a>
     <b:else/>
       <data:comment.author/>
     </b:if>
     <data:commentPostedByMsg/>
    </dt>
    <dd class='comment-body' expr:id='data:widget.instanceId + data:comment.cmtBodyIdPostfix'>
    <b:if cond='data:comment.isDeleted'>
      <span class='deleted-comment'><data:comment.body/></span>
    <b:else/>
      <p>
        <data:comment.body/>
      </p>
    </b:if>
  </dd>
  <dd class='comment-footer'>
    <span class='comment-timestamp'>
      <a expr:href='data:comment.url' title='comment permalink'>
        <data:comment.timestamp/>
      </a>
      <b:include data='comment' name='commentDeleteIcon'/>
     </span>
    </dd>
   </b:loop>
  </dl>
включите выделенные элементы:
<dl expr:class='data:post.avatarIndentClass' id='comments-block'>
    <script type='text/javascript'>var numberComments=0;</script>
      <b:loop values='data:post.comments' var='comment'>
        <div class='' expr:id='data:comment.id'>
          <dt expr:class='&quot;comment-author &quot; + data:comment.authorClass' expr:id='data:comment.anchorName'>
            <b:if cond='data:comment.favicon'>
               <img expr:src='data:comment.favicon' height='16px' style='margin-bottom:-2px;' width='16px'/>
            </b:if>
            <a expr:name='data:comment.anchorName'/>
            <b:if cond='data:blog.enabledCommentProfileImages'>
               <data:comment.authorAvatarImage/>
            </b:if>
            <b:if cond='data:comment.authorUrl'>
               <a expr:href='data:comment.authorUrl' rel='nofollow'><data:comment.author/></a>
            <b:else/>
               <data:comment.author/>
            </b:if>
            <data:commentPostedByMsg/>
            <span class='commentnumber'>
             <p expr:title='"Ссылка на комментарий: " + "#comment-" + data:comment.id'>
              <script type='text/javascript'>
              numberComments=numberComments+1;
              document.write(numberComments)
              </script>
             </p>
            </span>
            </dt>
          <dd class='comment-body' expr:id='data:widget.instanceId + data:comment.cmtBodyIdPostfix'>
              <b:if cond='data:comment.isDeleted'>
                <span class='deleted-comment'><data:comment.body/></span>
              <b:else/>
                <p>
                  <data:comment.body/>
                </p>
              </b:if>
            </dd>
            <dd class='comment-footer'>
              <span class='comment-timestamp'>
                <a expr:href='data:comment.url' title='comment permalink'>
                  <data:comment.timestamp/>
                </a>
                <b:include data='comment' name='commentDeleteIcon'/>
              </span>
            </dd>
            </div>
          </b:loop>
        </dl>
И CSS. Указываем расположение, размер, шрифт цифр и их цвет.
.commentnumber {
  float: right;
  display: block;
  width: 30px;
  margin-top: -10px;
  text-align: right; 
  font-family: 'Century Gothic','Lucida Grande',Arial,Helvetica,Sans-Serif;
  font-size: 25px;
  font-weight: normal;
}

.commentnumber a:link, .commentnumber a:visited {color: #445566 !important;}
.commentnumber a:hover, .commentnumber a:active {color: #FF9933 !important;}

Чередование фона чётных-нечётных комментариев.

Чередование фона чётных-нечётных замечаний посетителей блога выглядит стильно и более наглядно. Преобразуем код счётчика комментариев (см. выше):
<dl expr:class='data:post.avatarIndentClass' id='comments-block'>
          <script type='text/javascript'>var numberComments=0;</script>
          <b:loop values='data:post.comments' var='comment'>
            <div class='' expr:id='data:comment.id'>
           <dt expr:class='&quot;comment-author &quot; + data:comment.authorClass' expr:id='data:comment.anchorName'>
              <b:if cond='data:comment.favicon'>
                <img expr:src='data:comment.favicon' height='16px' style='margin-bottom:-2px;' width='16px'/>
              </b:if>
              <a expr:name='data:comment.anchorName'/>
              <b:if cond='data:blog.enabledCommentProfileImages'>
                <data:comment.authorAvatarImage/>
              </b:if>
              <b:if cond='data:comment.authorUrl'>
                <a expr:href='data:comment.authorUrl' rel='nofollow'><data:comment.author/></a>
              <b:else/>
                <data:comment.author/>
              </b:if>
              <data:commentPostedByMsg/>
                <span class='commentnumber'>
          <a expr:href='&quot;#comment-&quot; + data:comment.id' title='Ссылка на комментарий'>
            <script type='text/javascript'>
              numberComments=numberComments+1;
              document.write(numberComments)
            </script>
          </a>
        </span>
            </dt>
            <dd class='comment-body' expr:id='data:widget.instanceId + data:comment.cmtBodyIdPostfix'>
              <b:if cond='data:comment.isDeleted'>
                <span class='deleted-comment'><data:comment.body/></span>
              <b:else/>
                <p>
                  <data:comment.body/>
                </p>
              </b:if>
            </dd>
            <dd class='comment-footer'>
              <span class='comment-timestamp'>
                <a expr:href='data:comment.url' title='comment permalink'>
                  <data:comment.timestamp/>
                </a>
                <b:include data='comment' name='commentDeleteIcon'/>
              </span>
            </dd>
<script type='text/javascript'>ContarC(&#39;<data:comment.id/>&#39;)</script>
            </div>
          </b:loop>
        </dl>
Затем шлифуем стиль CSS. Экспериментируем с размерами рамки и цветом (особое внимание обратите на background-color).
.commentPar { 
  margin: 8px -2px 0 -50px;
  padding: 5px 20px 0 50px; 
  background-color: #e9dec4;
  border-bottom: 1px solid #ddcca2;
  border-top: 1px solid #ddcca2;
}

.commentImpar { 
  margin: 8px -2px 0 -50px; 
  padding: 5px 20px 0 50px; 
  background-color: #e5d9bc;
  border-bottom: 1px solid #ddcca2;
  border-top: 1px solid #ddcca2;
}
И, наконец, добавляем скрипт сразу после
<head>:
<script type='text/javascript'>
function ContarC(cual) {
   var resto;
   resto = numberComments % 2;
   if (resto == 0) {
      document.getElementById(cual).className=&#39;commentPar&#39;;
   } else {
      document.getElementById(cual).className=&#39;commentImpar&#39;;
   }
}
</script>

Убрать слово "Комментирует..."

Если возникло желание удалить элемент "Комментирует...", нужно изменить строку
<data:commentPostedByMsg/>
на
<!--<data:commentPostedByMsg/>-->

Настроить показ аватара анонимных комментаторов.

Если посетитель использует при высказывании своего мнения профиль "Название/URL" или "Анонимный", то изображение аватара не будет видно. Решение данной проблемы, а также процесс удаления ссылки на автора отзыва в имени, но не на картинку был описан ранее в статье об удалении нежелательных линков.

Аватар автора без загрузки изображения в профиль.

Панель инструментов Blogger позволяет загрузить в профиль аватар автора блога. Если выбрать профиль отзыва "Google", то именно эта картинка будет использоваться с соответствующей ссылкой на данные автора. Чтобы не включать ссылку и быть анонимным, но при этом иметь аватар, автор блога должен осуществить следующие действия. В код:
<b:if cond='data:blog.enabledCommentProfileImages'>
                <data:comment.authorAvatarImage/>
              </b:if>
              <b:if cond='data:comment.authorUrl'>
                <a expr:href='data:comment.authorUrl' rel='nofollow'><data:comment.author/></a>
              <b:else/>
                <data:comment.author/>
              </b:if>
нужно добавить соответствующие недостающие элементы. Их я выделила курсивом, а места, где следует включить конкретные ваши данные - жирным цветом:
<b:if cond='data:comment.author != &quot;Ваш-НИК&quot;'>
              <b:if cond='data:blog.enabledCommentProfileImages'>
                <data:comment.authorAvatarImage/>
                   </b:if>
                      </b:if>
                    <b:if cond='data:comment.authorUrl'>
                <a expr:href='data:comment.authorUrl' rel='nofollow'><data:comment.author/></a>
              <b:else/>
                <b:if cond='data:comment.author == &quot;Ваш-НИК&quot;'>
                   <img class='comment-avatar' height='35px' src='адрес_картинки_аватара' width='35px' alt="Ваш-НИК" />
                       <data:comment.author/>
                   <b:else/>
                 <data:comment.author/>
                </b:if>
              </b:if>
Код CSS:
img.comment-avatar {
float: left;
display: block;
margin: 0px 0px 0 -43px;
}
Теперь при ответе на комментарий следует выбирать профиль с соответствующим НИКом. В тех отзывах, где уже был использован аватар из профиля, он не будет показан.

Стиль имени комментирующего.

Стиль имени комментирующего можно изменить, обратив внимание на строку
#comments .comment-author {}
В фигурных скобках можно прописывать любые параметры, например:
  1. Цвет: color: #60502a;
  2. Размер: font-size: 18px;
  3. Тень: text-shadow: 3px 3px 3px #505050;
  4. Сияние для IE (не поддерживает text-shadow): filter: glow(color=#505050,strength=1);

Сделать смайлики в комментариях.

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

Итак, после 
<head>
пишем:
<b:if cond='data:blog.pageType == &quot;item&quot;'>
<script type='text/javascript'>
//<![CDATA[
function smileyComment(which) {
if(!document.getElementById) {return;} 
bodyText = document.getElementById(which); // combody-xxxxxxxxxx
whichText = bodyText.innerHTML;

whichText = whichText.replace(/\http:..1.bp.blogspot.com..ebKrCj8TLPk.TMnm7TKHnKI.AAAAAAAAA24..L.TrXMahGY.s1600.ulybka-smailik.gif/g,'<img src="http:https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhKjhf3d44K_EswqEi9bxJxDQwk3yKuSYcb0FacRwr53nHVKK6RX5ryv4KxZyQhHY5Enzk1_jsnYsAtciBexDJssBEh4G28fGKuUDcGkaIHHFKzUZ3Ub2u4Li-NnwwaRKSBXU0-uZko59Yj/s1600/ulybka-smailik.gif" alt="Смайлик улыбка" width="21" height="21" />');

whichText = whichText.replace(/\http:..4.bp.blogspot.com..ebKrCj8TLPk.TMnmsaql89I.AAAAAAAAA2g.Xu52tC0EY24.s1600.plach-smailik.gif/g,'<img src="http:https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgYqhfra_SXxozl7cvBKWWnjUVo10G2r3qExEv7jgzQnkW6rkbIlZztVwARhIdxaXq2kiTh78tZTSvmbnI0HkGUqT5ugKrad5jX9aR1hHOHhuaATINbAAW4ox6unai1ms3K2-Ayunxl4vQ0/s1600/plach-smailik.gif" alt="Смайлик плачущий" width="20" height="21" />');

whichText = whichText.replace(/\http:..1.bp.blogspot.com..ebKrCj8TLPk.TMnmpJVr9SI.AAAAAAAAA2c.6eDbGpcjUHA.s1600.nikak-smailik.gif/g,'<img src="http:https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgThJf7lkzs_KjlOUThLYC2JEViW7jiMlIa-Bt25mg_nZaifBq8iqxseiOo695JBKU8dKznh4Vll3R52AbtSPUpL4QkJrtYG9j50Djyzp0Ca2F5kPEx2Gouk8UjQ83Jlx5VW1MKlDJDuLEo/s1600/nikak-smailik.gif" alt="Смайлик никак" width="20" height="21" />');

whichText = whichText.replace(/\http:..2.bp.blogspot.com..ebKrCj8TLPk.TMnm9_h_26I.AAAAAAAAA28.vKO07LvtFQg.s1600.yazyk-smailik.gif/g,'<img src="http:https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhRAoAUmxoBv9sICuYql1HasrF_YOI7id4XXUxEen5TY19G6h3XQpBUCEEgUrTIP2CuYj7HqT5ivx4-VthYaLi8duJKuzs7ItK02GNNChdmuERktafBCSmD-l9VcfyTdEn2nXVvo1Djw_7Z/s1600/yazyk-smailik.gif" alt="Смайлик показывает язык" width="20" height="21" />');

whichText = whichText.replace(/\http:..3.bp.blogspot.com..ebKrCj8TLPk.TMnmxI26O4I.AAAAAAAAA2o.Oj77qBA.Jvo.s1600.smeh-smailik.gif/g,'<img src="http:https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhzVwe6EMhtS4IggC6s8pi0X_RX4268NjnTGEJo2eG2IB7f6PHEcGetpl_N2bXBmTtI7u1ZCFgSbhUIpCHGqbVXoTkoJb7eyh0ZZswmQoiUF6edtESfeB2u8EaSNPEnX8lCrndBzxS39qev/s1600/smeh-smailik.gif" alt="Смайлик смех" width="20" height="21" />');

whichText = whichText.replace(/\http:..4.bp.blogspot.com..ebKrCj8TLPk.TMnm09QF7nI.AAAAAAAAA2s.hNLG5Uzui9Y.s1600.stesnitelnost-smailik.gif/g,'<img src="http:https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjbKq7_-x5Rfz3WIL5YStk94ff4bWRyvHgm-Qir3XYqQ5_4fltkc5Fgli7YXAIbdeZROKfiDpj_gZ0SRXFBqewv6IOpur42PjMekxJDzJIoUxWFRn-5oUVg-qRCU29onRQ7t1haeLsKegbD/s1600/stesnitelnost-smailik.gif" alt="Смайлик стеснительный" width="20" height="21" />');

whichText = whichText.replace(/\http:..2.bp.blogspot.com..ebKrCj8TLPk.TMnmvZ7w.HI.AAAAAAAAA2k.Dz7p2b5PSBQ.s1600.podmignut-smailik.gif/g,'<img src="http:https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEj9W8p6Fm3PQzgaC8Zs4S3-eanZY9svxNevOZAzFNHXshHjrmnyzoR96PY0YBMjoq1iW4U19fOzf9vEWdsgt387dloGsBSDxFCY984u1AqmxrVE1y9xw_EymWHtrCmCp-e52OQ___RRhqMU/s1600/podmignut-smailik.gif" alt="Смайлик подмигивает" width="20" height="21" />');

whichText = whichText.replace(/\http:..1.bp.blogspot.com..ebKrCj8TLPk.TMnmjZWnFDI.AAAAAAAAA2U.YSYbRBCU4rU.s1600.kukish-smailik.gif/g,'<img src="http:https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEi28LiFN6gMljNwm1QG_uDGYVS8ulxUc8r1NJH2Qp_qrnV1AvR65E3HnHtiBOjvJRGT-DyEIimefKxOP1ed_VnxIvao9D4QclvpmkNSAUdrY8x8y4H0WECV5sqW87sB1HnXrF2RjUtdW0sG/s1600/kukish-smailik.gif" alt="Смайлик кукиш" width="18" height="18" />');

whichText = whichText.replace(/\http:..4.bp.blogspot.com..ebKrCj8TLPk.TMnmmgaFBiI.AAAAAAAAA2Y.yrN5t2xxMqw.s1600.net-smailik.gif/g,'<img src="http:https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiQ5gbO7v6mkgSrkQ0T-wZaB4TrsRR6WVTvFbYspWYs9U-EaT8m0lfFkBi-bnnPIBz9Ur1zENnU2CVxJrTNbe1TMTfATPl7eiqUif62ARajL3ASlocjdFiyQhPYop8XCyWmKrsu9Y0iaqQ7/s1600/net-smailik.gif" alt="Смайлик не согласен" width="20" height="21" />');

whichText = whichText.replace(/\http:..2.bp.blogspot.com..ebKrCj8TLPk.TMnm5k0iz7I.AAAAAAAAA20.hYRgY7uphAU.s1600.uh-ty-smailik.gif/g,'<img src="http:https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEh8ONQCVTU4B3BM4otQMLFD43kGmLtW_4ga3c1u90quCj-jYwNLbrQvIPCQ2sGJ54CO84LL7XLcWh-_nhnEii4-_3_M5F8WZ1eFfNx1Kyc3SvBLhC8yxvcVkN9gyxnWu0g_s9u9ielIpZCg/s1600/uh-ty-smailik.gif" alt="Смайлик ух-ты" width="20" height="21" />');

whichText = whichText.replace(/\http:..2.bp.blogspot.com..ebKrCj8TLPk.TMnm_8ZLDwI.AAAAAAAAA3A.2xIw0CS57JE.s1600.zevota-smailik.gif/g,'<img src="http:https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgkOsA74LWLALq18R2t-ZaoKtbQAmB2xIzSCDF3xF7b1OF0hw32_KkY5SJ22Y-atTb18UHnFR0N-uumfzaFZkcTFO9Q4BoZYprAf0AZ-o_MpFsrtm78iW4oXb6m2CzGg_xQVePYZz6rP8p6/s1600/zevota-smailik.gif" alt="Смайлик зевает" width="20" height="20" />');

whichText = whichText.replace(/\http:..2.bp.blogspot.com..ebKrCj8TLPk.TMnm3TRlDQI.AAAAAAAAA2w.7TYq9OJ2K0w.s1600.strah-smailik.gif/g,'<img src="http:https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjRYmRPJSV-jwwFI1NcssvgFwQhCNRPVfZBZ2CgO9dOue24ZuRVxir2VqsSGYNCCljiz2pkZBgvgG934vaGwTlI-b6z9bJXl4WUsSufew4_1Rp8XHh-z_89kQdtFb0mWg8NkvvmscMJWw8r/s1600/strah-smailik.gif" alt="Смайлик боится" width="20" height="21" />');

bodyText.innerHTML = whichText;
}
//]]>
</script>
</b:if>
Код:
<b:if cond='data:comment.isDeleted'>
  <span class='deleted-comment'><data:comment.body/></span>
<b:else/>
  <p>
    <data:comment.body/>
    <span class='interaction-iframe-guide'/>
  </p>
</b:if>
заменяем на:
<b:if cond='data:comment.isDeleted'>
  <span class='deleted-comment'><data:comment.body/></span>
<b:else/>
  <p expr:id='&quot;combody-&quot; + data:comment.anchorName'><data:comment.body/>
<span class='interaction-iframe-guide'/></p>
<script type='text/javascript'>
  which = &quot;combody-&quot; + &quot;<data:comment.anchorName/>&quot;;
  smileyComment(which);
</script>
</b:if>
После второй строчки 
<a expr:href='data:post.commentFormIframeSrc' id='comment-editor-src'/>
указываем:
<center>
перетащить <img alt='Смайлик улыбка' height='21' src='http:https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhKjhf3d44K_EswqEi9bxJxDQwk3yKuSYcb0FacRwr53nHVKK6RX5ryv4KxZyQhHY5Enzk1_jsnYsAtciBexDJssBEh4G28fGKuUDcGkaIHHFKzUZ3Ub2u4Li-NnwwaRKSBXU0-uZko59Yj/s1600/ulybka-smailik.gif' width='21'/> <img alt='Смайлик плачущий' height='21' src='http:https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgYqhfra_SXxozl7cvBKWWnjUVo10G2r3qExEv7jgzQnkW6rkbIlZztVwARhIdxaXq2kiTh78tZTSvmbnI0HkGUqT5ugKrad5jX9aR1hHOHhuaATINbAAW4ox6unai1ms3K2-Ayunxl4vQ0/s1600/plach-smailik.gif' width='20'/> <img alt='Смайлик никак' height='21' src='http:https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgThJf7lkzs_KjlOUThLYC2JEViW7jiMlIa-Bt25mg_nZaifBq8iqxseiOo695JBKU8dKznh4Vll3R52AbtSPUpL4QkJrtYG9j50Djyzp0Ca2F5kPEx2Gouk8UjQ83Jlx5VW1MKlDJDuLEo/s1600/nikak-smailik.gif' width='20'/> <img alt='Смайлик показывает язык' height='21' src='http:https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhRAoAUmxoBv9sICuYql1HasrF_YOI7id4XXUxEen5TY19G6h3XQpBUCEEgUrTIP2CuYj7HqT5ivx4-VthYaLi8duJKuzs7ItK02GNNChdmuERktafBCSmD-l9VcfyTdEn2nXVvo1Djw_7Z/s1600/yazyk-smailik.gif' width='20'/> <img alt='Смайлик смех' height='21' src='http:https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhzVwe6EMhtS4IggC6s8pi0X_RX4268NjnTGEJo2eG2IB7f6PHEcGetpl_N2bXBmTtI7u1ZCFgSbhUIpCHGqbVXoTkoJb7eyh0ZZswmQoiUF6edtESfeB2u8EaSNPEnX8lCrndBzxS39qev/s1600/smeh-smailik.gif' width='20'/> <img alt='Смайлик стеснительный' height='21' src='http:https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjbKq7_-x5Rfz3WIL5YStk94ff4bWRyvHgm-Qir3XYqQ5_4fltkc5Fgli7YXAIbdeZROKfiDpj_gZ0SRXFBqewv6IOpur42PjMekxJDzJIoUxWFRn-5oUVg-qRCU29onRQ7t1haeLsKegbD/s1600/stesnitelnost-smailik.gif' width='20'/> <img alt='Смайлик подмигивает' height='21' src='http:https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEj9W8p6Fm3PQzgaC8Zs4S3-eanZY9svxNevOZAzFNHXshHjrmnyzoR96PY0YBMjoq1iW4U19fOzf9vEWdsgt387dloGsBSDxFCY984u1AqmxrVE1y9xw_EymWHtrCmCp-e52OQ___RRhqMU/s1600/podmignut-smailik.gif' width='20'/> <img alt='Смайлик кукиш' height='18' src='http:https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEi28LiFN6gMljNwm1QG_uDGYVS8ulxUc8r1NJH2Qp_qrnV1AvR65E3HnHtiBOjvJRGT-DyEIimefKxOP1ed_VnxIvao9D4QclvpmkNSAUdrY8x8y4H0WECV5sqW87sB1HnXrF2RjUtdW0sG/s1600/kukish-smailik.gif' width='18'/> <img alt='Смайлик не согласен' height='21' src='http:https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiQ5gbO7v6mkgSrkQ0T-wZaB4TrsRR6WVTvFbYspWYs9U-EaT8m0lfFkBi-bnnPIBz9Ur1zENnU2CVxJrTNbe1TMTfATPl7eiqUif62ARajL3ASlocjdFiyQhPYop8XCyWmKrsu9Y0iaqQ7/s1600/net-smailik.gif' width='20'/> <img alt='Смайлик ух-ты' height='21' src='http:https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEh8ONQCVTU4B3BM4otQMLFD43kGmLtW_4ga3c1u90quCj-jYwNLbrQvIPCQ2sGJ54CO84LL7XLcWh-_nhnEii4-_3_M5F8WZ1eFfNx1Kyc3SvBLhC8yxvcVkN9gyxnWu0g_s9u9ielIpZCg/s1600/uh-ty-smailik.gif' width='20'/> <img alt='Смайлик зевает' height='20' src='http:https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgkOsA74LWLALq18R2t-ZaoKtbQAmB2xIzSCDF3xF7b1OF0hw32_KkY5SJ22Y-atTb18UHnFR0N-uumfzaFZkcTFO9Q4BoZYprAf0AZ-o_MpFsrtm78iW4oXb6m2CzGg_xQVePYZz6rP8p6/s1600/zevota-smailik.gif' width='20'/> <img alt='Смайлик боится' height='21' src='http:https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjRYmRPJSV-jwwFI1NcssvgFwQhCNRPVfZBZ2CgO9dOue24ZuRVxir2VqsSGYNCCljiz2pkZBgvgG934vaGwTlI-b6z9bJXl4WUsSufew4_1Rp8XHh-z_89kQdtFb0mWg8NkvvmscMJWw8r/s1600/strah-smailik.gif' width='20'/> <a expr:href='data:blog.homepageUrl + &quot;feeds/&quot; + data:post.id + &quot;/comments/default&quot;' style='float: right; '><img alt='RSS' border='0' height='21' src='http:https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhCQSOLkG3h0yPeW7G2DwOgKCdA7AyxefEWOvJB2epnx1nyF9RMAKAkEa5GYrESd7QApNmMZ6sQmFrt_DqDy2Oj9WZ2EzWUM64qwBEYS5u5N2qMv1LBDDf1QmWykv35hk3f98rtQCn_3jCx/s21/rss_logo2.png' width='21'/></a></center>
Изображение смайликов вы можете подобрать самостоятельно, изменив код рисунка, или воспользоваться предложенным мной вариантом.

Изменить комментарий.

Здесь я, к сожалению, ничего не придумала и не нашла нужной информации, кроме как
  1. сохранить текст и ссылку на страницы комментаторов в документ Word либо пометить отзыв как спам, если после него были опубликованы другие мнения,
  2. удалять неверные рекомендации,
  3. и писать заново. Сначала вопрос читателя, заранее выйдя из своего аккаунта, воспользовавшись вариантом, затем свой улучшенный ответ.

Расширить форму, куда пользователь вносит ответ.

Перед ]]></b:skin> добавляем
#comment-editor {width: значение_ширины px;}

Убрать ссылку времени отправки комментария.

Убрать ссылку времени отправки комментария.
Дабы отклонить использование ссылки времени отправки комментария, пробуем часть кода закомментировать, чтобы он не учитывался:
<a expr:href='data:comment.url' title='comment permalink'> <data.comment.timestamp/> </a>
заменяем на: 
<!--<a expr:href='data:comment.url' title='comment permalink'></a>-->
                  <data:comment.timestamp/>

Устранить линк автора в комментариях.

Аватар автора в комментариях будет показан, если установить флажок на вкладке "Настройки"-"Комментарии".

Показывать в комментариях изображения из профиля? Да Нет

Убрать ссылку на автора комментария.
Поскольку уже есть ссылка на автора комментария в аватаре, то я убираю линк имени комментатора, путем замены кода строки:
<b:if cond='data:comment.authorUrl'>
                <a expr:href='data:comment.authorUrl' rel='nofollow'><data:comment.author/></a>
              <b:else/>
                <data:comment.author/>
              </b:if>
на:
<b:if cond='data:comment.authorUrl'>
                <data:comment.author/>
              <b:else/>
                <data:comment.author/>
              </b:if>
Тут возникает другая проблема: Blogger разместил изображения напротив анонимных комментаторов, но по какой-то причине эти картинки не отображаются. До решения данного вопроса специалистами веб-сервиса для ведения блогов, можно разместить фон на их месте. Минусом же данного способа является некорректный вид прозрачных участков рисунков в формате GIF и PNG. Код:
.avatar-image-container {
  margin: .2em 0 0;
}
заменяем на:
.avatar-image-container {
  margin: .2em 0 0;
background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEh7uQRUCn-3pKHyPY1SdtElYFrrBZlnx8qW-ninYLgQCU7YDZ1_kDTwCgeYex-QM002F-bb-C_a4TFevzOBrL3b_Oq6yJYKNUnoNV0dHjMlyUJLi99qtmjmoEWewVGbCX7qBbAnz8CrbneV/s1600/anon-avatar.gif) no-repeat;
background-position: 99% 1%;}
Также мне хотелось обозначить то, что аватар является ссылкой, поэтому после кода выше я добавила:
.avatar-image-container a:hover{
    filter: progid: DXImageTransform.Microsoft.Alpha(opacity=89);
    -moz-opacity: 0.89;    
    -khtml-opacity: 0.89;  
    opacity: 0.89;         
    filter: alpha(opacity=99);
}
После устранения неполадок с изображением, значение 89 можно изменить на меньшее число, например, 50.

Для тех, кто готов отказаться от отображений аватаров, могу предложить статью "Как запретить индексировать комментарии Blogger".

Как запретить индексировать ссылки комментариев Blogger.

Возможно только с отключенными древовидными комментариями и аватарами.

Показывать в комментариях изображения из профиля?    Да    Нет

Переходим на вкладку "Дизайн"-"Изменить HTML", сохраняем копию шаблона, устанавливаем флажок "Расширить шаблоны виджета". Нажав Ctrl+F ищем нужный кусок кода, а именно:
<div expr:id='data:widget.instanceId + &quot;_comments-block-wrapper&quot;'>
        <dl expr:class='data:post.avatarIndentClass' id='comments-block'>
                         ..........
              <b:if cond='data:comment.authorUrl'>
                <a expr:href='data:comment.authorUrl' rel='nofollow'><data:comment.author/></a>
              <b:else/>
                <data:comment.author/>
              </b:if>
                         ..........
              <span class='comment-timestamp'>
                <a expr:href='data:comment.url' title='comment permalink'>
                  <data:comment.timestamp/>
                </a>
                <b:include data='comment' name='commentDeleteIcon'/>
              </span>
                         ..........
         </dl>
      </div>
и меняем на выделенные участки:
<!--noindex--><div class="robots-nocontent">
<div expr:id='data:widget.instanceId + &quot;_comments-block-wrapper&quot;'>
        <dl expr:class='data:post.avatarIndentClass' id='comments-block'>
                         ..........
<b:if cond='data:comment.authorUrl'>
                <data:comment.author/>
              <b:else/>
                <data:comment.author/>
              </b:if>
                         ..........
              <span class='comment-timestamp'>
                <data:comment.timestamp/>
                <b:include data='comment'name='commentDeleteIcon'/>
                <data:comment.authorUrl/>
              </span>
                         ..........
         </dl>
      </div></div><!--/noindex-->
Что я предлагаю сделать:
  • Убираю ссылку на автора предложений и рекомендаций (data:comment.authorUrl) и добавляю её текстом за датой отзыва (<data:comment.timestamp/>), линк на который лучше удалить или закомментаровать.
  • Запрещаю индексировать текстовое содержимое комментариев для:
    1. Яндекса и Рамблера: <!--noindex-->...<!--/noindex-->
    2. Yahoo: <div class="robots-nocontent">...</div>
    3. Google не предоставляет подобной возможности.
Как запретить индексировать комментарии Blogger.
Как запретить индексировать комментарии Blogger.
В некоторых шаблонах может возникнуть проблема с отображением аватаров. В этом виновен background-position в коде:
#comments .comment-author {
  padding-top: 1.5em;
  border-top: dashed 1px $(widget.alternate.text.color);
  background-position: 0 1.5em;}
Если его удалить, все становится на свои места. А цвет или стиль URL (адреса) комментирующего можно изменить, если после вышеназванного фрагмента добавить:
.comment-timestamp {color: #896a0c;}




Похожие статьи:
  1. Способы использования гаджета HTML/JavaScript, в том числе оформление меню.
  2. Изменяем стиль шрифта лишь в сообщении блога.
Закладки Google Закладки Google Закладки Google Delicious Memori БобрДобр Мистер Вонг Мое место 100 Закладок
Автор: NMitra
Ярлыки:
Похожие материалы:
Подписаться на: Комментарии к сообщению (Atom)