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

Come mostrare in una pagina statica di Blogger tutti i post pubblicati su Blogger suddivisi in etichette con effetto hover e con la possibilità di inserire anche miniature e snippet.

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. 

Vado adesso a illustrare un codice che serve per entrambe le opzioni

cioè con cui si possa mostrare l'elenco di tutti gli articoli pubblicati con quella etichetta corredato da miniature e incipit del post oppure solo con i relativi titoli. La prima opzione è più ricca ma rende la pagina più lenta a caricarsi. Nei blog con molte pagine pubblicate è meglio optare per i soli titoli mentre le miniature vanno bene nei siti che non abbiano troppi articoli.

Si va su Bacheca > Pagine > Nuova Pagina e in Modalità HTML, si incolla questo codice

• Codice della Mappa del sito per etichette -

Si pubblica direttamente da HTML senza tornare su Scrivi. 

La personalizzazione riguarda essenzialmente i codici dei colori e la famiglia di font. Nel codice sono stati inseriti dei commenti esplicativi su che aspetto del widget agisce la singola riga. Qui di seguito elenco la configurazione avanzata di questo widget per mostrare o meno determinati elementi. Nel codice questa parte è evidenziata di gialla per rendere più semplice la individuazione:

1. activeTab per mostrare 1 o più etichette attive
2. showDates per mostrare la data - false al posto di true per nasconderla
3. showSummaries con true al posto di false per mostrare gli incipit
4. numChars per settare il numero di caratteri del sommario
5. showThumbnails mostra le miniature con true e non le mostra con false
6. thumbSize per settare la dimensione della miniatura
7. noThumb per l'URL della miniatura di default per i post che non ce l'hanno
8. monthNames è il nome dei mesi (tradotto in italiano)
9. newTabLink con true apre i link in un'altra scheda con false nella stessa
10. sortAlphabetically con true i post sono in ordine alfabetico con false ordinati per data
11. showNew per mostrare un testo negli ultimi 7 post pubblicati
12. newText per settare l'espressione al posto di Nuovo!
13. blogUrl per incollare l'indirizzo del nostro sito con .com
14. @media (max-width:700px) serve per rendere Responsive la pagina della Mappa del sito in modo che sia correttamente visibile anche con dispositivi mobili

Fonte | DTE Web di Taufik Nurrohman -