Come personalizzare i font delle pagine statiche di Blogger.

In un precedente articolo abbiamo visto come personalizzare la famiglia di caratteri del menù delle pagine statiche. In un commento mi è stato chiesto come fosse possibile personalizzare il font del testo di una o più pagine statiche, o comunque diciamo che ho capito che questa poteva essere la domanda visti che era stata posta in un modo un po' criptico.

Considerando che questa personalizzazione potrebbe essere interessante anche per altri lettori ho deciso di pubblicarci un post. Si tratta innanzitutto di cercare una famiglia di caratteri che ci piace tra i font di Blogger oppure tra quelli di Google Fonts.

Come nascondere le sidebar nelle pagine statiche di Blogger.

Nella piattaforma Blogger si possono creare al momento fino a 20 pagine statiche. Dette pagine non vanno a finire nei Feed RSS del sito e servono per contenuti avulsi dall'attualità. Si possono usare per un modulo di contatto, per la Informativa estesa sulla Cookie Law o per una galleria di immagini.

Visto che le pagine statiche hanno una finalità molto diversa dai post si può avere la necessità di modificarne il layout. Si può procedere in due modi distinti. La prima possibilità è quella di personalizzare ogni singola pagina statica in funzione dei suoi contenuti e la seconda è invece quella di modificare l'aspetto di tutte le pagine statiche operando direttamente nel modello. Se si decide per questa seconda ipotesi tutte le pagine statiche verranno modificate nello stesso modo.

COME TROVARE L'ID DELLE SIDEBAR DI BLOGGER

Prima di procedere bisogna trovare l'ID della o delle sidebar di Blogger. Si va su Bacheca > Layout e si legge l'ID della sidebar direttamente da lì

Come aprire i link del menù delle Pagine Statiche di Blogger in un'altra scheda.

Nel precedente post abbiamo visto come su Blogger si possa realizzare un menù orizzontale con il widget dell'Elenco di link in cui si possono aggiungere anche link a pagine esterne. Di default tale menù non permette di far aprire i link presenti in un'altra scheda del browser e questo può essere negativo specialmente se abbiamo aggiunto dei collegamenti ad altri siti come per esempio i nostri account nei vari social network.

Si può risolvere questo piccolo problema con una modifica al modello. Dopo aver salvato il template si va su Modello > Modifica HTML e si cerca con Ctrl+F la stringa PageList1 che è l'ID del widget delle Pagine. Ci potrebbero essere delle differenze tra modello e modello ma il codice non dovrebbe essere troppo diverso da quello del seguente screenshot dopo che si è cliccato sulle freccette nere a sinistra per visualizzarlo interamente

Quali sono le differenze tra post e pagine statiche in Blogger?

Forse è il caso di affrontare in modo approfondito le differenze sostanziali che esistono tra i normali articoli o post di Blogger e le cosiddette Pagine o pagine statiche che dir si voglia. 

La diversa tipologia tra questi due elementi è importante anche per rispondere alla domanda che in molti si pongono su quale sia il vantaggio di usare una pagina invece di un post per un certo contenuto e quali siano eventualmente gli svantaggi. Diversi anni fa su Blogger non c'erano le pagine statiche ma si potevano pubblicare solo post e se si voleva creare una pagina in cui incollare per esempio un modulo di contatto dovevamo usare l'escamotage di pubblicare il post con una data antecedente a quella della nascita del blog per non farla finire in homepage o nei feed.

Come allargare il layout di una o di tutte le pagine statiche di Blogger nascondendo sidebar e/o footer e/o commenti.

Le pagine statiche sono state introdotte da Blogger molti anni fa e i nuovi utenti neppure sanno che all'inizio non c'erano e che ci si doveva arrangiare pubblicando post retrodatati. Tali pagine sono in genere utilizzate per contenuti particolari quali la Informativa lunga per i Cookie, il Disclaimer del blog, la Mappa del sito ma soprattutto Gallerie Fotografiche o Widget con tutti i post del blog divisi per etichette.

Con scelte di questo tipo è quindi opportuno cercare di rendere il layout delle pagine statiche più largo del normale. Il procedimento illustrato in questo post sarà appunto quello di nascondere la sidebar e/o il footer in una determinata pagina statica o in tutte le pagine statiche.

Come inserire una chat su Blogger.

Premetto che probabilmente non inserirò mai una chat in un sito perché mi manca assolutamente il tempo per interagire con i lettori però a seguito di una richiesta formulatami in un commento passo a elencare alcuni dei servizi online che permettono allo webmaster di installare gratuitamente una chat per avere scambi di opinioni con gli utenti in tempo reale e che possa essere una integrazione dei commenti classici. 

Ci sono chat che permettono di postare messaggi senza nessun tipo di registrazione mentre altre pretendono un accesso tramite Twitter, Facebook o Google. In definitiva la configurazione di una chat consta di fasi simili a tutti i servizi. La prima è quella in cui si scelgono lo stile, le dimensioni e altre impostazioni. Nella seconda fase si genera il codice HTML e nella terza fase si incolla nel nostro blog. In linea generale si può decidere di installare la chat in tutte le pagine mostrandola magari nella sidebar o nel footer oppure si può optare per la sua installazione in una pagina statica con il richiamo nel menù.

Come mostrare tutti i titoli dei post di Blogger suddivisi per etichette in una pagina statica.

I motori di ricerca richiedono agli webmaster una Sitemap per procedere a una migliore scansione del sito. Per quello che riguarda gli utenti Blogger proprio un mese fa c'è stato un aggiornamento della piattaforma con la creazione automatica della sitemap inserita nel file robots.txt. Google consiglia gli amministratori dei siti anche di creare delle Mappe del Sito per i lettori. 

In pratica è opportuno pubblicare per esempio una pagina statica in cui si possano sfogliare tutti i titoli dei post che sono stati pubblicati suddivisi per etichetta che è il tipo di archiviazione canonica di Blogger. Ricordo di aver già presentato una Mappa del blog per etichette e una Tabella degli Articoli ma che mostra anche le miniature dei singoli post. 

Come personalizzare la famiglia di font del Menù delle Pagine Statiche di Blogger.

Ieri ho ricevuto un commento che mi chiedeva appunto di trovare il modo di cambiare i caratteri delle voci del menù delle Pagine Statiche creato di default con Blogger. Visto che il tema potrebbe interessare anche altri lettori ho deciso di farci un articolo. 

In linea di massima per cambiare il tipo di caratteri del menù delle Pagine si va su Modello > Personalizza > Avanzato > Testo Schede e si seleziona il carattere tra quelli disponibili. In basso sarà visualizzata l'Anteprima e dovremo andare in alto a destra su Applica al blog per rendere le modifiche effettive. 

Mostrare i post delle etichette più popolari in una pagina statica di Blogger.

Ho già presentato diversi articoli che illustrano la creazione di Sitemap a beneficio dei lettori che mostrano tutti i post pubblicati suddivisi per etichette per poi mostrarli in un widget o in una pagina statica con la possibilità di mostrare solo i titoli dei post o anche con le miniature.

In questo post illustrerò un metodo alternativo in modo da mostrare in una pagina statica l'elenco delle etichette che riteniamo più interessanti per i lettori con gli ultimi articoli pubblicati. In ciascun post si visualizzerà titolo, miniatura e anche snippet nel caso ci sia lo spazio sufficiente. Gli elenchi si posizioneranno in una, due, tre o quattro colonne a seconda dello spazio disponibile. Nel caso abbiate eliminato la sidebar dalla pagina statica e quindi disponete di un layout particolarmente ampio potete posizionare anche più di quattro colonne.

Come mostrare tutti i post di una data etichetta in un widget o in una pagina statica di Blogger.

Recentemente ho pubblicato due articoli su come mostrare tutti i post del blog in un widget e su come invece visualizzarli in una pagina statica. Dai commenti pare che abbiano avuto un certo successo. Alcuni lettori mi hanno chiesto di adattare i due widget per mostrare non tutti gli articoli che sono stati pubblicati ma solo quelli con una determinata etichetta.

Innanzitutto facciamo un po' di chiarezza sulle etichette e sulle pagine relative. In Blogger è possibile creare etichette di una parola, di due o più parole, con lettere minuscole, con lettere maiuscole, con accenti e perfino con apostrofi.  Si tratta di elementi case sensitive nel senso che per esempio l'etichetta Blogger sarà diversa dall'etichetta blogger la quale a sua volta lo sarà da BLOGGER.

Mappa con miniature di tutti i post pubblicati da inserire in una pagina statica di Blogger.

Dopo aver letto un commento a calce del widget di Tutti i post per Blogger mi è venuto in mente di provare a creare con lo stesso javascript una pagina statica che mostri tutti gli articoli che si sono pubblicati e che il lettore potrà scorrere facilmente. Si tratta di una alternativa anche migliore della classica Mappa del Sito con miniature, della Sitemap per etichette o dell'Elenco dei post per categoria. 

Il widget è completamente personalizzabile e ho provato a testarlo anche in un blog a Visualizzazione Dinamica in cui però non ha funzionato. Per installarlo non occorre modificare il template ma basta incollare il codice nell'Editor della pagina statica.

Si accede alla Bacheca e si va su Pagine > Nuova Pagina

Creare un blog con una pagina statica come Home in Blogger.

Una domanda in un commento ha suscitato la mia curiosità come spesso mi accade. Mi si chiedeva come creare un blog che avesse una pagina statica come homepage con dei suoi contenuti fissi che non mostrasse i post e con un collegamento nel menù a una voce in cui i lettori potessero visualizzare tutti gli articoli pubblicati. Questa impostazione può essere utile quando la home page voglia essere una sorta di Pagina di Benvenuto o comunque una presentazione di una attività commerciale o artistica.

La recente modifica della scheda Pagine in Blogger rende le cose anche più semplici. Come prima cosa pubblichiamo una pagina statica che diventerà l'homepage del nostro sito. È importante scegliere subito il link mentre i contenuti possono essere aggiunti in un secondo tempo. Come test per questa personalizzazione ho usato il sito prova-32.blogspot.com.

Come realizzare un menù a libro per una pagina statica.

Dopo aver presentato un menù colorato ruotante vado adesso a illustrare un altro tipo di menù decisamente originale. Si tratta di un menù a forma di copertina di libro che si sfoglia al passare del cursore e che mostra i link degli elementi in seconda pagina mentre nella prima si può inserire una descrizione degli stessi. Ovviamente un tale menù non può essere usato come sistema di navigazione principale del sito ma può essere inserito in una pagina statica per mostrare dei link che riguardano un argomento che merita una certa evidenzia. 

Per questo menù non occorre modificare il modello ed è tutto realizzato attraverso il CSS3 senza l'ausilio di immagini. Le possibili personalizzazioni nell'aspetto riguardano i colori, il tipo di font e le loro dimensioni

Creare un modulo di contatto con Google Drive utilizzabile anche con i modelli a Visualizzazione Dinamica di Blogger.

A seguito di alcuni commenti relativi a un mio vecchio post mi sono deciso a riprendere il tema di come creare un modulo di contatto utilizzando lo straordinario strumento gratuito di Google Drive. La procedura che andrò a illustrare ci porterà alla realizzazione di un modulo che può essere usato per interagire con i lettori senza utilizzare direttamente il nostro indirizzo email. In sostanza i messaggi che riceveremo comprensivi del nome, indirizzo email e di tutti gli altri campi che volessimo creare andranno a riempire un foglio di lavoro creato automaticamente dal modulo.

Questo ci eviterà di ricevere email di spam anche se avrà la piccola controindicazione che dovremo copiare l'indirizzo email e incollarlo nel nostro client di posta elettronica nel caso avessimo in animo di rispondere. Un modulo così concepito potrà essere installato in qualsiasi pagina web o in un blog di altre piattaforme come Wordpress, Joomla, Drupal, LiveJournal, ecc. Ho testato questo modulo di contatto anche nei blog su Blogger a Visualizzazione Dinamica in tutti e otto i modelli possibili.

Come inserire il widget delle Etichette, dell'Archivio, del Modulo di Contatto o del Profilo in una pagina di Blogger.

Ho ricevuto diversi commenti con la richiesta di inserire i gadget ufficiali di Blogger in una pagina statica invece che nella sidebar o nel footer. Questo per rendere il widget più ampio e quindi più facilmente navigabile e per aumentare lo spazio libero nel normale layout del sito.

In realtà queste personalizzazioni sono piuttosto semplici, basta seguire il procedimento utilizzato per inserire il modulo di contatto ufficiale di Blogger in una pagina statica. Tale procedura può anche essere ulteriormente semplificata sfruttando il drag & drop degli Elementi Pagina su Layout. Per prima cosa pubblichiamo una pagina statica con il titolo Etichette oppure Archivio o Contattami andando su Bacheca > Pagine > Nuova Pagina > Pagina Vuota. Pubblichiamo senza contenuti oppure inseriamo una espressione tipo "Pagina in allestimento" che poi sarà tolta in seguito. A questo punto dobbiamo prendere nota dell'URL della o delle Pagine ricordandosi di modificare il suffisso locale .it con il canonico .com altrimenti i tag condizionali non funzioneranno.

Come inserire i bordi nel menù delle pagine statiche di Blogger.

Ho più volte scritto che la maggior parte delle idee sui temi degli articoli mi vengono leggendo i vostri commenti e quindi confrontandomi sulle personalizzazioni che richiedete e che ritengo possano essere interessanti non solo per un singolo lettore. Qualche volta mi sono cimentato nello scrivere anche degli "instant post" se ricevo una domanda che non mi consente per la sua complessità di rispondere nei commenti ma che mi dà l'input per l'argomento di un post.

È il caso di questo articolo nato  a seguito di chi mi ha chiesto come inserire due linee in alto e in basso al menù orizzontale delle pagine statiche di Blogger. Ricordo che tale menù viene a formarsi automaticamente dopo la pubblicazione delle Pagine e che si può scegliere di mostrare orizzontalmente in alto, verticalmente in una sidebar o decidere di non mostrare. Nell'articolo linkato mi ero occupato di come modificarne le dimensioni e di come centrarlo. Il menù delle pagine statiche può essere integrato anche con link esterni al blog. In sostanza vogliamo effettuare una modifica di questo tipo

Come inserire il modulo di contatto di Blogger in una pagina statica.

Dopo una lunga attesa è finalmente stato rilasciato dal Team di Blogger il modulo di contatto ufficiale sotto forma di widget da inserire in una sidebar. Tale gadget può in qualche misura essere personalizzato andando a analizzare quali siano le classi di stile del widget con uno strumento come Firebug. In questo articolo vediamo come si possa inserire tale modulo di contatto in una pagina statica in modo da rendere più agevole per i lettori digitare il messaggio a fronte dello spazio più ampio a disposizione.

Si procede come già descritto andando su Layout > Aggiungi un gadget e scegliendo la scheda Altri gadget quindi Modulo di Contatto. Si salva e si visualizzerà il modulo di contatto nella posizione in cui abbiamo scelto Aggiungi un gadget.

Come personalizzare l'URL di una pagina statica di Blogger.

Da diverso tempo è possibile sulla piattaforma Blogger personalizzare l'ultima parte del Permalink di un post mentre per le pagine non è ancora stata introdotta una tale possibilità. L'URL di una pagina viene automaticamente determinato dal titolo che le si dà la prima volta che viene pubblicata. Si può utilizzare questo processo per creare dei permalink contenenti un certo numero di parole chiave per poi modificare il titolo in un secondo momento.

Mi ero già occupato di questo trucco, se vogliamo chiamarlo così, per richiamare parole chiave pertinenti nell'indirizzo della pagina e dandole invece un titolo necessariamente breve per il layout del menù delle pagine statiche che si può creare di default su Blogger. Da alcuni commenti però mi sono reso conto che il procedimento non è stato ben compreso o forse non funziona con taluni modelli.

Come eliminare la data dagli URL dei post e la "p" da quelli delle Pagine di Blogger.

Con l'introduzione dei Permalink personalizzati la piattaforma Blogger ha indubbiamente fatto dei passi in avanti verso una migliore ottimizzazione in chiave SEO degli URL degli articoli. Usando un particolare artificio è pure possibile entro certi limiti rendere più SEO friendly anche i Permalink delle Pagine Statiche. Negli URL dei post rimarrà comunque il mese e l'anno della data dell'articolo mentre nella pagina statica ci sarà una oggettivamente antiestetica "p" tra il dominio del blog e il titolo della prima pubblicazione della pagina.

Ecco un esempio di un indirizzo di un articolo e un altro di un indirizzo di una pagina statica

http://nomesito.blogspot.com/2013/01/titolo.html

http://nomesito.blogspot.com/p/nome-pagina.html

Come disabilitare il Lightbox nativo di Blogger nelle pagine statiche o in un determinato articolo.

Il Lightbox nativo di Blogger ha suscitato molto dibattito fin dalla sua introduzione visto che ci sono utenti che lo amano molto e che lo usano mentre altri proprio non lo sopportano. Ricordo che si può attivarlo o disattivarlo andando su Impostazioni > Post e Commenti > Mostra immagini con Lightbox e scegliere Sì oppure No quindi salvare le impostazioni. E' anche possibile in qualche modo personalizzare il Lightbox arrotondando i bordi dell'immagine o modificando il colore dello sfondo.

Coloro che postano le immagini con Windows Live Writer non visualizzeranno tale effetto nei loro articoli. Comunque è stato posto rimedio anche a questo problema inserendo il collegamento alla immagine originale su Picasa. Facciamo adesso l'ipotesi che un utente di Blogger usi il Lightbox nativo ma che abbia creato una galleria di immagini in una pagina statica con un altro effetto tipo Lytebox, Facebox, PrettyPhoto o Shadowbox. In quella galleria saranno visualizzati contemporaneamente i due effetti con ovvie ricadute negative dal punto di vista estetico. Vediamo quindi come disabilitare il Lightbox nativo di Blogger solo nelle pagine statiche o al limite solo in una pagina statica o in un singolo post del nostro sito.