Лайки, посетители и подписчики на сайт!Подробнее

Как установить граватар на WordPress

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

Gravatar

Сегодня я расскажу как добавить Gravatar на Вордпресс. Для решения проблемы нужно открыть файл шаблона комментариев comments.php, он находится в папке с темой. Найти в нем строку:

1
<?php comment_text() ?>

и перед ней вставить следующий код:

1
<?php echo get_avatar ($comment, $size='64'); ?>
  • Параметр $comment является обязательным, он отвечает за привязку введенного e-mail при комментировании к аккаунту на сайте gravatar.com;
  • Параметр $size не является обязательным, он отвечает за размер отображаемого граватара (максимально допустимый 512х512), для примера я привел 64х64.

После таких изменений у меня наконец-то начали отображаться граватары, но проблема была решена не полностью:

Граватар располагается не красиво

Как видите, текст комментария находится снизу от картинки и в итоге остается слишком много пустого пространства справа от нее. В Кодексе WordPress приведено описание функции get_avatar и указано, что назначение стилей ведется для класса img.avatar. В style.css я добавил следующие свойства:

1
2
3
4
img.avatar {
	float:left;
	margin-right:5px;
}

Теперь граватар выровнен по левому краю от комментария и имеет отступ справа 5 пикселей:

С помощью CSS можно задать стиль отображения

Итак, в чем же преимущество граватаров? Да в том, что не будет необходимости к каждому блогу «прикручивать» свой аватар, а достаточно лишь зарегистрироваться на сервисе, загрузить картинку и она будет служить отличным аватаром на блогах. Картинка привязывается к электронному адресу, адресов можно добавить сразу несколько и у каждого будет свой граватар. Если Вы не хотите регистрироваться на сервисе, то блоги, которые вы комментируете будут отображать картинку по-умолчанию.

Позже я подробно опишу как правильно регистрироваться на сервисе, если Вы до сих пор этого не сделали. Граватары также помогают вести борьбу со спамом 🙂 Сейчас они настолько распространены, что если новый комментарий имеет граватар, то с определенной долей вероятности можно утверждать, что это не спам и автору комментария можно доверять.

Вот так легко и непринужденно я справился с проблемой. Если у Вас возникли вопросы — задавайте в комментариях, с удовольствием на них отвечу!

Рубрика: Все о Wordpress
  1. BloggerMen

    Еще ни разу не сталкивался с такой проблемой. Обычно они уже прописаны. Но все равно спасибо. Может и пригодится.

    Ответить

  2. Webliberty

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

    Ответить

  3. Владимир

    А на рукописном движке, сработает эта подсказка? Хочу попробовать у себя к комментам привязку сделать.

    Ответить

  4. Webliberty

    Владимир, к сожалению, точно не могу ответить на Ваш вопрос, т.к. рукописными движками не доводилось пользоваться. По идее должно сработать, попробуйте и при желании поделитесь результатами. Только вероятно придется заменить $comment на свое. Этот параметр отвечает за id пользователя, оставившего комментарий. Подробнее о функции вывода можете узнать из кодекса.

    Ответить

  5. ahawks

    Вот у меня такая проблема и спасибо автору, но вот мне кажется тут не дописано «Далее нужно найти в коде строку» а самой строки нет))

    Ответить

  6. Webliberty

    Спасибо, поправил! Видимо после редактирования сбилось, ох уж этот визуальный режим 😛

    Ответить

  7. ahawks

    Спасибо, добавил все работает. Хотя моя аватарка отличается почему-то)))

    Ответить

  8. Webliberty

    А попробуй на граватар.ком новое изображение загрузить, может там проблема и стиль CSS неплохо бы добавить. Хотя твой граватар вообще почему-то выше имени стоит… скорее всего для администратора у тебя прописан отдельный код в шаблоне.

    Ответить

  9. AlSa

    У меня в документе вообще такой строки не обнаружилось… Возможно она несколько иначе прописана, а функции те же. Может можно перед другой поставить?

    Хм… оказывается у меня в коде прописан граватар уже, только ничего не отображает. И кстати, на других блогах, где я оставляю свой коммент тоже. Странно. Граватар зарегестрировал несколько дней назад.

    Ответить

  10. Webliberty

    Регистрация на gravatar.com не влияет, т.к. если e-mail адрес не зарегистрирован, то вместо граватара будет отображаться картинка по умолчанию.

    Попробуйте вставить в другое место, т.к. строчки указанной мной может и не быть — все зависит от темы.

    Заодно проверьте в настройках консоли: Параметры/Обсуждение что в пункте «Отображение аватаров» переключатель стоит напротив «Показывать аватары».

    Что касается отображения граватара на других блогах: проверьте правильно ли зарегистрировали, подробнее здесь. Учтите, что комментируя блоги нужно вставлять тот e-mail, который зарегистрирован на gravatar.com и которому присвоено изображение.

    Ответить

  11. Apriori

    Спасибо за инструкцию, тоже столкнулась с такой проблемой. Граватары теперь отображаются, но объясните, пожалуйста, новичку куда писать эти строчки:

    1
    2
    3
    4
    
    img.avatar {
    	float:left;
    	margin-right:5px;
    }

    Ответить

  12. Webliberty

    Apriori, эти строчки нужно написать в CSS Вашей темы (style.css), можно в самый конец.

    Ответить

  13. Александра

    Здравствуйте, скажите пожалуйста, а что если у меня разные адреса почты на Граватаре и на моем сайте — это играет роль? Так как не отображается у меня зарегистрированная картинка на сайте. Я привязала к почте аватарку, в шаблоне тоже все правильно прописано.

    Ответить

  14. Webliberty

    Здравствуйте, Александра. Да конечно, адрес должен быть один, иначе не получится. Или же добавьте и второй адрес на граватар, там можно несколько адресов добавлять и использовать.

    Ответить

  15. Владимир

    Добрый день. На моём сайте не отображаются граватары комментаторов, на хостинге сказали, чтобы я переустановил плагин all in one seo, но я зашёл на ваш сайт и увидел решение. У себя в админке нашёл тему и строку, перед ней вставил нужный код, но на сайте появилась видимая часть этого кода под именем комментатора, а самого граватара так и нет. Посоветуйте, какие есть решения?

    Ответить

  16. Webliberty

    Здравствуйте, Владимир! После обновления плагина WP-Syntax у кода сбилась кодировка, прошу прощения. Сейчас все исправил, попробуйте снова, должно сработать.

    Ответить

  17. Сергей

    Здравствуйте! Почему-то gravatar не работает с почтой mail.ru. Мне вчера не удалось ее зарегистрировать.

    И к Вам такой вопрос: до установки граватара цвет фона авторских комментариев я задавал плагином Highlight Author Comments. Но граватар, видимо, режет некоторые функции вывода этого плагина, и он теперь не работает. Как можно задать фиксированный цвет фона авторских комментариев без плагина?

    Ответить

  18. Webliberty

    Сергей, здравствуйте! Да, с mail.ru мне тоже не удавалось зарегистрироваться, но некоторые оставленные комментарии у меня на блоге с этой почтой все же имеют граватары. Может быть ранее было доступно, а в последнее время запрещено использование данной почты. И это не удивительно, не в первый раз встречаю такие сервисы, не принимающие ящики мэйла. Причина одна — такие ящики очень часто используют для рассылки спама, в итоге они зарекомендовали себя с отрицательной стороны 😕

    Конечно можно настроить внешний вид комментариев и без плагинов, средствами CSS.

    Ответить

  19. Сергей

    Добавил в файле style.css следующие свойства и все получилось:

    1
    2
    3
    4
    5
    6
    
    .comment-author {
    	background-color: #e9d4b9;
    	margin-left: 10px; 
    	margin-bottom: 5px;
    	margin-top: 5px;	 
    }

    Это в любом случае лучше, чем целый плагин ради одной строчки кода держать)))

    Ответить

  20. Webliberty

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

    Ответить

  21. Vladimir

    Спасибо брат, реально выручил! У меня пропали граватары после 2 плагинов которые недавно поставил Easy Gravatars и gravatar box. а получается они тогда нафиг не нужны, раз можно вручную все сделать! Еще раз спасибо 😎

    Ответить

  22. Webliberty

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

    Ответить

  23. Людмила

    Доброе время суток! Спасибо большое за материал! Граватар установила, картинка появилась, а вот со стилями ничего не вышло. Вставила их в самый низ style.css, а текст от комментария все равно под граватаром пишется. Что делать не знаю.

    Ответить

  24. Webliberty

    Людмила, посмотрите исходный код своей страницы или код элемента встроенными средствами браузера — возможно для граватаров у Вас используется не img.avatar, а другой класс.

    Ответить

  25. Webliberty

    Людмила, это кэш браузера. Если вносите изменения, то при просмотре обновляйте страницу нажатием сочетания клавиш Ctrl+F5 — страница обновится с очисткой браузерного кэша.

    Ответить

  26. Людмила

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

    Ответить

  27. Людмила

    Спасибо, оставила эти стили. Вначале посмотрела, текст писался под картинкой, открыла другой браузер, а там все как и требовалась. Почему-то когда я вношу какие-либо изменения в код на своем компьютере, не всегда идет обновление, как-то с запозданием.

    Ответить

  28. Денис Черников

    Здравствуйте!
    Недавно, я заходил на блог к одному известному блогеру тысячнику и в нашей с ним беседе в комментариях, он поведал мне, что запоминает людей только по граватарам. Мол у него, больше развита зрительная память. Да и вообще эти маленькие иконки преображают и оживляют наши комментарии. Благодаря сервису — Gravatar мы легко визуализируем и украшаем нашу читательскую переписку.

    Каждый знает, что благодаря комментариям, мы находим новых знакомых и настраиваем общение с администратором сайта или блога. А чтобы выделиться на фоне чёрного и невзрачного текста мы вставляем красивую аватарку. Кстати, люди, относитесь уважительно к комментаторам и автору ресурса который Вы комментируете. Удачи!

    Ответить

  29. Роман

    Добрый день скажите а куда вставлять указанную вами строку, если у меня нет такой строчки. Куда бы не вставлял какая то чертовщина выходит! Хелп!

    Ответить

  30. Webliberty

    Денис, Вы все верно сказали, не убавить не прибавить 🙂 Тоже иногда ориентировался и запоминал граватары, но когда многие блоггеры начали их меня я начал запутываться и больше обращаю внимание на ник.

    Роман, если ее нет, то попробуйте следующее: на сервере найдите файл /wp-includes/comment-template.php в котором будет эта строка и вставьте код перед ней.

    Ответить

  31. Роман

    Эмм.. подскажите еще раз пожалуйста, я совсем новичок в этом деле. Где найти указанный Вами файл /wp-includes/comment-template.php? Никак не могу его найти 🙁 Где и как искать на сервере ума не приложу. Заранее благодарен.

    Ответить

  32. Webliberty

    Роман, искать там куда устанавливали WP, обычно это корень сайта. Там должна быть папка /wp-includes/ и уже в ней требуемый файл.

    Ответить

  33. Роман

    Спасибо. Нашел файл, нашел строку, вставил перед ней Вашу. Жаль только ничего не изменилось. Граватары не отображаются. В чем может быть причина? 😥 Да еще один момент: в графе «Свежие комментарии» граватары отображаются, а в самих комментариях не отображаются.

    Ответить

  34. Webliberty

    Роман, пробуйте вставлять код в разные места файла, верстка может отличаться, все индивидуально. Редко случается, что во всех случаях подходит единое решение.

    Ответить

  35. gvozdika1

    Спасибо, помогли)) Но осталась проблема — как мне в целом привести комментарии в красивый вид? Подскажите, плиз, вот как у Вас, например))

    Ответить

  36. Webliberty

    gvozdika1, настраивайте с помощью CSS цвета, шрифты, рамки и прочее, готовых решений нет, т.к. в темах используются разные дивы, классы — зависит от верстки.

    Ответить

  37. Елизавета

    Спасибо за информацию! Честно говоря, далось нелегко, но хоть более менее прилично стало! Спасибо!

    Ответить

  38. Регина

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

    Ответить

  39. Webliberty

    Регина, все верно, у тех кто не зарегистрирован используется картинка по-умолчанию (несколько вариантов на выбор представлены в админке блога).

    Ответить

  40. Виктор

    У меня он вообще ни где не отображается, будто не работает 🙁

    Ответить

  41. Webliberty

    Виктор, на сайте Граватара картинка видна? Настройки перед выходом сохранили? Помнится, тогда мне не удавалось подключить картинку к почте на mail.ru

    Ответить

  42. Webliberty

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

    Ответить

  43. Виктор

    Webliberty, в кабинете граватара отображается, а вообще как видите… судя по моему аватару на вашем сайте что нет. Может рамблер почта не подходит?

    Ответить

  44. Advocatus

    Установил граватар, везде отображается, кроме Profile Picture в вордпрессе, возможно потому что у меня дополнительно установлен плагин «All in one Favicon» и тоже «AP Gravatars», что сделать?

    Ответить

  45. Webliberty

    Вы сами частично ответили на свой вопрос) Попробуйте на время отключить эти плагины и проверить, могут ли они являться причиной. All In One Favicon — это фавиконка, поэтому с граватаром конфликтовать никак не может. А вот AP Gravatars давно не обновлялся (более двух лет), поэтому вполне возможно, что причина несовместимости именно в нем.

    Ответить

  46. Евгений

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

    Ответить

Ваш комментарий:

:) ;) :D :( :cry: :| :o :P 8-) :oops: :roll: :idea: