Widget degli Ultimi Commenti nativo di Blogger

Come installare in modo nativo il widget dei Commenti Recenti, Recent Comments, in Blogger usando il gadget dei Feed e personalizzandolo con i CSS e effetto Hover.

In realtà non esiste un gadget nativo di Blogger per gli Ultimi Commenti così come non esiste per gli Ultimi Post. Seguendo però la falsariga di quanto già visto per il gadget degli Ultimi Articoli, vediamo come utilizzare un widget originale di Blogger per creare il gadget dei Commenti Recenti, che poi potremo anche personalizzare nell'aspetto.

La ragione della scelta di un gadget minimalista e senza javascript esterni, è quasi obbligata dal rendere il più veloce possibile l'apertura delle pagine del nostro sito, eliminando quindi gli elementi che lo rallenterebbero troppo. Ricordo infatti che la velocità di caricamento di una pagina, è uno dei più di 200 fattori di ranking, per il posizionamento nei risultati di ricerca di Google.

Gli amministratori dei siti sono quindi in un certo senso costretti a limitarsi ad installare solo i widget strettamente indispensabili. Il gadget dei Commenti Recenti non sarebbe proprio necessario ma, almeno per quanto mi riguarda, mi permette di visualizzare rapidamente gli ultimi commenti ricevuti, per poi procedere alle risposte. Naturalmente lo si può fare anche dalla Bacheca -> Commenti oppure usando un lettore di feed come Feedly, a cui sia stato aggiunto il feed dei commenti del nostro blog.

Per creare il widget dei Commenti Recenti, si utilizza il gadget Feed come abbiamo già fatto per quello degli Ultimi Articoli. Ricordo che l'URL dei Feed degli Ultimi Commenti per un blog su Blogger è

http://nomeblog.blogspot.com/feeds/comments/default

Se si è attivata la Connessione HTTPS diventa così

https://nomeblog.blogspot.com/feeds/comments/default

Per un dominio personalizzato con connessione HTTPS, l'URL dei Feed dei commenti è

https://nomedominio.ext/feeds/comments/default.

Naturalmente le stringhe colorate di rosso e viola debbono essere personalizzate con nome del dominio e estensione dello stesso. Al posto di default talvolta conviene mettere summary per avere elementi di feed che si aprono con l'URL senza stringhe aggiunte che disperderebbero le condivisioni sociali.

In conclusione si deve partire da un URL dei feed generico come questo

https://nomeblog.blogspot.com/feeds/comments/summary

Si va su Layout -> Aggiungi un gadget, preferibilmente selezionato nella sidebar. In Base si seleziona il gadget Feed e  si procede alla sua configurazione. Si incolla l'URL dei feed dei commenti e si va su Continua. Provate con entrambe le opzioni summary e default per controllare quella che mostra effettivamente gli ultimi commenti.

Verrà aperta un'altra finestra in cui personalizzare il widget per quel poco che si può.

Il titolo del widget di default sarà il nome del blog. Occorrerà quindi cambiarlo con Ultimi Commenti o Commenti Recenti o qualsiasi altra espressione. Si possono scegliere al massimo 5 elementi. Oltre all'incipit del commento, si potrà opzionalmente mostrare anche il nome del suo autore e la data di pubblicazione. È anche possibile far aprire il link in un'altra scheda del browser.

Si va su Salva e si posiziona il widget con il trascinamento del cursore. Avrà questo aspetto

in verità molto anonimo. Vediamo come renderlo esteticamente più efficace con i CSS. Se avete già installato anche il widget degli Ultimi Post con questa procedura, allora l'ID di questo widget sarà Feed2 mentre se non lo avete fatto, l'ID di questo gadget sarà Feed1. Si può sempre controllare andando su Modifica e visualizzando l'ultima stringa dell'URL della finestra. Chi avesse difficoltà può consultare il post sugli ID dei Widget di Blogger.

Per aggiungere un effetto hover, si va su Tema -> Modifica HTML e si cerca la riga ]]></b:skin> nella sezione <b:skin> quindi, subito sopra a questa, si incolla il seguente codice

#Feed2 li{list-style-image:  url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhBL-uV87FVVmTrT9DXtcEJVywU2lq_56MicxSmOyGd5eHHWLp5qQ8qtH9QblHAtEeGTltAtfL83nXOXXdvGS_QjPQh1E75duJSh8L3fRdpu4RqPsTR_fXw0Bl-9vHmPA2T41TYAb9N78g/s10/check.png);}
#Feed2 li:hover {list-style-image:  url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg2eUIpgg37sUab9IF5no7ui3P58FnuZTTu9QvY-qVn14D9WRT60PUCk7vn5lZIuPEx6XQySFDjOMdqQFgN9r_pWKNSYb9B-AxKPJJ1UkOr-y75R9cROCUnmSAUdsn4sanu1qBSaNb59z4/s10/red-check.png);}
#Feed2 li span a {font-weight:bold;}

Si salva il Tema. Ho considerato che fosse già stato inserito il gadget degli Ultimi Post con questo sistema e che quindi l'ID del widget fosse Feed2. I colori dei link saranno ereditati dal blog e il widget avrà questo aspetto.

L'elenco dei commenti avrà delle icone verdi come marcatori che diventeranno rosse al passaggio del cursore. Le immagini delle icone hanno l'URL colorato di rosso e possono essere sostituite da altre. L'ultima riga del codice evidenziata di giallo serve per mostrare i commenti in grassetto e può essere tralasciata.