Come visualizzare il Gravatar dall'email dell'utente in WordPress

Gravatar è un servizio web che collega l'indirizzo email di un utente a un avatar online.

WordPress mostra automaticamente gli avatar Gravatar dei visitatori nella sezione commenti, ma potresti volerli aggiungere anche ad altre aree del tuo sito web. Questo può contribuire a creare un'esperienza utente più accattivante e aumentare l'engagement.

In questo articolo, ti mostreremo come visualizzare facilmente un Gravatar dall'email dell'utente in WordPress esplorando vari metodi per offrirti opzioni flessibili.

Cos'è Gravatar e perché visualizzarlo?

Gravatar sta per Globally Recognized Avatar (Avatar Riconosciuto Globalmente) e consente alle persone di associare un'immagine al proprio indirizzo email.

Se un sito web supporta Gravatar, può recuperare l'immagine della persona e mostrarla accanto al suo nome. Ad esempio, quando un utente lascia un commento con la propria email su un sito WordPress, WordPress visualizzerà il Gravatar di quella persona accanto al suo commento.

I Gravatar possono incoraggiare gli utenti a partecipare alla conversazione, creare un senso di comunità e rendere le tue pagine più interessanti. Tutto ciò insieme può aiutarti a ottenere più commenti sui tuoi post WordPress.

A seconda di come è configurato il tuo sito, WordPress potrebbe mostrare i Gravatar in altre posizioni, come la biografia dell'autore. Tuttavia, potresti voler cambiare dove appaiono i Gravatar degli utenti sul tuo blog o sito web WordPress. Ad esempio, potresti mostrare il Gravatar dell'utente nella barra degli strumenti del tuo sito web o nel profilo utente.

Detto questo, vediamo come puoi visualizzare il Gravatar da un'email utente in WordPress. Usa semplicemente i collegamenti rapidi qui sotto per passare al metodo che preferisci:

• Metodo 1: Modifica il tuo tema WordPress (Ideale per la coerenza)
• Metodo 2: Utilizzo di uno Shortcode WordPress personalizzato (Completamente personalizzabile)
• Bonus: Caricamento pigro dei Gravatar nei commenti di WordPress

Metodo 1: Modifica il tuo tema WordPress (Ideale per la coerenza)

Innanzitutto, puoi aggiungere un Gravatar al tuo tema WordPress utilizzando il codice. Questa è una buona scelta se vuoi mostrare un Gravatar nella stessa posizione su tutto il tuo sito, come la barra laterale o sopra l'intestazione. Tuttavia, dovrai modificare i file del tuo template, quindi non è il metodo più adatto ai principianti.

Questo metodo mostra il Gravatar della persona attualmente connessa al tuo sito web. Questo è utile per siti di appartenenza, negozi online o qualsiasi altro sito web in cui l'utente deve accedere a un account.

Per aggiungere un Gravatar al tuo tema, dovrai incollare del codice nei file del tuo tema. Se non l'hai mai fatto prima, consulta la nostra guida per principianti su come incollare snippet dal web in WordPress.

Il modo più semplice per aggiungere snippet di codice al tuo sito WordPress è utilizzare WPCode. È il miglior plugin per snippet di codice per WordPress che ti permette di aggiungere PHP, CSS, JavaScript e altro al tuo sito.

Innanzitutto, dovrai installare e attivare il plugin gratuito WPCode. Se hai bisogno di aiuto, consulta la nostra guida su come installare un plugin per WordPress.

Dopo l'attivazione, visita la pagina Code Snippets » + Add Snippet» nella dashboard di WordPress. Qui vedrai tutti gli snippet pronti all'uso che WPCode può aggiungere al tuo sito.

Semplicemente passa il mouse sopra ‘Add Your Custom Code (New Snippet)’ e fai clic sul pulsante ‘Use Snippet’ quando appare.

Per iniziare, digita un titolo per lo snippet di codice. Questo è solo per riferimento, quindi puoi usare quello che vuoi.

Successivamente, apri il menu a discesa 'Tipo di codice' e seleziona 'Snippet PHP'.

Ora puoi procedere e incollare quanto segue nell'editor di codice:

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;
	
} 

Questo codice crea una semplice funzione che ti permette di aggiungere un Gravatar ovunque nei tuoi file di template di WordPress.

Dopo aver incollato il codice, scorri fino alla sezione ‘Inserimento’ e seleziona ‘Inserimento automatico’. Dovrai anche aprire il menu a discesa ‘Posizione’ e scegliere ‘Esegui ovunque’.

Fatto ciò, scorri fino in cima alla pagina e fai clic sull’interruttore ‘Inattivo’ in modo che mostri invece ‘Attivo’.

Quindi, fai semplicemente clic sul pulsante ‘Salva snippet’.

Ora, puoi mostrare il Gravatar dell’utente ovunque sul tuo sito web WordPress utilizzando la seguente funzione:

<?php wpbeginner_display_gravatar(); ?>

Aggiungi semplicemente questa funzione al file di template corretto. Ad esempio, se vuoi mostrare il Gravatar dell’utente nell’intestazione del tuo sito web, dovrai modificare il file header.php.

Tuttavia, questo può variare a seconda del tuo tema WordPress. Per aiutarti a trovare il file di template giusto per le tue esigenze, dai un’occhiata al nostro foglio di riferimento sulla gerarchia dei template di WordPress.

Metodo 2: Utilizzo di uno Shortcode WordPress personalizzato (Completamente personalizzabile)

Puoi anche aggiungere un Gravatar a qualsiasi pagina, post o area pronta per i widget creando uno shortcode personalizzato.

Questa è una buona scelta se vuoi controllare esattamente dove appaiono i Gravatar in ogni pagina o se vuoi mostrare queste immagini in diverse posizioni sul tuo sito web.

Proprio come il metodo 1, questo approccio mostrerà il Gravatar dell'utente corrente. Se preferisci, puoi mostrare il Gravatar associato a un indirizzo email specifico apportando una semplice modifica al codice.

Questo è utile se hai l'indirizzo email di una persona e vuoi visualizzare il suo Gravatar sul tuo sito, ma non è un utente registrato.

Il modo più semplice per creare shortcode personalizzati è utilizzare WPCode. Ancora meglio, non devi modificare i file del tuo tema, rendendo questo un metodo molto più adatto ai principianti.

Se non l'hai già fatto, dovrai installare WPCode. Dovrai anche creare un nuovo snippet di codice personalizzato seguendo lo stesso processo descritto sopra.

Fatto ciò, dai un nome allo snippet di codice e scegli 'PHP Snippet' come tipo di codice.

Successivamente, incolla il seguente PHP nell'editor di codice:

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');

Questo codice crea uno shortcode [wpb_gravatar] che puoi aggiungere a qualsiasi pagina, post o area pronta per i widget.

Quando sei pronto, scorri fino alla sezione 'Inserimento' e assicurati che sia selezionato 'Inserimento automatico'. Dovrai anche aprire il menu a discesa 'Posizione' e scegliere 'Esegui ovunque' se non è già selezionato.

Infine, scorri fino in cima alla schermata e fai clic sull'interruttore 'Inattivo' in modo che mostri invece 'Attivo'. Puoi quindi fare clic su 'Salva snippet' per rendere attivo il tuo codice.

Ora puoi mostrare il Gravatar dell'utente su qualsiasi pagina, post o area pronta per i widget utilizzando il seguente shortcode:

[wpb_gravatar]

Per maggiori informazioni su come posizionare lo shortcode, consulta la nostra guida su come aggiungere uno shortcode in WordPress.

Se vuoi mostrare il Gravatar di un utente specifico, puoi semplicemente aggiungere il suo indirizzo email allo shortcode:

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

Se non sei soddisfatto dell'aspetto del Gravatar, puoi stilizzarlo usando CSS personalizzato. Ad esempio, puoi aggiungere il seguente snippet di codice CSS al foglio di stile del tuo tema WordPress:

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

Per maggiori dettagli sull'aggiunta di CSS a WordPress, consulta la nostra guida su come aggiungere facilmente CSS personalizzato al tuo sito WordPress.

Se preferisci, puoi aggiungere CSS personalizzato utilizzando il Personalizzatore di WordPress. Nella dashboard, vai semplicemente su Aspetto » Personalizza.

Nel menu a sinistra, fai clic su 'CSS aggiuntivo'.

Puoi quindi incollare il CSS personalizzato nel piccolo editor di codice.

Fatto ciò, fai semplicemente clic su 'Pubblica'.

Ora, se visiti il tuo sito web, vedrai il tuo Gravatar con il nuovo stile.

Per ulteriori suggerimenti sulla personalizzazione dei Gravatar sul tuo sito, consulta la nostra guida su come cambiare la dimensione dell'immagine Gravatar in WordPress.

Come aggiungere uno shortcode personalizzato utilizzando l'editor completo del sito

Se stai utilizzando uno dei più recenti temi a blocchi, puoi aggiungere lo shortcode a qualsiasi modello o parte di modello. Ciò ti consente di mostrare il Gravatar dell'utente su tutto il tuo sito web senza dover modificare i file del modello.

Ad esempio, potresti aggiungere lo shortcode al modello del blog del tuo sito o alla parte del modello dell'intestazione.

Per iniziare, vai su Aspetto » Editor nella dashboard di WordPress.

Per impostazione predefinita, l'editor completo del sito mostra il modello della home page del tuo tema, ma puoi aggiungere shortcode a qualsiasi modello o parte di modello, come l'intestazione o il piè di pagina.

Per vedere tutte le opzioni disponibili, seleziona semplicemente 'Modelli' o 'Parti del modello'.

Ora puoi fare clic sul modello o sulla parte del modello che desideri modificare.

Come esempio, aggiungeremo lo shortcode al modello della pagina 404, ma i passaggi saranno esattamente gli stessi indipendentemente dal modello selezionato.

WordPress mostrerà ora un'anteprima del modello o della parte del modello.

Per aggiungere lo shortcode, fai clic sull'icona della piccola matita.

Fatto ciò, fai clic sull'icona blu '+' nell'angolo in alto a sinistra.

Nella barra di ricerca, digita 'Shortcode'.

Quando appare il blocco giusto, trascinalo sul modello del tema.

Ora puoi incollare o digitare lo shortcode [wpb_gravatar] in questo blocco.

Dopodiché, procedi e fai clic sul pulsante 'Salva'.

Ora, visita semplicemente il tuo blog WordPress per vedere il Gravatar in azione.

Bonus: Caricamento pigro dei Gravatar nei commenti di WordPress

Una volta aggiunti i Gravatar in più punti del tuo sito web, è una buona idea caricare in modo pigro (lazy load) quei Gravatar nei commenti di WordPress.

Questo perché la maggior parte dei Gravatar viene visualizzata nella sezione commenti e può rallentare la velocità del tuo sito, in particolare su articoli con molti commenti.

Per caricare in modo pigro i Gravatar, installa e attiva semplicemente il plugin a3 Lazy Load. Per maggiori dettagli, consulta la nostra guida per principianti su come installare un plugin di WordPress.

Dopo l'attivazione, vai alla pagina Impostazioni » a3 Lazy Load dalla dashboard di WordPress ed espandi la scheda ‘Lazy Load Images’.

Quindi, semplicemente attiva l'interruttore accanto all'opzione ‘Gravatars’ su ‘On’. Dopodiché, fai clic sul pulsante ‘Salva modifiche’ per memorizzare le tue impostazioni.

Ora, tutti i Gravatar nelle biografie dei tuoi autori e nei commenti verranno caricati in modo pigro per migliorare le prestazioni del sito. Per ulteriori istruzioni, consulta il nostro tutorial su come caricare in modo pigro i Gravatar nei commenti di WordPress.

Speriamo che questo articolo ti abbia aiutato a imparare come visualizzare Gravatar dalle email degli utenti sul tuo sito WordPress. Potresti anche voler consultare il nostro tutorial su come notificare agli utenti quando il loro commento è approvato in WordPress e la nostra guida su come aggiungere quick tag nei moduli di commento di WordPress.

Se ti è piaciuto questo articolo, iscriviti al nostro canale YouTube per tutorial video su WordPress. Puoi anche trovarci su Twitter e Facebook.