Come mostrare un messaggio nei commenti nidificati di Blogger.

Come posizionare sempre sopra al modulo dei commenti un messaggio per i lettori di un blog su Blogger. Come personalizzarlo inserendo una icona, modificandone il colore, la dimensione e la famiglia dei font.

Nel post precedente ho illustrato come inserire un messaggio prima del modulo dei commenti nei blog su piattaforma Blogger. Se sono stati attivati i commenti nidificati, tale messaggio verrà visualizzato alla fine di questi ultimi e solo il primo commentatore lo potrà leggere posizionato nel modo corretto.

L'autore del blog vietnamita Duy Pham ha trovato la soluzione a questo problema permettendoci di mostrare il messaggio sempre sopra al modulo dei commenti in qualunque punto venga visualizzato. Ricordo infatti che il box dei commenti, oltre che alla fine, può essere visto anche in mezzo quando si clicca su Rispondi per continuare una discussione con un commentatore.

Andate su Modello > Backup/Ripristino e salvate il modello completo per tenere da parte una copia di sicurezza. Tornate su Modello > Modifica HTML > Procedi e mettete la spunta a Espandi i modelli widget. Digitate F3 o Ctrl+F per cercare la riga seguente

<b:includable id='threaded-comment-form' var='post'>

Scorrete il codice fino a trovare i due tag mostrati nello screenshot 

1. Subito dopo  <b:else/> va incollata la riga <div id='threaded-comment-form'>
2. Subito prima di </b:if> va incollato il tag </div>

Come mostrato in questo nuovo screenshot

Adesso sempre andando su F3 o su Ctrl+F si cerca la riga

document.getElementById(domId).insertBefore(replybox, null);

che si sostituisce con quest'altra

document.getElementById (domId). insertBefore (document.getElementById ('threaded-comment-form'), null);

come si può vedere in questo ultimo screenshot

Finalmente si salva il modello. Se abbiamo inserito un messaggio andando su Impostazioni > Post e Commenti > Messaggio del modulo dei commenti > Modifica, questo si visualizzerà sopra al box dei commenti da tutti i lettori anche se hanno cliccato su Rispondi

In tale scritta possono essere inseriti i tag per il grassetto e per il corsivo. Vediamo come si possa anche modificarne il colore, la dimensione e la famiglia di caratteri. Si va sempre su Modello > Modifica HTML > Procedi e si cerca la riga ]]></b:skin>. Subito sopra si può incollare questo codice

#threaded-comment-form p {
color:#D84938;
font-family:Arial;
padding-left:12px;
background: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjrBxBjAUdcFknxXACTlAgosDfIcZjO1ca6tKNv8F7yEfXWR-EGXYMNb_qOxhIueMY0ahBSaSvqGahk79cht83cTpmxeWVKSsoLVzHTkM3m3llhTRtgVws7YYQFazdqzLI7FL7dT6yBhjgQ/s10/check.png) 0px 6px no-repeat;
}

Dopo aver salvato il modello, il messaggio prenderà questo aspetto

I parametri in rosso possono essere modificati a piacere, le righe che non interessano possono essere tralasciate e si può d'altra parte aggiungere altro codice per personalizzare il testo in modo diverso.