Gravatar в комментариях на jQuery

Я уже раньше описывал как можно добавить Gravatar в качестве юзерпика в комментариях к вашим записям. Тогда решение было на чистом javascript.

По скольку сегодня большинство сайтов так или иначе использует библиотеку jQuery (а сайты на uCoz используют ее вообще по умолчанию) то я решил предложить более усовершенствованную версию.

Что нам потребуется:
Библиотека md5 для jQuery. Сохраните этот файл как jquery.md5.js, загрузите его к себе на сайт и подключите на странице, где хотите выводить граватары:

<script type="text/javascript" src="путь_к_файлу/jquery.md5.js"></script>

Если у вас сайт на uCoz — добавляйте этот код после тега <body>

После этого вставляем этот код:

<script type="text/javascript" language="javascript">
function userpic(email,id,name) {
 $('.'+id +' > .userpic').html('<img alt="'+name+'"'
+'src="http://www.gravatar.com/avatar/'+$.md5(email)+'?d=wavatar&s=50&r=g" >');
 }
</script >

Верстка комментария должна быть примерно такой:

<div class="comment">
 <div class="u-info ent$ID$">
  <div class="userpic"><script type="text/javascript" language="javascript">userpic('$EMAIL$','ent$ID$','$NAME$');</script>
  </div>
 </div>
текст комментария
</div>

Теперь немножко о переменных, которые мы передаем функции:
$EMAIL$ — собственно e-mail комментатора.
ent$ID$ — id блока комментария. Внутри этого блока должен быть элемент с классом userpic. Скрипт найдет этот элемент и вставит в него сгенерированную картинку.
$NAME$ — имя комментатора, будет указано в качестве альтернативного текста к картинке.
Вот в принципе и всё.

Запись опубликована в рубрике jQuery с метками , . Добавьте в закладки постоянную ссылку.

3 комментария: Gravatar в комментариях на jQuery

  1. Аноним говорит:

    О, так намного лучше

  2. Андрей говорит:

    Странно,почему-то он отображает неверную картинку…Попробую более новую версию jQuery,хотя я не особо в неё верю.

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

Ваш e-mail не будет опубликован. Обязательные поля помечены *