Favicon (icona) personalizzata per il blog Blogger

giovedì 7 febbraio 2008 Lascia un Commento

Vi siete mai chiesti come appaiono quelle piccole icone accanto all'indirizzio web che stiamo visitando? Sono le cosiddette Favicon.
La favicon è una piccola immagine, spesso un logo, pertinente ai contenuti del sito web correlato. La favicon viene visualizzata alla sinistra dell'URL nella barra degli indirizzi di un browser, nel momento in cui si naviga un sito che ne è provvisto. L'icona è inoltre visualizzata nel menu dei preferiti di un browser, che pertanto risultano più facilmente indiduabili.

Vediamo come associare al nostro blog Blogger Blogspot una icona favicon personalizzata, al posto di quella standard a forma di B.

Scegliamo una icona da utilizare come favicon per il nostro blog, che abbia estensione ICO. Se cercate sul vostro hard disk, potreste trovare alcune icone ICO. Vorrei suggerirvi di crearne una per rappresentare in maniera originale il vostro Blog.

Ci sono molti programmi per creare una favicon, ad esempio Imagicon, che può trasformare una qualsiasi immagine in formato ICO. È possibile utilizzare qualsiasi immagine, e creare icone ICO in 2 formati - 16x16 e 32x32 - io penso che un 16x16 sia preferibile dal momento che è leggibile nella maggior parte dei browser più vecchi.
Se non volete scaricare nessun programma, è possibile creare un'icona direttamente online.
Basta cercare su Google le parole chiave "generatore icona online" e si dovrebbe essere in grado di trovare molti siti totalmente gratis.

Dopo aver creato l'icona, salvatela nel vostro hard disk. Il prossimo passo, per associare l'icona al blog è un piccolo trucco. Idealmente, tutto quello che dovreste fare è salvarla nella directory principale del vostro blog. Tuttavia, non vi è alcun modo in cui questo può essere fatto: se si tenta di caricare un icona immagine, Blogger la respinge. Inoltre qualsiasi file che viene caricato non andrà nella directory principale di Blogger. L'unico metodo che possiamo utilizzare sarà quello di caricare l'icona in una cartella Web (vedi l'articolo I migliori servizi di hosting divisi per capienza o Google page creator).

Una volta fatto questo, prendete nota dell' URL (indirizzo) della vostra icona. Copiate questo URL sul blocco note. Tornate in Blogger e sotto la scheda "Modello", andate a "Modifica HTML".
Vicino alla parte superiore vedrete una riga come questa:

<title><data:blog.pageTitle/></title>

Inserite il codice seguente, dopo di essa:

<link href='URL della favicon' rel='shortcut icon' type='image/x-icon'/>

Salvate e visualizzate il risultato sul vostro blog. Dovreste vedere la favicon accanto all'indirizzo del blog.

Nota: alcuni browser potrebbero non essere compatibili con questo sistema, dovete quindi fare delle prove per verificarlo di persona.

19 commenti »

  • Jane ha scritto:  

    Che mito questa guida!!! sto leggendo i post e son uno più interessante dell'altro!!! Sto risolvendo molti problemi (son blogger neofita)!

    grazie!!!!!!!

  • the Tramp ha scritto:  

    Ciao, ho provato con i tuoi suggerimenti ma quando vedo l'antemprima non comapare nulla perchè c'è questo errore "Messaggio di errore XML: The value of attribute "href" associated with an element type "null" must not contain the '<' character".
    Ho caricato l'immagine per il favicon (formato ico) su filefront.
    Mi potresti aiutare? Grazie mille.

  • the Tramp ha scritto:  

    Ora sono riuscito a caricare l'url ma non compare nulla. Scusami per la mia inesperienza ma proprio non va.

  • Helga ha scritto:  

    Ciao! Ho creato una cartella su di uno spazio su Yahoo Geocities e vi ho inserito il file .ico; di quest'ultimo ho copiato l'url ed inserito nel codice del mio blog così da avere, ma non si vede niente... cosa ho sbagliato?

  • Helga ha scritto:  

    Perfetto! Ho risolto... un'altra cosa: come fare a fare visualizzare la favicon anche in Firefox 3? Grazie. Helga

  • JS ha scritto:  

    @ the tramp
    Dovresti ricontrollare attentamente il codice, incluso quello precedente e successivo a quello che stai inserendo, potrebbero esserci errori di copia-incolla...

    @helga
    Alcuni browsers potrebbero avere qualche difficoltà a visualizzare le favicon in modo corretto. Personalmente Firefox3 non mi ha dato problemi con le favicon. Dovresti controllare bene il codice.

  • the Tramp ha scritto:  

    @JS Grazie, ora funziona, ma a momenti...Ti spiego, delle volte si vede, altre volte si vede la B di blogger.Vacci a capire.

  • Blue Rose ha scritto:  

    Complimenti davvero!
    Di tanti blog e siti che propongono soluzioni e suggerimenti, questo dà un aiuto davvero concreto: per le favicon finora non avevo trovato nessuno che desse dei consigli funzionanti, adesso invece la favicon l'ho messa al primo colpo :) , dopo molti tentativi a vuoto precedenti! Grazie!
    Ah, io mi sono servta di FILEDEN, per hostare le favicon, perché altri siti, di cui pure mi servo, rifiutano i file con estensione .ico ; invece fileden li prende senza problemi, e è ottimo anche per la musica, gli mp3 li immagazzino e linko da lì.
    Ciao! :*

  • JS ha scritto:  

    Grazie a te! Ricontrollando il post mi sono accorto di alcuni problemi di leggibilità che adesso ho corretto.
    E complimenti per i tuoi Blog! :-)

  • Anonimo ha scritto:  

    Sono riuscito,bella guida complimenti

    Ecco il mio blog: http://solocoloribianconeri.blogspot.com/

  • luisa ha scritto:  

    ho cercato di caricare la favicon ma nell'anteprima mi dà lo stesso messaggio di quando provo a caricare musica:mancano i plugin, li faccio cercare e mi dice che non trova il plugin text/html....nei plugin di mozilla più comuni non c'è...che devo fare? ho mozzilla....

  • andrea matranga ha scritto:  

    ciao scusa io ho mozzilla, ho creato icom. scaricando il programma da te consigliato, ma non riesco a caricarlo in nessuna cartella web??? Sapresti indicarmi un sistema per avere htlm? io ho flickr ma non legge questo formato cosa mi consigli?

  • JS ha scritto:  

    @ andrea

    Puoi utilizzare
    1 Google Page Creator
    2 Google Gruppi

    Vedi questa guida:
    http://trucchi-suggerimenti-guida.blogspot.com/2008/02/utilizzare-google-page-creator-o-google.html

  • andrea matranga ha scritto:  

    Grazie risolto...mi sei di grande aiuto.

  • Aleramo ha scritto:   Questo commento è stato eliminato dall'autore.
  • Sarah B. ha scritto:  

    Ho seguito le tue indicazioni, ho caricato la favicon su rapidshare e modificato il codice, ma l'immagine non compare, resta sempre la B di Blogger...
    Non mi da messaggi di errore nel codice o roba simile, salvo il modello senza problemi ma non succede nulla.
    Nella stringa che dici di aggiungere io ho modificato solo la parte dove si deve inserire l'url della favicon, giusto? O ci sono altre porzioni di codice da modificare?
    Io uso Chrome

  • Jack Slater ha scritto:  

    Rapidshare non va bene per la Favicon, puoi utilizzare Picasa o un hosting di immagini qualsiasi.

  • Sarah B. ha scritto:  

    Ok. Ho caricato la foto su Picasa, copiato l'url ed inserito nel link... Continua ad apparire la B di Blogger però...
    Che nervi, pensare che le tue spiegazioni sono chiarissime!

  • MaximaFobia ha scritto:  

    oh, finalmente una guida utile...

  • Commenta!

    Lascia il tuo commento riguardo l'articolo!