Jak wyświetlić Gravatar z adresu e-mail użytkownika w WordPress

Gravatar to usługa internetowa, która łączy adres e-mail użytkownika z awatarem online.

WordPress automatycznie wyświetla odwiedzającym Gravatary w sekcji komentarzy, ale możesz chcieć dodać je również do innych obszarów swojej witryny. Może to pomóc w stworzeniu bardziej atrakcyjnego wizualnie doświadczenia użytkownika i zwiększeniu zaangażowania.

W tym artykule pokażemy Ci, jak łatwo wyświetlić Gravatara na podstawie adresu e-mail użytkownika w WordPress, omawiając różne metody, aby zapewnić Ci elastyczne opcje.

Czym jest Gravatar i dlaczego go wyświetlać?

Gravatar to skrót od Globally Recognized Avatar i pozwala ludziom powiązać zdjęcie z ich adresem e-mail.

Jeśli strona internetowa obsługuje Gravatara, może pobrać zdjęcie danej osoby i wyświetlić je obok jej imienia. Na przykład, gdy użytkownik zostawi komentarz z podaniem swojego adresu e-mail na stronie WordPress, WordPress wyświetli Gravatara tej osoby obok jej komentarza.

Gravatary mogą zachęcać użytkowników do udziału w konwersacji, budować poczucie wspólnoty i sprawiać, że Twoje strony wyglądają ciekawiej. Wszystko to razem może pomóc Ci zdobyć więcej komentarzy pod Twoimi postami na WordPress.

W zależności od konfiguracji Twojej witryny, WordPress może wyświetlać Gravatary w innych miejscach, takich jak biografia autora. Jednak możesz chcieć zmienić miejsce, w którym Gravatary użytkowników pojawiają się na Twoim blogu lub stronie WordPress. Na przykład, możesz wyświetlać Gravatar użytkownika na pasku narzędzi lub w profilu użytkownika Twojej witryny.

Mając to na uwadze, przyjrzyjmy się, jak możesz wyświetlić Gravatar z adresu e-mail użytkownika w WordPress. Po prostu użyj poniższych szybkich linków, aby przejść do preferowanej metody:

• Metoda 1: Edycja motywu WordPress (najlepsza dla spójności)
• Metoda 2: Używanie niestandardowego skróconego kodu WordPress (w pełni konfigurowalny)
• Bonus: Lenistwo ładowania Gravatarów w komentarzach WordPress

Metoda 1: Edycja motywu WordPress (najlepsza dla spójności)

Po pierwsze, możesz dodać Gravatar do swojego motywu WordPress za pomocą kodu. Jest to dobry wybór, jeśli chcesz wyświetlać Gravatar w tym samym miejscu na całej swojej stronie, na przykład w pasku bocznym lub nad nagłówkiem. Będziesz jednak musiał edytować pliki szablonu, więc nie jest to metoda najbardziej przyjazna dla początkujących.

Ta metoda pokazuje Gravatara osoby, która jest aktualnie zalogowana na Twojej stronie internetowej. Jest to przydatne w przypadku witryn członkowskich, sklepów internetowych lub każdej innej strony internetowej, gdzie użytkownik musi zalogować się na konto.

Aby dodać Gravatara do swojego motywu, musisz wkleić pewien kod do plików swojego motywu. Jeśli nigdy tego nie robiłeś, zapoznaj się z naszym przewodnikiem dla początkujących na temat wklejania fragmentów kodu z sieci do WordPressa.

Najprostszym sposobem dodawania fragmentów kodu do witryny WordPress jest użycie WPCode. Jest to najlepszy wtyczka do fragmentów kodu dla WordPress, która pozwala dodawać PHP, CSS, JavaScript i inne do Twojej witryny.

Najpierw musisz zainstalować i aktywować darmową wtyczkę WPCode. Jeśli potrzebujesz pomocy, zapoznaj się z naszym przewodnikiem na temat jak zainstalować wtyczkę WordPress.

Po aktywacji odwiedź stronę Fragmenty kodu » + Dodaj fragment » w panelu administracyjnym WordPress. Tutaj zobaczysz wszystkie gotowe fragmenty, które WPCode może dodać do Twojej witryny.

Po prostu najedź kursorem myszy na „Dodaj swój niestandardowy kod (nowy fragment)” i kliknij przycisk „Użyj fragmentu”, gdy się pojawi.

Na początek wpisz tytuł dla fragmentu kodu. Jest to tylko do Twojej wiadomości, więc możesz wpisać cokolwiek chcesz.

Następnie otwórz menu rozwijane „Typ kodu” i wybierz „Fragment PHP”.

Teraz możesz wkleić poniższy kod do edytora kodu:

function wpbeginner_display_gravatar() { 
    global $current_user;
    get_currentuserinfo();
    $getuseremail = $current_user->user_email;
    $usergravatar = 'http://www.gravatar.com/avatar/' . md5($getuseremail) . '?s=32';
    echo '<img src="' . $usergravatar . '" class="wpb_gravatar">';
	echo $getuseremail;
	
} 

Ten kod tworzy prostą funkcję, która pozwala dodać Gravatara w dowolnym miejscu plików szablonu WordPress.

Po wklejeniu kodu przewiń do sekcji „Wstawianie” i wybierz „Automatyczne wstawianie”. Musisz również otworzyć menu rozwijane „Lokalizacja” i wybrać „Uruchom wszędzie”.

Po zakończeniu przewiń do góry strony i kliknij przełącznik „Nieaktywny”, aby zamiast tego wyświetlał się „Aktywny”.

Następnie po prostu kliknij przycisk „Zapisz fragment”.

Teraz możesz wyświetlać Gravatara użytkownika w dowolnym miejscu swojej witryny WordPress, używając następującej funkcji:

<?php wpbeginner_display_gravatar(); ?>

Po prostu dodaj tę funkcję do odpowiedniego pliku szablonu. Na przykład, jeśli chcesz pokazać Gravatara użytkownika w nagłówku swojej strony internetowej, zazwyczaj edytujesz plik header.php.

Jednakże, może się to różnić w zależności od Twojego motywu WordPress. Aby pomóc Ci znaleźć odpowiedni plik szablonu do Twoich potrzeb, zapoznaj się z naszym ściągawką dotyczącą hierarchii szablonów WordPress.

Metoda 2: Używanie niestandardowego skróconego kodu WordPress (w pełni konfigurowalny)

Możesz również dodać Gravatar do dowolnej strony, posta lub obszaru gotowego na widżety, tworząc niestandardowy krótki kod.

Jest to dobry wybór, jeśli chcesz dokładnie kontrolować, gdzie Gravatary pojawiają się na każdej stronie, lub jeśli chcesz wyświetlać te obrazy w różnych lokalizacjach na swojej stronie internetowej.

Podobnie jak metoda 1, to podejście wyświetli Gravatar bieżącego użytkownika. Jeśli wolisz, możesz wyświetlić Gravatar przypisany do konkretnego adresu e-mail, dokonując prostej zmiany w kodzie.

Jest to przydatne, jeśli masz adres e-mail osoby i chcesz wyświetlić jej Gravatara na swojej stronie, ale nie jest ona zarejestrowanym użytkownikiem.

Najprostszym sposobem na tworzenie niestandardowych skrótów jest użycie WPCode. Co więcej, nie musisz edytować plików motywu, co czyni tę metodę znacznie bardziej przyjazną dla początkujących.

Jeśli jeszcze tego nie zrobiłeś, musisz zainstalować WPCode. Musisz także utworzyć nowy niestandardowy fragment kodu, wykonując ten sam proces opisany powyżej.

Po wykonaniu tej czynności nadaj fragmentowi kodu nazwę i wybierz „Fragment PHP” jako typ kodu.

Następnie wklej następujący kod PHP do edytora kodu:

function wpb_display_gravatar($atts) { 
extract(shortcode_atts(array('wpb_user_email' => '',), $atts ));

if ($wpb_user_email == '') { 
    global $current_user;
    get_currentuserinfo();
    $getuseremail = $current_user->user_email;
} else {
	$getuseremail = $wpb_user_email; 

    $usergravatar = 'http://www.gravatar.com/avatar/' . md5($getuseremail) . '?s=32';
  
    echo '<img src="' . $usergravatar . '">'; 
}
}
add_shortcode('wpb_gravatar', 'wpb_display_gravatar');

Ten kod tworzy `[wpb_gravatar]`shortcode, który możesz dodać do dowolnej strony, wpisu lub obszaru gotowego na widżety.

Gdy będziesz gotowy, przewiń do sekcji „Wstawianie” i upewnij się, że wybrano opcję „Automatyczne wstawianie”. Musisz również otworzyć menu rozwijane „Lokalizacja” i wybrać „Uruchom wszędzie”, jeśli nie jest już zaznaczone.

Na koniec przewiń do góry ekranu i kliknij przełącznik „Nieaktywny”, aby zamiast tego wyświetlał się „Aktywny”. Następnie możesz kliknąć „Zapisz fragment”, aby Twój kod zaczął działać.

Możesz teraz wyświetlać Gravatara użytkownika na dowolnej stronie, wpisie lub obszarze gotowym na widżety, używając następującego skróconego kodu:

[wpb_gravatar]

Aby uzyskać więcej informacji na temat umieszczania skróconego kodu, zapoznaj się z naszym przewodnikiem jak dodać skrócony kod w WordPress.

Jeśli chcesz wyświetlić Gravatar konkretnego użytkownika, możesz po prostu dodać jego adres e-mail do shortcode'a:

[wpb_gravatar wpb_user_email="john.smith@example.com"]

Jeśli nie jesteś zadowolony z wyglądu Gravatara, możesz go stylizować za pomocą niestandardowego CSS. Na przykład, możesz dodać następujący fragment kodu CSS do arkusza stylów swojego motywu WordPress:

.wpb_gravatar {
padding: 3px;
margin: 3px;
background:#FFFFFF;
border:3px solid #eee;
}

Aby uzyskać więcej informacji na temat dodawania CSS do WordPress, zapoznaj się z naszym przewodnikiem jak łatwo dodać niestandardowy CSS do swojej witryny WordPress.

Jeśli wolisz, możesz dodać niestandardowy CSS za pomocą narzędzia Dostosuj WordPress. W panelu administracyjnym przejdź do Wygląd » Dostosuj.

W menu po lewej stronie kliknij „Dodatkowy CSS”.

Następnie możesz wkleić niestandardowy kod CSS do małego edytora kodu.

Po zakończeniu kliknij po prostu na „Opublikuj”.

Teraz, odwiedzając swoją witrynę, zobaczysz swój Gravatar w nowym stylu.

Aby uzyskać jeszcze więcej wskazówek dotyczących dostosowywania Gravatarów w swojej witrynie, zapoznaj się z naszym przewodnikiem na temat zmiany rozmiaru obrazu Gravatara w WordPress.

Jak dodać niestandardowy skrócony kod za pomocą edytora całego witryny

Jeśli korzystasz z jednego z nowszych motywów blokowych, możesz dodać skrócony kod do dowolnego szablonu lub jego części. Pozwala to na wyświetlanie Gravatara użytkownika na całej Twojej witrynie bez konieczności edycji plików szablonu.

Na przykład, możesz dodać krótki kod do szablonu bloga lub szablonu nagłówka swojej witryny.

Aby rozpocząć, przejdź do Wygląd » Edytor w panelu administracyjnym WordPress.

Domyślnie edytor całego witryny wyświetla szablon strony głównej Twojego motywu, ale możesz dodawać skrócone kody do dowolnego szablonu lub części szablonu, takiej jak nagłówek lub stopka.

Aby zobaczyć wszystkie dostępne opcje, po prostu wybierz „Szablony” lub „Części szablonu”.

Teraz możesz kliknąć na szablon lub część szablonu, którą chcesz edytować.

Na przykład dodamy shortcode do szablonu strony 404, ale kroki będą dokładnie takie same, niezależnie od wybranego szablonu.

WordPress wyświetli teraz podgląd szablonu lub jego części.

Aby dodać krótki kod, kliknij małą ikonę ołówka.

Po zakończeniu kliknij niebieską ikonę „+” w lewym górnym rogu.

W pasku wyszukiwania wpisz „Shortcode”.

Gdy pojawi się właściwy blok, przeciągnij go i upuść na szablon motywu.

Możesz teraz wkleić lub wpisać skrót [wpb_gravatar] do tego bloku.

Po tym kliknij przycisk „Zapisz”.

Teraz po prostu odwiedź swojego bloga WordPress, aby zobaczyć Gravatar w akcji.

Bonus: Lenistwo ładowania Gravatarów w komentarzach WordPress

Po dodaniu Gravatarów w wielu miejscach na swojej stronie internetowej, dobrym pomysłem jest leniwe ładowanie tych Gravatarów w komentarzach WordPress.

Dzieje się tak, ponieważ większość Gravatarów jest wyświetlana w sekcji komentarzy i może spowolnić działanie witryny, szczególnie w przypadku artykułów z dużą liczbą komentarzy.

Aby leniwie ładować Gravatary, wystarczy zainstalować i aktywować wtyczkę a3 Lazy Load. Szczegółowe informacje znajdziesz w naszym przewodniku dla początkujących na temat jak zainstalować wtyczkę WordPress.

Po aktywacji przejdź do strony Ustawienia » a3 Lazy Load z poziomu panelu administracyjnego WordPress i rozwiń zakładkę „Lazy Load Images”.

Następnie po prostu przełącz przełącznik obok opcji „Gravatary” na „Włączone”. Po tym kliknij przycisk „Zapisz zmiany”, aby zapisać swoje ustawienia.

Teraz wszystkie Gravatary w Twoich biografiach autorów i komentarzach będą ładowane leniwie, aby zwiększyć wydajność witryny. Aby uzyskać więcej instrukcji, zapoznaj się z naszym samouczkiem na temat leniwego ładowania Gravatarów w komentarzach WordPress.

Mamy nadzieję, że ten artykuł pomógł Ci dowiedzieć się, jak wyświetlać Gravatar z adresów e-mail użytkowników na Twojej stronie WordPress. Możesz również zapoznać się z naszym poradnikiem na temat jak powiadamiać użytkowników o zatwierdzeniu ich komentarza w WordPress oraz naszym przewodnikiem na temat jak dodać szybkie tagi w formularzach komentarzy WordPress.

Jeśli podobał Ci się ten artykuł, zasubskrybuj nasz kanał YouTube po samouczki wideo WordPress. Możesz nas również znaleźć na Twitterze i Facebooku.