Pubblicato il 03/07/10 - aggiornato il  | 26 commenti :

Come inserire una favicon in Blogger visibile anche con Internet Explorer.

La favicon è quella piccola immagine che compare accanto all'indirizzo nella barra del browser. Se si mette un sito nei Preferiti si visualizza anche in quel menù e permette di far risaltare meglio i siti e caratterizzarli per un migliore riconoscimento.

favicon

Questa personalizzazione è comunque un arricchimento per il blog e fa una buona impressione sui visitatori. I siti che hanno un'immagine al posto della anonima B di Blogger guadagnano già dei punti di primo acchito.

C'era il fatto che questa personalizzazione non era facile visualizzarla con Internet Explorer, anzi era praticamente impossibile per i blog su Blogger. Il problema risiedeva nella mancata conversione dei file immagine in file .ico. Vediamo come procedere per inserire una favicon visibile anche con IE8.

Occorre innanzitutto scaricare il programma @icon sushi che può anche essere fatto da qui nella sua versione Installer. Dopo l'installazione occorre scegliere l'immagine da mettere come favicon. E' meglio che sia quadrata e che abbia una dimensione di 16x16 pixel o, alternativamente, di 32x32 pixel.

Aprire @icon sushi e cliccare su File > Open per selezionare il file immagine da convertire. Supporta molti formati ma non quello GIF. Per la conversione in file .ICO occorre cliccare sulla seconda icona da destra "Save as Single Icon"  e scegliere la cartella di destinazionefavicon-@icon-sushi

Il file salvato sarà del tipo nome-favico.ico e dovrà essere caricato sul web. Non sono molti i servizi che supportano questo formato. Per esempio Picasa non lo accetta. E' invece possibile archiviarlo su Skydrive e acquisirne l'URL.

Adesso bisogna fare una piccola modifica al modello. Andare quindi si Design > Modifica HTML e cercare la riga </head>. Immediatamente sopra incollate il seguente codice

<!--FAVICON INIZIO-->
<link href='http://public.blu.livefilestore.com/y1pPDjpYj5ClPF6ZYlGOLH4W9bBBdnargM9dkAbuPsKt_pjlr12l_vp62pLvTLVjLZ7sV7wRe9CVAvkyGPJW8zWEA/parsifal32.ico' rel='shortcut icon'/>
<link href='http://public.blu.livefilestore.com/y1pPDjpYj5ClPF6ZYlGOLH4W9bBBdnargM9dkAbuPsKt_pjlr12l_vp62pLvTLVjLZ7sV7wRe9CVAvkyGPJW8zWEA/parsifal32.ico' rel='icon'/>
<!--FAVICON FINE-->

Salvate il modello. Alcune considerazioni finali:

  1. Al posto dell'indirizzo della mia favicon evidenziato di rosso inserite quello della vostra immagine in entrambe le righe del codice
  2. L'indirizzo che dà Skydrive era il seguente e contiene un'altra stringa dopo l'URL vero e proprio
     http://public.blu.livefilestore.com/y1pPDjpYj5ClPF6ZYlGOLH4W9bBBdnargM9dkAbuPsKt_pjlr12l_vp62pLvTLVjLZ7sV7wRe9CVAvkyGPJW8zWEA/parsifal32.ico?psid=1
    Ho testato il funzionamento sia mantenendo la parte finale dopo l'estensione ico che togliendola e la favicon si vede in entrambi i casi. Quindi fate un po' come vi pare
  3. Non si possono caricare immagini animate perché il formato ICO non le supporta
  4. La favicon sarà visibile in Firefox, Internet Explorer e Opera ma non in Chrome e Safari. In ogni caso i tre browser supportati rappresentano circa il 90% del mercato.
  5. Si possono creare ed inserire in un blog su Blogger anche favicon animate o con testo scorrevole ma queste saranno visibili solo con Firefox e Opera.
  6. Al posto del programma @icon sushi può essere usato uno dei tanti tool online per creare favicon come, per esempio, Favicon.cc con cui possiamo disegnarcela da soli oppure generarla da una immagine del computer.




26 commenti :

  1. Ciao Parsifal,

    ho seguito le tue istruzioni ma non compare alcuna favicon accanto all'URL del mio blog (Mystery & other), né con Firefox né con IE.

    RispondiElimina
  2. @emanuele
    Non saprei che dirti. Come vedi nel mio blog questo codice funziona sia con Firefox che con IE.
    Forse dipende dal modello.
    Ciao

    RispondiElimina
  3. Capisco, ti ringrazio comunque per la risposta.

    RispondiElimina
  4. Ho trovato nell'Help forum di Chrome come far apparire la favicon su Chrome:
    How do i get my custom blogger favicon to show up in chrome
    Basta inserire questo codice: type='image/x-icon'

    RispondiElimina
  5. Ciao Parsifal,
    ho seguito le tue istruzioni e per tre giorni ho vistto la favicon. Oggi è sparita e non riesco più a rimetterla. Hai idea di cosa può essere successo? Grazie e ciao.

    RispondiElimina
  6. Ho risolto il problema caricando il favicon su fileden (non so perchè ma su skydrive mi nascevano conflitti). Grazie ancora e ciao

    RispondiElimina
  7. @Stefano
    Cerca di usare DropBox che è il migliore per queste cose. Eccoti l'invito di iscrizione
    Qui sotto c'è il post di istruzioni per l'uso
    http://www.ideepercomputeredinternet.com/2010/11/dropbox-per-condividere-file-con-piu.html

    RispondiElimina
  8. Grazie. Non l'ho mai utilizzato. Lo provo subito

    RispondiElimina
  9. Ciao Parsifal,volevo ringraziarti per questo utilissimo post ,che ho subito messo in pratica.Mi si vede benissimo,l'unica cosa è che se vai nel menù-commenti,quando si carica,lì la B di blogger rimane ancora.Poi un'altra cosa,quando ci rimandi al link di skydrive,un messaggio dice che quel collegamento non c'è più,e ti rimandano loro alla pagina iniziale.Se vuoi dare un occhio,il mio indirizzo è questo : www.imanicarettidiannare.com

    RispondiElimina
  10. @Anna
    Invece di caricarlo su SkyDrive, carica il file su DropBox.
    Se vuoi visualizzarla anche con Chrome vai qui
    http://www.ideepercomputeredinternet.com/2010/09/come-visualizzare-una-favicon.html

    RispondiElimina
  11. Ciao Parsifal,è un pò di giorni che la mia favicon non si vede più.Dici che è normale,oppure devo caricarlo su Dropbox come mi avevi consigliato in precedenza?Mi puoi dare il link?Grazie mille

    RispondiElimina
  12. @AnnaI file in formato ICO necessari per vedere la favicon anche con IE devono essere caricati su DropBox (SkyDrive non funziona più).
    Ti puoi iscrivere da qui
    http://www.dropbox.com/referrals/NTI1NzQ1NTM5?src=global
    il tutorial lo trovi qui
    http://www.ideepercomputeredinternet.com/2010/11/dropbox-per-condividere-file-con-piu.html
    Se vuoi mostrare la favicon anche con Chrome usa questo codice
    http://www.ideepercomputeredinternet.com/2010/09/come-visualizzare-una-favicon.html

    RispondiElimina
  13. Grazie pasrsifal,appena il mio bimbo mi lasci 5 min lo faccio.Grazie per la gentilezza

    RispondiElimina
  14. @Anna

    Ciao parsifal,scusa ancora ,ma stò provando a fare quello che mi hai detto,ma non trovo più nel pc le immagini con .ico,e in più ho provato a riconvertirle,ma il programma icons mi continua a mettere una x con tanti punti interrogativi ,come mai?

    RispondiElimina
  15. Ciao Parsifal ho risolto,l'unica cosA è che la B di blogger mi continua ad apparire nella lettura dei commenti e nei blog di che mi ha aggiunto come link preferito,è normale?Ciao Anna

    RispondiElimina
  16. @Anna
    Dipende dai cookies, vedrai che tra un po' cambieranno pure quelli.

    RispondiElimina
  17. Sia su IE9 e Opera Ho eseguito la procedura ma la favicon si evidenzia solo quando digito la HOME PAGE del mio blog. Non si evidenzia quando si clicca sul singolo POST. Come devo fare per farle vedere in entrambi?
    Grazie, Giorgio

    RispondiElimina
  18. @Giorgio La tua favicon si vede perfettamente anche nei post, forse è un problema del tuo browser.

    RispondiElimina
  19. Ok grazie e ......fortissimo con il tuo blog. Ti inserirò nei blogroll "SCAMBIO LINK" del mio blog, se vorrai gradirei altrettanto. Saluti.

    RispondiElimina
  20. Ciao parsifal,è 2 giorni che la mia favicon non si vede più,ed è tornata quella di blogger,nonostante abbia usato dropbox.Pensi che sia normale e poi tornerà,oppure devo rifare tutto il procedimento?Ciao da Anna

    RispondiElimina
  21. @Anna
    E' cosa strana. Se prima funzionava non vedo la ragione per cui abbia smesso. Prova a ricaricare il file ICO su DropBox e a ripetere la procedura.

    RispondiElimina
  22. Grazie ci riprovo è poi ti tico.Ciao

    RispondiElimina
  23. Ciao parsifal,ho ricaricato la favicon e me l'ha fatta rivedere,il problema è che rimane per un pò e poi ritorna blogger.Non sò se è dovuto ad un problema del mio browser.C'è solo una cosa strana,quando accendo il pc,dropobox,mi invia un messaggio di errore,in cui mi dice che l'orario del pc non è giusto,per cui lui non può funzionare correttamente.Ho controllato,ma ora e data sono quelli attuali.Non capisco.Ciaoo

    RispondiElimina
  24. @Anna
    Non sono onnisciente e ci sono cose che non capisco neppure io :)) (moltissime)

    RispondiElimina

Non inserire link cliccabili altrimenti il commento verrà eliminato. Metti la spunta a Inviami notifiche per essere avvertito via email di nuovi commenti.
Info sulla Privacy