Come potete vedere nella foto qui sopra, ho arricchito il post,
con un popup che appare sul nome della persona di cui ho linkato il profilo di Google+. Cosa che permette di dare una faccia alla persona citata, oltre che la possibilità di accerchiarlo, nel caso si usi Google+ come social network.
Obiettivamente è una cosa che mi piace molto. E non causa alcun bisogno di importare nuovi script, in quanto
è già tutto compreso nel codice del +1, quindi aggiungere questa nuova funzionalità vi costerà non più di qualche byte.
Ho scoperto questa possibilità casualmente, leggendo
Our Fragile Web of Dead Domains and Lapsing Links di
+Louis Gray. All'interno di questo post ho notato che ha scritto i nomi di alcune persone con il + davanti come si fa su Google+ e andandoci sopra con il mouse, ho visto il magico popup.
La prima cosa che ho fatto è stato andare nella
documentazione, ma non ho trovato il modo di creare questo popup, e quindi mi sono messo a studiare il codice per cercare di capire come funzionava. Ed obiettivamente il funzionamento è molto semplice. Ecco di cosa avete bisogno
<script type="text/javascript" src="https://apis.google.com/js/plusone.js"></script>
<a class="g-profile" href="https://plus.google.com/118189881018247483156">nome cognome </a>
Le regole per implementare il popup sono tre:
- in pagina ci deve essere il riferimento al javascript del +1 https://apis.google.com/js/plusone.js. Se lo avete già inserito, non serve ripeterlo per avere il popup
- sul link ci deve essere la classe g-profile
- il link al profilo di google+ deve essere canonico
In particolare la terza regola è molto importante.
Se il link non è canonico, non funziona.
Per Louis Gray avrei anche potuto mettere la sua vanity url
https://plus.google.com/+LouisGray/, ma non avrebbe funzionato. Come non avrebbe funzionato inserire il link con lo slash finale
https://plus.google.com/100535338638690515335/ o anche la forma
https://plus.google.com/u/0/100535338638690515335.
L'unica forma consentita è https://plus.google.com/{profileId}, dove per {profileId} va inserito l'id dell'utenza Google+.
Potete provare live, la funzionalità lasciando il mouse per un secondo sopra il mio nome in cima alla pagina, oppure sul nome di Louis Gray o su quello di Enrico Altavilla qui sotto. Trovo che sia utile ai fini dell'usabilità scrivere il nome all'interno del link con il + davanti come si fa su Google+.
Ringrazio
+Enrico Altavilla, per aver fatto inconsapevolmente da cavia per i miei test con il suo profilo e per aver fatto da modello per l'immagine di questo post. :-)
Un ulteriore doppio ringraziamento va a
+Andrea Pernici. Il primo ringraziamento è per avermi segnalato un errore nel codice che avevo scritto qui sopra. Il secondo è per aver fatto ulteriori esperimenti sulla funzionalità, scoprendo che è possibile applicare il link non solo ad un testo, ma anche ad una immagine con o senza testo nell'ALT. Potete provare live i suoi esperimenti sul suo post sull'
Ottimizzazione sui motori di ricerca. Potete vedere in alto a destra accanto al nome dell'autore del post le iconcine dei suoi profili social. Sull'ultima iconcina, quella di g+, potete vedere il popup del profilo dell'autore. Inoltre se scorrete il post, nella parte in cui ci sono i pareri di vari professionisti, potete vedere il badge apparire sulla foto di
+Martino Mosna.