Come personalizzare la favicon di Blogger da Layout o da Modello. La favicon è quella icona che si visualizza nella scheda del browser e nei Preferiti salvati
Quando si apre una pagina web nella scheda del browser, a sinistra del titolo della pagina viene visualizzata una piccola icona chiamata favicon che è una contrazione della espressione inglese favorite icon. Questa funzionalità è stata introdotta dalla Microsoft con Internet Explorer 5 ma adesso è comune a tutti i principali browser. All'inizio la favicon era posizionata nella radice di archiviazione ovvero in quella che viene anche chiamata webroot. In seguito è stato introdotto un apposito tag HTML per aggiungere la favicon nella sezione HEAD della pagina web con questa sintassi
<link rel="icon" href="http://...../favicon.ico" />
dove si inserisce l'URL diretto della immagine della favicon. All'inizio le favicon erano tutte in formato .ICO ma adesso possono essere aggiunte come favicon anche immagini .GIF o .PNG. Un discorso analogo vale per le dimensioni. Quelle delle immagini in formato .ICO erano comprese tra 16 e 48 pixel mentre le immagini .PNG e .GIF possono essere di qualunque dimensione.
La favicon funziona meglio se l'immagine è quadrata. Le favicon delle pagine verranno visualizzate anche nei Preferiti del browser. È quindi importante avere una favicon riconoscibile per aiutare i lettori nella ricerca delle pagine del nostro sito che hanno inserito nei Segnalibri del loro browser.
LA FAVICON DI BLOGGER
Anche Blogger ha una sua favicon nativa comune per tutti i blog. Aprite la pagina
http://nomeblog.blogspot.com/favicon.ico
e visualizzerete la favicon associata al vostro sito dopo aver modificato l'URL generico del blog gratuito di Blogger. Anche i siti su dominio personalizzato hanno la loro favicon a questo indirizzo
http://www.esempio.com/favicon.ico
COME PERSONALIZZARE LA FAVICON DA LAYOUT
Si sceglie l'immagine quadrata da usare come favicon con un peso inferiore a 100KB quindi si va su Bacheca -> Layout -> Icona preferita -> Modifica -> Scegli File e si seleziona l'immagine
che potrà essere nei formati PNG, ICO, JPEG o GIF. Si va poi su Salva per applicare la modifica. La favicon di default di Blogger è che la B bianca su sfondo arancione verrà sostituita da quella aggiunta. C'è la possibilità che la favicon non venga vista immediatamente perché i cookie non sono ancora aggiornati. Basterà fare qualche ricarica della pagina per visualizzarla
Si possono anche aggiungere immagini animate in formato GIF. Per cambiare una favicon con un'altra si torna su Layout -> Icona preferita -> Modifica, si rimuove l'icona corrente quindi se ne aggiunge un'altra anche animata
quindi si procede con il salvataggio. L'animazione non sempre viene mantenuta nei browser.
COME VERIFICARE LA PRESENZA DELLA FAVICON NEL MODELLO DI BLOGGER
Si va su Modello -> Modifica HTML e si verifica la presenza di questa riga
<b:include data='blog' name='all-head-content'/>
intorno alla sesta riga. Tale codice permette di visualizzare tutti gli elementi della sezione head . Se utilizzate un modello scaricato da internet e tale riga non fosse presente incollatela sotto la riga <head>. Se questa aggiunta non fosse possibile o se la favicon fosse non funzionante aggiungete sempre sotto <head> questa riga
<link expr:href='data:blog.blogspotFaviconUrl' rel='icon' type='image/x-icon'/>
dove il tag colorato di blu è il tag della favicon del sito.
Ciao Ernesto, ho bisogno di chiderti aiuto per un layout. Ne ho scaricato uno, nello specifico questo: https://gooyaabitemplates.com/beauteous-slider-blogger-template/
RispondiEliminaper il mio sito www.antonellagrassia.com
ma non riesco a trovare la nella modifica del modello la stringa che mi permetta di mettere le mie immagini al posto di quelle che vedo. Di preciso mi riferisco alle immagini in alto, sia quella lunga orizzontale che le tre sotto con il bollino cliccabile(love outdoor e fashion) Mi potresti aiutare tu? e poi vorrei trovare anche la stringa presente subito dopo che dice "showing post with label love" http://beauteous2-yotemplates.blogspot.it/search/label/Love?max-results=6
Grazie
In linea di massima consiglio di usare template scaricati da internet solo quando sono perfetti perché la loro personalizzazione è sempre complicata.
EliminaIn seconda battuta ci si può rivolgere al sito da cui si è installato il modello per avere delle delucidazioni. Spesso però non rispondono.
Nello specifico per le immagini devi andare nel modello e cercare gli URL delle stesse che si può ricavare con il destro del mouse.
Vedo però che non lo si trova.
Dal sorgente pagina si capisce poco. Ci sono molti plugin di Wordpress che rimandano al sito di installazione. Francamente non so come posso aiutarti :(
@#
Avevo già fatto quello che mi avevi detto tu. Però non sapevo che ci fossero molti codici wordpress. In realtà pensavo anch'io che fosse già completo e non dovessi metterci le mani se non per piccola cose, ma vedo che non è così. Grazie. Proverò a vedere se ci capisco qualcosa, oppure mi troverò un altro template.
EliminaGrazie
Ti chiedo scusa se insisto. Alla fine sono riotnata al layout classico. E' molto meglio, così posso fare tutte le modifiche che voglio. Però vorrei chiederti se per caso tu hai fatto qualche tutorial per creare delle immagini fisse come quelle che ti chiedevo nel primo messaggio. Cioè immagini che poi rimandano a una categoria in particolare per ogni immagine. Qualcosa che sia sempre fisso a ogni pagina che apro.
RispondiEliminaE poi, potresti darmi il link del tutorial per il menu? Vorrei metterlo in alto, come hai visto sempre in quel layout che ti ho condiviso. Insomma, cercherò di farmelo da me il layout perfetto.
Grazie.
Mi sembravano degli slideshow più che delle immagini fisse. Di slideshow ne ho presentati tanti. Guarda se ti piacciono questi
Eliminahttp://www.ideepercomputeredinternet.com/2016/10/blogger-slideshow.html
http://demo-blogger-widget.blogspot.it/p/slideshow_11.html
Per un menù in alto puoi scegliere tra questi
http://www.ideepercomputeredinternet.com/2011/03/i-migliori-menu-per-blogger.html
Tre interessanti potrebbero essere questi
http://www.ideepercomputeredinternet.com/2017/01/blogger-menu-responsive-floating.html
http://www.ideepercomputeredinternet.com/2016/10/blogger-menu-multilivello-css-casella-ricerca.html
http://www.ideepercomputeredinternet.com/2016/08/responsive-menu-blogger.html
@#
Allora credo di aver trovato sul tuo blog quello che cerco. Vorrei chiderti dove posso inserire il link dell'immagine e link cliccabile all'interno del codice? Lo metterei in alto sopra il widget post e così sarebbè proprio quello che voglio.
RispondiEliminahttp://www.ideepercomputeredinternet.com/2013/02/allineare-elementi-div.html
Per metterlo sopra all'area del post basta che tu incolli il codice su Layout -> Aggiungi un gadget -> Base HTML/Javascript per poi salvarlo e trascinarlo con il mouse sopra a tale area sempre da Layout per poi salvare la disposizione
Elimina@#
Quello l'ho già fatto. ^_^
EliminaVedi www.antonellagrassia.com
Quello che volevo chiederti è: all'interno del tuo codice dove posso inserire l'url dell'immagine e il link cliccabile?
Ho provato a fare delle prove da me ma con scarsi risultati -_-
Grazie
Qui non c'è codice :) Si parla solo di favicon. Hi preso in esame un post sbagliato per fare quello che ti interessa. Prova usando il codice di questo articolo
Eliminahttp://www.ideepercomputeredinternet.com/2017/02/foto-allineamento-orizzontale-verticale-blogger-wordpress.html
scritto poche ore fa
@#
grazie mille. Ho tutto quello che volevo. ^_^
EliminaCiao Ernesto, non ho più l'icona/logo del mio sito visibile nei motori di ricerca e sulla barra in alto del browser. Nei risultati di Google l'icona del mio sito è rappresentata da un generico mondo disegnato. Come si modifica? Non trovo nel layout la voce "Icona preferita". Grazie mille.
RispondiEliminaSu Layout infatti è scomparsa la opzione per Icona Preferita. Può darsi che sia un problema di browser più che di sito. La mia icona si vede sempre. Visto che non si può intervenire purtroppo non vedo cosa possa consigliarti. Mi spiace.
Elimina@#
Peccato... grazie comunque.
Elimina