Come recuperare l'URL dell'immagine Gravatar

Avere una foto del profilo nota anche come "immagine avatar" è piuttosto essenziale online. Carichiamo la nostra migliore immagine del profilo su siti Web e siti sociali per legittimità, credibilità e per le persone a riconoscere meglio la nostra presenza online.

WordPress ha il proprio servizio per fornire immagini del profilo utente, ed è chiamato Gravatar. Possiamo anche incorporarlo nei nostri temi personalizzati. Questo post ti guiderà attraverso un paio di approcci su come recuperare l'immagine del profilo da Gravatar.

Utilizzando Gravatar

Iniziamo dalle basi. WordPress ha una speciale funzione integrata, get_avatar, che ci permette di recuperare l'immagine gravatar. Questa funzione richiede due parametri: l'ID utente o e-mail e la dimensione dell'immagine da visualizzare. Ecco un esempio.

 $ user_id = get_the_author_meta ('ID'); echo get_avatar ($ user_id, 80); 

Se preferisci usare una email utente, compila la funzione get_the_author_meta() con user_email :

 $ user_id = get_the_author_meta ('user_email'); echo get_avatar ($ user_id, 80); 

Entrambi gli esempi produrranno lo stesso risultato: un'immagine avatar utente con la dimensione di 80px . Nel mio caso, vedrò la mia foto.

Tuttavia, il problema che una volta ho incontrato con questa funzione è che la funzione genera l'intera immagine; un pieno etichetta. Ispeziona la sorgente del codice e dovresti trovarla come segue:

Ciò rende le cose un po 'complicate per noi, per esempio, per inserire classi aggiuntive o un ID nel .

In alternativa, possiamo recuperare solo l'URL dell'immagine, anziché il elemento in pieno. Una volta ottenuto l'URL, possiamo aggiungerlo al con le classi personalizzate o l'ID aggiunto.

Come recuperare l'URL dell'immagine

Per prima cosa, dovremo creare una nuova funzione PHP in functions.php del tema WordPress che stai utilizzando. Diamo il nome alla funzione come segue:

 function get_avatar_img_url {} 

Recupero dell'immagine Gravatar richiede l'email dell'utente; assicurati che l'email sia stata registrata in Gravatar per vedere l'output. Chiama l'email dell'utente dell'autore, in questo modo.

 function get_avatar_img_url {$ user_email = get_the_author_meta ('user_email'); } 

L'URL dell'immagine di Gravatar è specificato con http://gravatar.com/avatar/ e seguito da hash md5 (valore codificato) dell'indirizzo email. Per restituire l'indirizzo email in un valore "md5 hash", possiamo usare la funzione built-in di PHP, md5() . Quindi abbiamo impostato l'URL dell'immagine di Gravatar in questo modo:

 function get_avatar_img_url {$ user_email = get_the_author_meta ('user_email'); $ url = 'http://gravatar.com/avatar/'. md5 ($ user_email); } 

Successivamente dobbiamo includere un paio di parametri obbligatori nell'URL che sono la dimensione dell'immagine e l'immagine di fallback predefinita se l'immagine non è registrata in Gravatar. Per farlo, useremo una funzione di WordPress chiamata add_query_arg.

 function get_avatar_img_url () {$ user_email = get_the_author_meta ('user_email'); $ url = 'http://gravatar.com/avatar/'. md5 ($ user_email); $ url = add_query_arg (array ('s' => 80, 'd' => 'mm', ), $ url); restituisce esc_url_raw ($ url); } 

Questa funzione add_query_arg aggiungerà parametri alla fine dell'URL. Nel nostro caso, produrrà ?s=80&d=mm che imposta la dimensione dell'immagine su 80pixel e imposta l'avatar predefinito su mm (Mystery Man).

Ora basta usare PHP echo per emettere l'URL all'interno di elemento, così:

 $ avatar_url = get_avatar_img_url (); eco '  '; 

Come abilitare il dimensionamento della casella in Internet Explorer 7 [Quicktip]

Abbiamo coperto il dimensionamento della scatola CSS3 in un precedente articolo. Il dimensionamento della scatola, con il valore di border-box, ci consente di mantenere la larghezza e l'altezza dell'elemento, indipendentemente dal riempimento e dal bordo aggiuntivi.Ciò semplifica la misurazione e la definizione della dimensione dell'elemento .

(Consigli tecnici e di design)

Il pulsante di avvio consente di scoprire nuove avvii con un semplice clic

Sembra che una nuova startup venga lanciata ogni giorno, mentre il settore tecnologico è in piena espansione e ci sono molti strumenti per supportare più startup negli anni a venire.Se ami scavare nella nuova tecnologia allora ti piacerà davvero il pulsante Startup. È una galleria gratuita di nuove aziende di startup che puoi consultare per data e categoria.Ma

(Consigli tecnici e di design)