Come aggiungere le emoticon animate (smiley) nei commenti di un blog su Blogger.

Per inserire le emoticons o smilies che dir si voglia all’interno di un post si possono utilizzare due metodi

1)Usare Windows Live Writer e scaricare dei plug-in adatti al caso come quello che permette di inserire le emoticon di Live Space oppure quello per gli smilies di MSN e Yahoo.
2)Se non si usa WLW possiamo utilizzare il metodo illustrato in questo articolo

Per quanto riguarda i commenti la cosa è in linea di massima impossibile senza modificare il template.
La modifica che bisogna fare consiste nell’inserire uno script che sostituisca automaticamente delle combinazioni di segni ortografici con le corrispondenti immagini animate. Il lavoro è stato fatto dal blog citato a piè di pagina e mi sono limitato a

1. Caricare le immagini in GIF delle emoticon sul mio account Skydrive
2. Modificare il codice con i nuovi URL delle immagini
3. Caricare il codice su Google Sites
4. Modificare lo script sempre con i nuovi URL e caricarlo su Google Sites

Dico subito che la personalizzazione funziona su Firefox, Chrome e Opera mentre non si vede in Explorer, d’altra parte in IE non funziona mai niente . Mi stupisco che ci sia ancora chi si ostina a usarlo.
Prima di iniziare la procedura ancora due precisazioni

1. Se qualcuno avesse fatto la personalizzazione dei commenti dell’autore del blog come spiegato in questo post deve effettuare il percorso inverso e togliere il codice che aveva immesso sostituendolo con quello che c’era prima. Nell’articolo citato ci sono entrambi i blocchi di codice
2. Andare in Blogger in Draft e verificare che i nostri commenti siano effettivamente visualizzati sotto il post. Il percorso è Personalizza > Impostazioni > Commenti > Posizionamento modulo dei commenti > Incorporato sotto il post (Mettere segno di spunta e salvare le impostazioni)
   

Adesso andare in Layout > Modifica HTML e scarica modello completo per un eventuale back-up. Espandere i modelli widget e cercare, pigiando su F3 o Ctrl+F, la seguente riga di codice

<b:if cond='data:post.embedCommentForm'>

ed immediatamente sotto incollare il codice che prima avete selezionato e copiato da questa pagina.
Le personalizzazioni da fare sono due come evidenziato in questo screenshot

1. Il colore dello sfondo del rettangolo in cui si visualizzeranno le emoticon sopra il modulo dei commenti. Ho inserito #ffffff che significa colore bianco ma può essere variato a seconda dei colori del vostro blog
2. width: 65% – E’ la larghezza in percentuale del riquadro delle emoticon. Questo è un dato fondamentale e dipende molto dal tipo di modello. Nel caso di questo blog tale valore permette di visualizzare le emoticon su due linee. Ma se avete un modello più stretto il valore deve essere cambiato. Le emoticon volendo si possono visualizzare anche su tre linee, questo per chi ha un modello con i post molto stretti. Se non siete sicuri cominciate con 100% per poi diminuire fino ad arrivare alla percentuale giusta. Questo va fatto naturalmente in un secondo momento.

Andate proprio alla fine del modello dove troverete la tag </body> e, subito sopra, inserite il seguente codice

<script src='http://www.mdn.fm/files/112492_zgc4b/smiley2.js' type='text/javascript'/> 
<noscript><a href='http://www.ideepercomputeredinternet.com' target='_blank'><span style='font-size: x-small;'>Add emoticons</span></a></noscript>

come mostrato in quest’altro screenshot

Non resta che Salvare il Modello. Quando nei commenti saranno presenti delle combinazioni di segni ortografici che sono sulla destra di ogni singola emoticon in fase di visualizzazione dei commenti saranno sostituiti con le faccine di Yahoo. Bisogna attendere che si carichi completamente la pagina prima di vedere la metamorfosi

Il commento :)):|:) dopo essere stato pubblicato diventa così

Ultime considerazioni  

1) Mi sono accorto solo a lavoro ultimato che una delle emoticon ha nella combinazione di segni anche la tilde ~. Se me ne fossi accorto prima magari la sostituivo con un segno di più facile accessibilità. Di rimettere mano al codice e allo script per una cosa di questo genere non me la sento. Coloro che volessero utilizzare l’emoticon con quel segno per digitare la tilde sul modulo dei commenti di Blogger devono inserire 126 col tastierino numerico tenendo premuto Alt.

2) Lo script è retroattivo, nel senso che se in qualche commento del passato è presente una combinazione uguale a quelle previste allora apparirà l’emoticon anche nel relativo commento.

3) Una modesta considerazione linguistica. In italiano credo che si debba scrivere sempre e comunque emoticon e smiley (e non emoticons e smilies) anche al plurale. Non mi va però di correggere la prima riga del post .

4) Se si usa come commenti la pagina popup oppure la pagina intera allora seguite le indicazioni dell'articolo su come inserire le animoticon.

Fonte | Bloggerstop -

Aggiornamento importante: a seguito di commenti in cui mi si faceva notare che lo script non funzionava, ho caricato tutto su un altro hosting, consultate quindi quest'altro articolo.
Aggiornamento n°2: Nei modelli con commenti nidificati è opportuno seguire il tutorial per le faccine di Facebook  o quello per le emoticon animate di Facemoods.