W jaki sposób przechowywać  avatary to dylemat nad którym musi zastanowić się każdy webdeveloper. Czy stworzyć rejestrację użytkowników i przechowywać je u siebie czy może zrezygnować z nich całkowicie. A może jeszcze inaczej? Ja w tym poradniku chciałbym pokazać ciekawą alternatywę która ułatwia życie twórcom witryn internetowych i odciąża ich miejsce na serwerze. Mowa tu o Gravatarach.

Grupa Automattic to to twórcy systemu WordPress. Wraz z rozrostem ich platformy blogowej pojawiła się potrzeba obsługi avatarów, małych obrazków które pozwalają na wizualną identyfikacje komentujących. WordPress nigdy jednak nie słynął z rozbudowanego systemu użytkowników. Dlatego postanowiono przenieść ten moduł na nowo powstałą platformę Gravatar.com skąd avatary mogą być pobieranie przez wszystkie instalacje WP. Co ważne dostęp do tej bazy obrazków mają nie tylko WordPressy ale każda inna strona internetowa. Co więcej implementacja tej usługi jest bardzo prosta a cały system jest przyjazny użytkownikom.

Tworzenie gravataru

Serwis Gravatar jest intuicyjny w obsłudze. Po rejestracji (lub zalogowaniu się danymi z wordpress.com) możemy załadować na jego serwer swój avatar i przypisać go do swojego adresu konta pocztowego. Na ten adres dostaniemy po chwili e-mail z linkiem. Klikając na niego potwierdzimy, że jesteśmy posiadaczami tego loginu. Od tej chwili nasz avatar będzie chodził po internecie za nami. Wystarczamy, że pisząc komentarz podamy ten sam adres e-mail a nasz avatar pojawi się obok naszej opinii. Oczywiście tylko na serwisach korzystających z bazy gravatarów.

Od strony webdevelopera

Usługa oferowana przez serwis Gravatar niesamowicie upraszcza życie twórcom witryn internetowych. By mieć w komentarzach avatary nie musimy już tworzyć systemu rejestracji i ładowania grafik. Wystarczy pobrać od użytkownika jego e-mail i zapisać go w bazie danych. Odpowiedni, krótki skrypt dodany do kodu wyświetlającego komentarze załatwi resztę sprawy.

Kod czyli zapraszamy avatary do siebie

Gravatary można zaimplementować do kodu w każdym języku skryptowym. Ja pokaże jak zrobić to na przykładzie PHP ale równie dobrze można to zrobić w Pythonie, Ruby, JavaScripcie czy C#.

Cały proces polega na tym by skleić odpowiedni adres do obrazka tak by zawierał e-mail internaty oraz ustawienia. Adres trzeba zakodować za pomocą funkcji md5() aby nie był widoczny w kodzie dla botów spamerów. Najprostzy kod wygląda tak:

<?php
   $email = md5(strtolower("adres@emailowy.usera"));
   $gravatar = "http://www.gravatar.com/avatar/".$email
?>
<img src="<?php echo $gravatar; ?>" alt="Avatar">

W powyższym kodzie dodatkowo przepuściliśmy adres przez funkcję strtolower() by mieć pewność, że wszystkie znaki są z małej litery. Proponuję się przyjrzeć jak wygląd ma adres obrazka. W chwili obecnej nasza grafika nie ma rozszerzenia, kończy się hashem. Ale w usłudze gravatar nie ma problemu z rozszerzeniem, można je spokojnie dodać. Wygląda to wtedy bardziej elegancko a w niektórych skryptach rozszerzenie jest wymagane.

$gravatar = "http://www.gravatar.com/avatar/".$email.".jpg"

Dostosowywanie wyglądu

Powyższy kod zalinkuje do obrazków o rozmiarze 80 na 80 pikseli. Gdybyśmy potrzebowali innych wymiarów to możemy w łatwy sposób to ustawić.

<?php
   $email = md5(strtolower("adres@emailowy.usera"));
   $gravatar = "http://www.gravatar.com/avatar/".$email."?size=120";
?>
<img src="<?php echo $gravatar; ?>" alt="Avatar">

W tym przykładzie ustawliśmy rozmiar grafik na 120x120px. A co jeśli komentujący nie ustawił sobie gravataru? Wtedy możemy ustawić domyślny obrazek:

<?php
   $email = md5(strtolower("adres@emailowy.usera"));
   $domyslne = "http://www.moja-strona.pl/avatar.jpg";
   $gravatar = "http://www.gravatar.com/avatar/".$email."?&default=".$domyslne;
?>
<img src="<?php echo $gravatar; ?>" alt="Avatar">

Od teraz przy każdym użytkowniku który nie ma ustawionego gravatara będzie pojawiał się obrazek spod adresu http://www.moja-strona.pl/avatar.jpg. Może to spowodować jednak małe zamieszanie dlatego Gravatar.com pozwala by domyślnie był wyświetlany obrazek generowany na podstawie literek w adresie e-maila. Brzmi to dziwnie ale naprawdę działa i co więcej jest dostępne w trzech opcjach. Aby uaktywnić tą funkcję zamiast adresu podajemy identicon, monsterid lub wavatar.

$gravatar = "http://www.gravatar.com/avatar/".$email."?&default=wavatar";

Ale to jeszcze nie wszystko. Gravatar obsługuje klasyfikacje obrazków dzięki czemu możemy zapobiec by na naszej stronie nie pojawiały się zbyt frywolne grafiki. Domyślna klasyfikacja to G czyli obrazki dla wszystkich, PG to obrazki mogące zawierać niestosowne gesty lub lekką przemoc, R należy kojarzyć z narkotykami, nagością i profanacją a X to…hulaj dusza, piekła niema. W kodzie konfiguruje się to następująco:

$gravatar = "http://www.gravatar.com/avatar/".$email."?&rating=x";

Oczywiście wszystkie powyższe opcje można dowolnie łączyć, o to przykład takiego połączenia:

<?php
   $email = md5(strtolower("adres@emailowy.usera"));
   $gravatar = "http://www.gravatar.com/avatar/".$email."?&rating=x&default=monsterid&size=50";
?>
<img src="<?php echo $gravatar; ?>" alt="Avatar">