Come mettere un post in evidenza su Blogger.

Come mostrare in homepage di Blogger o in altre pagine dinamiche un articolo sempre in evidenza all'inizio della pagina stessa.

Nel CMS Wordpress esistono dei plugin per mettere degli articoli in evidenza così da essere mostrati ai lettori che aprano una particolare pagina del sito, solitamente la homepage. L'utilità di questa personalizzazione è quella di poter presentare una guida del blog o una presentazione degli argomenti trattati.

Nel precedente post abbiamo visto come fissare in alto un tweet o un post su Facebook ed è più o meno quello che vogliamo fare anche in Blogger. Alla fine di questo post prenderò però in considerazione altre possibili opzioni per la personalizzazione dei post visibili in homepage. Oltre alla homepage si può inserire un post evidenza anche il altre pagine dinamiche come potrebbero essere quelle di una particolare etichetta. Per fare un esempio se il nostro sito si occupasse di atletica come post in evidenza per l'etichetta "giavellotto" potremo mostrare una scheda tecnica di questo attrezzo o i record italiani, europei e mondiali della specialità. Le pagine delle etichette sono dinamiche perché quando si pubblicano nuovi post con una determinata etichetta questo va a posizionarsi al primo posto della pagina.

CREARE IL POST IN EVIDENZA

La prima cosa da fare è quella di creare l'articolo da fissare nella homepage o in altre pagine dinamiche. Si apre l'Editor di Blogger e si confeziona il post come al solito

con alcune accortezze. Le immagini si devono inserire con l'URL diretto di Picasa mediante codice e senza utilizzare l'icona dell'Editor di Blogger. Il codice da usare per le foto è quello classico

<img src="URL_IMMAGINE" alt="testo-alternativo" title="titolo-immagine"/>

Non si devono aggiungere etichette e neppure l'icona Inserisci Intervallo. Per non perdere il lavoro fatto si va su Salva per salvare il post come Bozza. Sempre nell'Editor si clicca su HTML che si trova accanto a Scrivi, si Seleziona tutto e poi si copia il codice HTML del post

Questa bozza potrà essere eliminata alla fine di tutto il processo. Ora si va su Layout > Aggiungi un gadget > Base > HTML/Javascript e, in Sezioni del sito, si incolla il codice appena copiato,

si deve digitare il titolo del widget, che poi potrà anche essere tolto, e si clicca su Salva.

Con il trascinamento del mouse si posiziona il widget del Post in Evidenza subito sopra all'area del post chiamata anche sezione "main". Si va in alto su Salva disposizione. A questo punto il Post in Evidenza sarà visibile sopra a tutte le pagine del sito compresi anche i dispositivi mobili. Probabilmente non è questa la soluzione che si preferisce quindi bisogna applicare i tag condizionali per mostrare il Post in Evidenza solo in determinate pagine. 

Si va su Modello > Modifica HTML e con Ctrl+F si cerca il titolo del widget

Si clicca sulle freccette nere poste a sinistra della riga evidenziata per visualizzare tutto il codice. Il secondo tag condizionale </b:if> e va incollato subito sopra alla riga </b:includable> mentre il primo tag condizionale va incollato subito sotto alla riga <b:includable id='main'> in questo modo

 

Si salva il modello. Nel test ho usato come primo tag condizionale

<b:if cond='data:blog.url == data:blog.homepageUrl'>

che serve per mostrare il Post in Evidenza solo in Homepage ma se ne può scegliere un altro. Per non mostrare il Post in Evidenza nei dispositivi mobili si incolla mobile='no' nella riga del widget

Nella demo il post in evidenza si visualizzerà solo nella Homepage del blog:

Demo
Clicca qui

PERSONALIZZARE I POST VISIBILI IN HOMEPAGE

Come corollario di questo post mi preme ricordare che si possono effettuare anche altre personalizzazioni simili. Facciamo il caso che si abbia blog di motori e volessimo creare una pagina dinamica con tutti gli articoli che parlano di moto; bisogna per prima cosa mettere l'etichetta "moto" a tutti questi post. Questi post si vedranno nella pagina dinamica con indirizzo

nomeblog.blogspot.com/search/label/moto

Potremo poi pubblicare una pagina statica del tipo

nomeblog.blogspot.com/p/moto.html

mettendo appunto moto come titolo della pagina che poi si ritroverà anche nell'URL. Per terminare l'operazione non resta che effettuare un redirect 301 dalla pagina

nomeblog.blogspot.com/p/moto.html

alla pagina

nomeblog.blogspot.com/search/label/moto

Nei link potremo quindi usare il primo indirizzo al posto del secondo. Tale pagina statica sarà inoltre presente anche nel menù orizzontale o verticale che si forma automaticamente per le pagine statiche. Per fare un redirect di questo tipo occorre incollare le stringhe

/p/moto.html
/search/label/moto

Ricordo che si può creare un widget selezionandovi i post da mettere in evidenza. Ritornando al tema iniziale concludo osservando che si possono anche creare più post in evidenza da posizionare nella parte alta delle pagine con una determinata etichetta. In questo caso bisogna stare attenti a non pubblicare post con due etichette che mostrino due post in evidenza.