Кнопка открыть скрыть комментарии в блоге blogspot



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

Читателю не придется прокручивать простыню с комментариями, а если понадобится написать отзыв, нужно будет всего лишь нажать на кнопку и откроется форма. При повторном нажатии отзывы будут скрыты. Пример в этом блоге внизу страницы.

Кнопка открыть скрыть комментарии в блоге blogspot
Кнопка открыть скрыть комментарии в блоге blogspot

Код взяла в статье С.Загуляева http://goo.gl/k7Ykyi В сообществе он делился двойной системой комментариев для блогов blogger. Только удалила из кода комментирование в Google+.

Во-первых, нужно иметь аккаунт в этой социальной сети для комментирования. Во-вторых, отзывы публикуются сразу без модерации автора. Нет возможности настроить сообщать на электронный адрес.

При установке двойной системы комментирования Вам придется тщательно отслеживать все комментарии с социальной сети, потому что они автоматически появятся в блоге. А там сами понимаете, разные ссылки, текст и еще много всего может быть.

В третьих, если Вы участник нескольких сообществ в Google+ и публикуете свои анонсы, то в блоге они конечно же будут повторяться со ссылкой на одну и ту же статью, вот Вам и дубли постов. 

А сейчас давайте реализуем нашу кнопку. Идем в шаблон изменить шаблон. Не забывайте делать резервную копию. В шаблоне ищем строку

 <b:include data='post' name='post'/>

И ниже вставляем код, смотрите скриншот  http://goo.gl/DdWtJ3

<style>#comments, #blogger-comments-visibility {display:none;} .comments-icons {background: url(http://2.bp.blogspot.com/--CsmnKc1FSA/VI8FyLYdw7I/AAAAAAAAAwE/erSHV85Pg_Q/s1600/speech-bubble.png;) no-repeat; font-size: 20px; font-family: &quot;Arial Narrow&quot;,Arial,sans-serif; border-left:5px solid #ff9900;color: #404040; font-weight: bold; padding: 19px 15px 0;  height: 70px; } .comments-icons a img {vertical-align: middle;}</style>
<div class='comments-icons'>
Открыть комментарии &#8594; <a class='show-hide-comments' href='javascript:void();' onclick='$(&quot;#comments&quot;).slideToggle();$(&quot;#blogger-comments-visibility&quot;).hide();'><img class='blogger-icon' height='26' src='http://3.bp.blogspot.com/-4N-YlJvoxdA/VI763udxlHI/AAAAAAAAAvw/0dY2Ys0zz2k/s1600/blogger-logo.png' width='26'/></a>
</div>

Настройки: все, что выделено жирным шрифтом: адрес фона кнопки; размер шрифта; слева размер, цвет и форма оранжевой полосы и цвет шрифта; измените текст; код стрелки; размеры высоты и ширины иконки blogger (26); url адрес иконки blogger, можно изменить на другую.

При тестировании в разных шаблонах обратила внимание: если сообщение блога оформлено в рамку, при нажатии на кнопку форма не откроется. Шаблон может выдавать ошибку при сохранении: закрывающий тэг </div> удалите или добавьте в конце кода еще тэг </div>.

На сегодня вся информация, жду отзывов. Хотелось бы узнать Ваше мнение. Спасибо, что поделились с друзьями в социальных сетях. Всего доброго.

Почитайте другие статьи: Всплывающее описание изображения с переходом по ссылке на источникКак оформить поле комментариев красивым фономАктивная ссылка в комментариях;
TEXT.RU - 100.00%




Автор статьи ✎ Olga Protasova Выпуск ✹ 9/04/2015 Ярлыки ►


Открыть комментарии →

16 коммент. :

  1. Ольга, я такую систему комментариев вижу на многих зарубежных блогах. Единственный недостаток то что без модерации. Опять же ты публикуешь анонс в соцсети ты там тоже комменты можешь модерировать. А про дубли постов и возможности отслеживать не соглашусь. Код просто перенаправляет на Гугл +. И в блоге нет никаких лишних ссылок, которые оставляют из соц. сетей в комментарии. И никак не дублирует. К тому же отслеживать просто. Мы так или иначе публикуем свои анонсы в гугле и включаем оповещения. Всё просто.
    п.с. вообще сам код отсюда http://helplogger.blogspot.ru/2014/12/blogger-and-google-comments-system-with-toggle.html

    ОтветитьУдалить
  2. Вика здравствуй. Модерация это не единственный недостаток, а самый важный. Пока ты заглянешь в сообщества, комменты уже будут в блоге, непонятно какого содержания.
    Часто ссылки оставляют в отзывах к анонсам в сообществах, опять все они будут в блоге.
    И насчет дублей, поделилась в трех сообществах, одно и тоже опять в блоге. Нет, засорять я не собираюсь, это мое мнение.
    А по забугорным блогам, что можно им, нам почему-то запрещено. Взять даже рекламу AdSence. Часто вижу по 4-5 объявлений, и ничего. Нас бы давно уже забанили.

    ОтветитьУдалить
    Ответы
    1. Оль тут как кому нравится. Я не вижу увеличения ссылок из-за этого кода. Единственное, что это картинки в формате png под каждой статьёй. Даже этот участок кода, что ты оставила. И самое главное код тяжёлый и влияет на скорость загрузки. Это да.
      А насчёт лишних ссылок не думаю. Посмотри , вон Костя у себя по этой же методике влипил и Гугл, и Твиттер, и Фейсбук и ещё что-то. глянь, здесь http://www.chuvyr.ru/2015/08/sovety-i-nablyudeniya-o-gruppah-subscribe-ru.html#comment-form
      А вот со скоростью да, проблема.
      Я тоже не буду это долго держать только из за этого.

      Удалить
  3. Вика посмотрела, с Костей не мне соревноваться. Он и 10 влепит, у него блог быстро загружается. У него статья была, он код комментов изменил. Я пыталась, но как была загрузка, такая и осталась, еле грузит. Удалила уже и рекламу Tak.Ru. Кстати, о скорости забыла в статье написать.
    И еще, ты обратила внимание, что Костя в сообществах редко ссылается на статьи, в основном весь анонс в сообществе.
    Вика, объясни, не поняла, "даже этот участок кода, что оставила" С этим кодом в блоге картинок не будет. Я удалила видимость Google+.

    ОтветитьУдалить
    Ответы
    1. Ольга, Да ну её эту кнопку. Пока посмотрю ещё как это будет работать. А насчёт картинок - в этом коде, что ты оставила 2 картинки в формате png. Я их имела ввиду.
      А вот это я не совсем поняла. Объясни.

      Удалить
  4. Вика, это url адрес иконки blogger и картинка светлого фона, где написано "открыть комментарии". При желании можно изменить на другой формат, или изменить картинки на свои.
    Я оставила с кода, формат png тоже можно использовать.

    ОтветитьУдалить
  5. Ольга я её убрала сейчас совсем. Она работать перестала. Да и скорость сейчас немного лучше стала. Короче пошла она-----

    ОтветитьУдалить
  6. Вика, интересно почему перестала работать. Думаю, гугл чудит со своей кнопкой Google+. Понаблюдаю свой вариант с одной кнопкой.

    ОтветитьУдалить
  7. Здравствуйте!
    А вы не сталкивались с исправлением ошибок в Google вебмастере.
    Путь: Вид в поиске - Структурированные данные. Ошибки называются: hatom(108 ошибок), hentry(85)
    Вот думаю, что это тоже влияет на выдачу. Искал у вас в блоге но не нашел инфо.

    ОтветитьУдалить
  8. Здравствуйте Сергей. С такими ошибками не сталкивалась. У меня другие 266, 516.. Что интересно, нажимаю "Проверить данные", в результатах проблем нет.
    Что касается кнопки, комменты скрыты для удобства посетителей, чтобы не прокручивали без конца простыню с отзывами, если их много. На выдачу никак не влияет. Для роботов ничего не скрыто.

    ОтветитьУдалить
  9. Добрый вечер Ольга! у меня получилась красивая кнопка, спасибо за такую идею, иногда комментарии в такую простыню растягивают страницу! Вот только она у меня на главной странице под каждым сообщением отображается, и не активна, т.е. без пользы дела, можно ее убрать с главной страницы? И еще подскажите у вас дата сообщения внизу расположена рядом с автором и рубрикой, как вы это сделали? Она у меня над сообщением появляется почему-то? С уважением Тата.

    ОтветитьУдалить
    Ответы
    1. Tata, кнопку с главной надо убрать. Пример на скриншоте:

      goo.gl/zpzDbt

      Таким способом убираем все, что не нужно на главной: соцкнопки, виджеты и.т.д

      Для примера статья, скопируйте код

      http://www.bdblogov.ru/2014/08/How-hide-widget-Linkwithin-with-home-page-blog.html

      В родных шаблонах убрать дату сверху поста: дизайн-изменить сообщение, убрать галочку.

      У меня дата внизу, потому как шаблон не родной блоггер, сторонний.

      Удалить
    2. Доброго времени суток Ольга! спасибо большое, получилось убрать кнопку с главной страницы, но она убралась и с других страниц, а в сообщениях осталась, что-то не так сделала? у вас на скриншоте перед () вставлен участок (<br>) так же попробовала вставить, все равно в других страницах нет этой кнопки "открыть-скрыть", есть окно для ввода комментариев и всё! Есть ли способ это исправить? С уважением Тата.

      Удалить
    3. Tata, кнопка открыть/скрыть только для сообщений, на страницах остается та же форма комментариев.

      br-этот тэг вставлен для переноса, чтобы кнопка была ниже кнопок социальных сетей.

      Удалить
    4. Ольга, извините почему-то то что в скобках я прописала в комментариях не отразилось 3.bp.blogspot.com/-6fnq-EcNkug/V_ESsKTzzaI/AAAAAAAABl8/AMwOHPBZmsk6zvQXgDQUCN-8ftMnRC4oQCLcB/s1600/%25D0%25BA%25D0%25BD%25D0%25BE%25D0%25BF%25D0%25BA%25D0%25B8.JPG, выделила зеленой рамочкой. Получается кнопка только для сообщений, а на страницах будет без кнопки? С уважением Тата.

      Удалить
    5. Tata, тэг br я вставила для себя, чтобы увеличить расстояние между социальными кнопками и кнопкой комментариев. Вы вставляйте без тэга br.

      На страницах публикуется информация об авторе, карта (содержание блога), услуги, скопировать объемный код к примеру, и.т.д. Здесь кнопка совершенно не нужна, так как комментов мало кто публикует.

      Удалить

Ув. читатели! Для вставки HTML кода в комментарии, воспользуйтесь в меню Генератором преобразования HTML кода.

 
Технологии Blogger.

Форма для связи

Имя

Электронная почта *

Сообщение *