{"id":498,"date":"2011-12-25T03:58:18","date_gmt":"2011-12-25T01:58:18","guid":{"rendered":"https:\/\/tulipemedia.com\/?p=498"},"modified":"2025-05-15T17:59:44","modified_gmt":"2025-05-15T15:59:44","slug":"buddypress-linker-avatar-in-miniatura-per-limmagine-a-dimensione-intera","status":"publish","type":"post","link":"https:\/\/tulipemedia.com\/it\/buddypress-linker-lavatar-miniature-vers-limage-en-taille-reelle\/","title":{"rendered":"Buddypress: collega l'avatar in miniatura all'immagine a grandezza naturale"},"content":{"rendered":"

Se c'\u00e8 una cosa che spesso mi viene chiesto di personalizzare su un social network costruito con il CMS Buddypress<\/strong>, \u00e8 un'ottima gestione degli avatar. C'\u00e8 infatti da un lato il fatto che l'avatar si collega sempre alla pagina gi\u00e0 aperta, cosa di per s\u00e9 inutile, e dall'altro le sue dimensioni, che non possono essere facilmente personalizzate per un non esperto.<\/p>\n

<\/p>\n

Ti spiegher\u00f2 quindi semplicemente come fare in modo che l'avatar non si colleghi pi\u00f9 al profilo quando sei gi\u00e0 nella pagina del profilo ma piuttosto all'immagine che funge da avatar, e poi come modificare le dimensioni native degli avatar per consentire un avatar da aprire in dimensioni maggiori quando cliccato (mi segui?!).<\/p>\n

1. Come collegare l'avatar alla sua immagine a dimensione intera<\/h3>\n

membri-intestazione.php<\/p>\n

Vai al tuo file intestazione-membro.php<\/strong> (situato nella cartella members\/single\/ del tuo tema Buddypress). Una volta in questo file, trova la riga di codice corrispondente a questa:<\/p>\n

<a href="\/it\/ »\/" 1000 »><\/em><\/p>\n

<?php bp_displayed_user_avatar( ‘type=full’ ); ?><\/em><\/p>\n

<\/a><\/em><\/p>\n

Sostituisci questo codice con questo:<\/p>\n

<a href="\/it\/ »\/" 1000 »><\/em><\/p>\n

<?php bp_displayed_user_avatar( ‘type=full&width=150&height=150’ ) ?><\/em><\/p>\n

<\/a><\/em><\/p>\n

Come puoi vedere, qui usiamo la funzione bp_core_fetch_avatar<\/strong>, con l'attributo 'html' => falso<\/em>, che permette evidenziare l'URL dell'avatar<\/strong>, senza il linguaggio HTML associato ( <img src =\u2026).<\/p>\n

Carica il file members-header.php.<\/p>\n

Una volta eseguito questo passaggio, il tuo avatar dovrebbe normalmente collegarsi all'immagine e non pi\u00f9 al profilo. Ora resta da modificare le dimensioni dell'avatar, in modo da mantenere l'avatar in miniatura per la lista dei profili, ma avere un avatar leggermente pi\u00f9 grande quando cliccato.<\/p>\n

2. Come modificare le dimensioni dell'avatar in Buddypress<\/h3>\n

funzioni.php<\/p>\n

Per fare ci\u00f2, niente di pi\u00f9 semplice, vai al tuo file di funzioni (functions.php) per aggiungere queste righe di codice:<\/p>\n

if (!definito('BP_AVATAR_THUMB_WIDTH'))<\/em>
\ndefine('BP_AVATAR_THUMB_WIDTH', 50 ); \/\/Inserisci la larghezza che desideri per la dimensione della miniatura<\/em>
\nif (!definito('BP_AVATAR_THUMB_HEIGHT'))<\/em>
\ndefine('BP_AVATAR_THUMB_HEIGHT', 50 ); \/\/Altezza delle dimensioni in miniatura<\/em>
\nif (!definito('BP_AVATAR_FULL_WIDTH'))<\/em>
\ndefine('BP_AVATAR_FULL_WIDTH', 400); \/\/Larghezza della dimensione effettiva<\/em>
\nif (!definito('BP_AVATAR_FULL_HEIGHT'))<\/em>
\ndefine('BP_AVATAR_FULL_HEIGHT', 400); \/\/Altezza della dimensione effettiva<\/em><\/p>\n

Usando questo pezzo di codice, imposti la dimensione reale degli avatar su 400*400 e la dimensione degli avatar in miniatura su 50*50.<\/p>\n

3. Estensioni e commenti<\/h3>\n

Puoi facilmente aggiungere un attributo di tipo "lightbox", ad esempio tramite rel="lightbox", se hai un plugin che gestisce questo tipo di cose. Ci\u00f2 far\u00e0 caricare i tuoi avatar in un modo leggermente pi\u00f9 sexy.<\/p>\n

Inoltre vi rimando agli attributi della funzione\u00a0bp_displayed_user_avatar('tipo=pieno&larghezza=150&altezza=150')<\/em>\u00a0: come puoi vedere, abbiamo scelto di visualizzare l'avatar \u201cfull\u201d, cio\u00e8 a grandezza reale, ma ridimensionando l'output, in modo che nella pagina del profilo, abbiamo un'immagine di dimensione intermedia.<\/p>\n

Questo metodo \u00e8 sicuramente sconsigliato dal punto di vista della velocit\u00e0 di caricamento della pagina, ma evita di aggiungere una nuova dimensione all'immagine per gli avatar. Puoi comunque giocare con questi attributi, scegliendo di mettere 'type=thumb' anzich\u00e9 full nei posti che preferisci.<\/p>\n

Conclusione: il tuo social network mette in risalto le foto del profilo<\/h3>\n

Grazie a questo metodo, gli avatar dei tuoi membri ora si collegano a immagini pi\u00f9 grandi, il che \u00e8 molto pi\u00f9 pratico per gestire le reti in cui la foto del profilo \u00e8 importante.<\/p>","protected":false},"excerpt":{"rendered":"

S’il y a une chose qu’on me demande souvent de personnaliser sur un r\u00e9seau social b\u00e2ti avec le CMS Buddypress, c’est bien la gestion des avatars. En effet, il y a d’une part le fait que l’avatar linke toujours vers la page d\u00e9j\u00e0 ouverte, ce qui est en soit inutile, et d’autre part sa taille, […]<\/p>\n","protected":false},"author":17,"featured_media":467,"comment_status":"open","ping_status":"closed","sticky":false,"template":"","format":"chat","meta":{"footnotes":""},"categories":[7],"tags":[164],"class_list":["post-498","post","type-post","status-publish","format-chat","has-post-thumbnail","hentry","category-buddypress","tag-tips-wordpress","post_format-post-format-chat"],"_links":{"self":[{"href":"https:\/\/tulipemedia.com\/it\/wp-json\/wp\/v2\/posts\/498","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/tulipemedia.com\/it\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/tulipemedia.com\/it\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/tulipemedia.com\/it\/wp-json\/wp\/v2\/users\/17"}],"replies":[{"embeddable":true,"href":"https:\/\/tulipemedia.com\/it\/wp-json\/wp\/v2\/comments?post=498"}],"version-history":[{"count":1,"href":"https:\/\/tulipemedia.com\/it\/wp-json\/wp\/v2\/posts\/498\/revisions"}],"predecessor-version":[{"id":4227,"href":"https:\/\/tulipemedia.com\/it\/wp-json\/wp\/v2\/posts\/498\/revisions\/4227"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/tulipemedia.com\/it\/wp-json\/wp\/v2\/media\/467"}],"wp:attachment":[{"href":"https:\/\/tulipemedia.com\/it\/wp-json\/wp\/v2\/media?parent=498"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/tulipemedia.com\/it\/wp-json\/wp\/v2\/categories?post=498"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/tulipemedia.com\/it\/wp-json\/wp\/v2\/tags?post=498"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}