Tutorial WordPress affidabili, quando ne hai più bisogno.
Guida per principianti a WordPress
WPB Cup
25 Milioni+
Siti web che utilizzano i nostri plugin
16+
Anni di esperienza con WordPress
3000+
Tutorial WordPress di esperti

Come cambiare la dimensione dell'immagine Gravatar in WordPress

Se stai cercando di ridimensionare le immagini Gravatar sul tuo sito WordPress, sei nel posto giusto. Ci sono state occasioni in cui abbiamo dovuto ridimensionare le dimensioni personalizzate di Gravatar sui siti WordPress su cui stavamo lavorando, ma il metodo differisce a seconda del tema che stai utilizzando.

Un Gravatar è un'immagine utilizzata per rappresentare un commentatore o l'autore di un post del blog. I temi di WordPress mostrano i Gravatar a una dimensione prestabilita, ma potresti preferire renderli più piccoli o più grandi per adattarli meglio al design del tuo sito web.

In questo articolo, ti mostreremo come cambiare la dimensione delle immagini Gravatar in WordPress.

Come cambiare la dimensione dell'immagine Gravatar in WordPress

Perché cambiare la dimensione dell'immagine Gravatar in WordPress?

Gravatar sta per Globally Recognized Avatar. È un servizio web che ti consente di creare un profilo e associare immagini avatar al tuo indirizzo email.

La maggior parte dei temi WordPress mostra un Gravatar accanto al commento dell'utente. Alcuni temi visualizzano anche un Gravatar nella casella bio dell'autore.

Anche se un utente non ha un account Gravatar, il tuo sito mostrerà comunque uno dei Gravatar predefiniti di WordPress.

Il Gravatar predefinito di WordPress

A volte, potresti voler cambiare la dimensione dei Gravatar del tuo tema. Ad esempio, potresti volerli ingrandire in modo che risaltino, attirando l'attenzione del visitatore sulla sezione commenti del tuo sito.

Detto questo, diamo un'occhiata a come puoi cambiare la dimensione della tua immagine Gravatar personalizzata sul tuo sito WordPress. Usa semplicemente i collegamenti rapidi qui sotto per passare al metodo che desideri utilizzare:

Metodo 1: Cambia la dimensione del Gravatar usando l'editor completo del sito (solo temi a blocchi)

Se stai usando un tema basato su blocchi come Twenty Twenty-Five, allora puoi cambiare la dimensione predefinita del Gravatar di WordPress usando l'editor completo del sito.

Questo metodo non funziona con tutti i temi, quindi se non stai usando un tema abilitato ai blocchi, ti consigliamo di utilizzare invece il metodo 2.

Nella dashboard di WordPress, vai su Aspetto » Editor.

Apertura dell'editor completo del sito (FSE) di WordPress

Ora arriverai all'editor completo del sito e vedrai diverse impostazioni per modificare varie parti del tuo sito web WordPress.

Per cambiare la dimensione predefinita dell'avatar per i tuoi commenti di WordPress, fai clic sull'icona della barra di ricerca nella parte superiore del pannello di sinistra.

Apertura della palette comandi o della barra di ricerca dell'editor completo del sito di WordPress

A questo punto, cerca semplicemente la parte del modello Commenti.

Fai clic su di essa una volta trovata.

Ricerca della parte del modello Commenti nell'editor completo del sito di WordPress

Nella pagina successiva, vedrai alcune informazioni sulla parte del modello Commenti.

Per modificare la parte del modello Commenti, fai clic sul pulsante a forma di matita. Verrai quindi indirizzato all'interfaccia di modifica.

Clic sul pulsante a matita per modificare la parte del modello Commenti

Ora puoi procedere e fare clic su uno qualsiasi dei Gravatar nell'anteprima live.

Nel menu di destra, puoi selezionare la scheda 'Blocco' se non è già selezionata.

Modifica delle dimensioni dell'immagine Gravatar utilizzando l'editor completo del sito

Ora puoi ingrandire o rimpicciolire i Gravatar trascinando il cursore 'Dimensione immagine'.

Mentre sposti il cursore, tutti i Gravatar si aggiorneranno automaticamente, così potrai provare diverse dimensioni per vedere quale funziona meglio.

Modifica delle dimensioni di un Gravatar utilizzando l'editor completo del sito (FSE) in WordPress

Inoltre, sentiti libero di abilitare l'impostazione 'Link al profilo utente'. Quando un utente fa clic sul Gravatar, verrà indirizzato alla pagina del profilo del commentatore sul tuo sito web.

Quando sei soddisfatto della nuova dimensione predefinita dell'immagine Gravatar, fai clic sul pulsante 'Salva'.

Salvataggio dei Gravatar ridimensionati utilizzando l'editor completo del sito (FSE)

Ora, se visiti qualsiasi sezione commenti sul tuo sito WordPress, vedrai le modifiche in tempo reale.

Metodo 2: Cambia la dimensione del Gravatar modificando comments.php (tutti i temi)

Se non stai utilizzando un tema WordPress a blocchi, puoi modificare la dimensione dell'immagine del profilo Gravatar per i commenti di WordPress modificando il codice del tuo tema.

Questo metodo richiede la modifica dei file del tema, quindi non è l'opzione più adatta ai principianti. Tuttavia, questo metodo dovrebbe funzionare per la maggior parte dei temi WordPress.

Innanzitutto, dovrai connetterti al tuo sito WordPress utilizzando un client FTP come FileZilla, oppure puoi utilizzare il file manager del tuo cPanel di hosting WordPress.

Se è la prima volta che utilizzi FTP, puoi consultare la nostra guida completa su come connettersi al tuo sito tramite FTP.

Una volta connesso, devi andare su /wp-content/themes/ e aprire la cartella del tuo tema WordPress corrente.

Un esempio di client FTP

Una volta qui, apri il file comments.php e cerca una funzione wp_list_comments. All'interno di questa funzione, troverai avatar_size, che imposta la dimensione del Gravatar.

Ecco un esempio di come potrebbe apparire:

<?php
wp_list_comments(
    array(
        'avatar_size' => 60,
        'style'       => 'ol',
        'short_ping'  => true,
    )
);
?>

Puoi semplicemente cambiare avatar_size alla dimensione che desideri utilizzare. Nello snippet di codice sopra, ciò significherebbe cambiare 60 in un altro numero.

I Gravatar sono quadrati, quindi WordPress utilizzerà lo stesso valore per la larghezza e l'altezza dell'immagine. Ciò significa che devi inserire solo un numero.

Dopo aver apportato questa modifica, assicurati di salvare e caricare nuovamente il file sul tuo account di hosting WordPress. Al termine, puoi visitare il tuo blog WordPress per vedere la modifica in azione.

Se l'immagine Gravatar non è cambiata, potrebbe essere dovuto alla cache. Per saperne di più, consulta la nostra guida su come risolvere il problema del sito WordPress che non si aggiorna subito.

Se il Gravatar ancora non cambia, allora il CSS del tuo tema potrebbe sovrascrivere le impostazioni nel file comments.php. In questo caso, devi provare il metodo successivo.

Metodo 3: Cambia la dimensione del Gravatar modificando style.css (tutti i temi)

Per verificare se il CSS del tuo tema sta sovrascrivendo il tuo file comment.php, puoi utilizzare lo strumento Ispeziona elemento del tuo browser. I passaggi varieranno a seconda del browser che stai utilizzando, ma su Chrome, puoi semplicemente fare clic con il pulsante destro del mouse o Ctrl-clic sul Gravatar e quindi selezionare 'Ispeziona'.

Utilizzo dello strumento Ispeziona per scoprire le dimensioni del Gravatar

Questo mostrerà il codice HTML e CSS della pagina in un nuovo pannello.

In questo codice, devi concentrarti sul pannello inferiore e cercare la classe o le classi CSS per l'avatar dell'autore del commento.

Nel nostro esempio, erano .comment-author e .avatar, e contengono proprietà CSS per i valori di altezza e larghezza del Gravatar. Lo sappiamo perché quando passiamo il mouse sopra gli snippet di codice CSS, il Gravatar viene evidenziato nell'anteprima.

Ricerca delle classi CSS per il Gravatar

Ecco come appare il codice nel nostro tema. Tieni presente che potrebbe apparire diverso nel tuo:

.comment-author .avatar {
height: 42px;
position: relative;
top: .25em;
width: 42px;
}

Se la dimensione del Gravatar nel codice CSS è diversa da quella specificata nel file comments.php, ciò significa che il file style.css del tuo tema sta sovrascrivendo le tue modifiche.

Per modificare il tuo file style.css, devi utilizzare WPCode, un plugin per snippet di codice che semplifica l'inserimento di codice personalizzato nel tuo tema. Con questo, puoi modificare il tuo file style.css senza accedervi direttamente, riducendo la possibilità di commettere errori.

Inoltre, dovrai mantenere aperta la scheda in cui hai aperto lo strumento di ispezione. Questo ti permetterà di copiare e incollare il codice CSS per il Gravatar dell'autore del tuo commento in WPCode e modificarlo in seguito.

Innanzitutto, installa WPCode sul tuo sito web WordPress. Puoi leggere la nostra guida su come installare un plugin WordPress per maggiori informazioni.

Quindi, vai su Frammenti di codice » + Aggiungi frammento e seleziona ‘Aggiungi il tuo codice personalizzato (Nuovo frammento).’ Fai clic sul pulsante ‘+ Aggiungi frammento personalizzato’.

Aggiungere codice personalizzato in WPCode

Una volta fatto, digita un nome per il tuo nuovo codice CSS. Può essere qualcosa di semplice come ‘Cambia dimensione Gravatar’.

Per quanto riguarda il Tipo di codice, seleziona ‘Frammento CSS’.

Modifica delle dimensioni del Gravatar con WPCode

Ora, copia e incolla i frammenti di codice CSS del tuo tema originale per la dimensione Gravatar nella casella Anteprima codice.

Una volta fatto, puoi modificare i valori di altezza e larghezza all'interno del codice. Nel nostro esempio, li abbiamo modificati a 50px. Assicurati che le dimensioni di altezza e larghezza siano uguali.

Modifica dei valori delle dimensioni del Gravatar in WPCode

Una volta fatto, scorri verso il basso fino alla sezione Inserisci.

Assicurati che sia selezionato il metodo ‘Inserimento automatico’. Per quanto riguarda la Posizione, scegli semplicemente ‘Intero sito piè di pagina’ in modo che il tuo CSS personalizzato possa sovrascrivere il codice CSS esistente.

Scelta della posizione Piè di pagina per tutto il sito in WPCode

Dopodiché, fai semplicemente clic sull'interruttore nell'angolo in alto a destra per rendere il codice ‘Attivo’ e fai clic su ‘Salva frammento’. Se visiti il tuo blog o sito web WordPress, vedrai le tue immagini Gravatar aggiornate.

Ora, ti consigliamo di provare a cambiare la dimensione di Gravatar nel file comments.php prima di utilizzare il metodo CSS più semplice.

Innanzitutto, il CSS a volte può rendere i Gravatar sfocati, specialmente se rendi gli avatar molto più grandi dell'immagine originale.

In secondo luogo, cambiare la dimensione dell'immagine in comments.php spesso aiuta il tuo sito a caricarsi più velocemente. Questo perché il browser deve comunque scaricare l'immagine a grandezza naturale e quindi utilizzare il CSS per ridimensionarla per la visualizzazione. Ciò può comportare prestazioni del sito web più lente.

Suggerimento Pro: Hai molti commenti e Gravatar da visualizzare nei tuoi post del blog? Considera il caricamento pigro dei tuoi Gravatar per rendere il tuo sito web più veloce.

Metodo 4: Modifica la dimensione di Gravatar per le biografie degli autori con il codice

Se gestisci un sito WordPress multi-autore, una casella autore può aiutare i lettori a saperne di più sull'autore del post.

Se vuoi aggiungere questa funzionalità al tuo sito web, consulta la nostra guida su come aggiungere una casella informazioni autore nei post di WordPress.

Molte biografie degli autori mostrano il Gravatar dello scrittore insieme alla loro biografia. Per modificare la dimensione predefinita di Gravatar nelle caselle della biografia dell'autore, è necessario trovare il file del tema che aggiunge la biografia.

Connettiti semplicemente al tuo sito utilizzando un client FTP come FileZilla o il file manager del tuo hosting WordPress. Una volta connesso, vai su /wp-content/themes/ e apri la cartella del tuo tema WordPress corrente.

Successivamente, devi aprire la cartella template-parts.

Modifica delle parti del modello in un tema WordPress utilizzando un client FTP

Ora devi trovare il file che contiene il codice get_avatar. Spesso troverai questo codice in un file template part chiamato author-bio.php, single.php, file functions.php, o simili.

Ecco un esempio di come potrebbe apparire questo codice:

<div class="author-bio <?php echo get_option( 'show_avatars' ) ? 'show-avatars' : ''; ?>">
        <?php echo get_avatar( get_the_author_meta( 'ID' ), '85' ); ?>

Nello snippet sopra, puoi semplicemente cambiare il numero 85 con la dimensione che desideri utilizzare.

In altri temi, il codice potrebbe apparire così:

get_avatar( get_the_author_meta( 'user_email' ), 85);

Puoi semplicemente sostituire il numero con il valore che desideri utilizzare per rendere il Gravatar più grande o più piccolo.

Dopo aver modificato la dimensione, non dimenticare di salvare le modifiche. Puoi quindi visitare il tuo sito web per vedere la nuova casella biografia autore in azione.

Se i Gravatar non sono cambiati, dovrai cercare la classe avatar nel file style.css seguendo lo stesso processo descritto nel Metodo 3. Una volta trovata questa classe, puoi creare un nuovo snippet WPCode e inserire i nuovi valori di altezza e larghezza del Gravatar.

Scopri altri modi per migliorare la tua sezione commenti

Vuoi portare i tuoi commenti WordPress al livello successivo? Dai un'occhiata a queste guide per personalizzare la tua sezione commenti:

Speriamo che questo tutorial ti abbia aiutato a imparare come cambiare la dimensione dell'immagine Gravatar in WordPress. Potresti anche voler imparare come stilizzare il modulo commenti di WordPress o dare un'occhiata alla nostra lista dei migliori plugin WordPress per i commenti.

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

Dichiarazione: Il nostro contenuto è supportato dai lettori. Ciò significa che se fai clic su alcuni dei nostri link, potremmo guadagnare una commissione. Vedi come è finanziato WPBeginner, perché è importante e come puoi supportarci. Ecco il nostro processo editoriale.

Il Toolkit WordPress Definitivo

Ottieni l'accesso GRATUITO al nostro toolkit - una raccolta di prodotti e risorse relative a WordPress che ogni professionista dovrebbe avere!

Interazioni del lettore

4 CommentsLeave a Reply

  1. E finalmente conosco il significato delle immagini Gravatar.
    immagini riconosciute a livello globale, ha senso dato che è stato creato per essere usato ovunque.
    Ero solito confondere Gravatar con qualsiasi immagine utilizzata dall'autore di un post particolare.
    Ma è anche per i commentatori che commentano determinati post per mostrare il Gravatar.
    Grazie a wpbeginner per questa spiegazione della terminologia.

  2. Grazie per questo tutorial. Il mio tema è molto minimalista e semplice ma gli elementi grafici, e tutto ciò, sono importanti per le mie ragioni estetiche. L'unico problema erano le immagini dei commentatori. Erano troppo piccole e sembravano quasi un errore. Grazie a questa guida, posso risolvere il problema e migliorare l'aspetto di tutto.

Lascia una risposta

Grazie per aver scelto di lasciare un commento. Tieni presente che tutti i commenti sono moderati secondo la nostra politica sui commenti, e il tuo indirizzo email NON verrà pubblicato. Si prega di NON utilizzare parole chiave nel campo del nome. Avviamo una conversazione personale e significativa.