Pubblicato il 18/12/09 - aggiornato il  | 26 commenti :

Il fantastico widget dell'archivio con il calendario per i blog su Blogger.

Widget del Calendario con Archivio
Questo widget è frutto della capacità di Phideaux3 che è anche l'autore del gadget della label-cloud che vedete in questo blog.


Prima di passare all'illustrazione di come inserirlo vi prego di andare nel blog Pagine Navigazione in cui l'ho inserito.


Si tratta di un blog di test con pochi post quindi cercate di immaginare come potrebbe essere nel vostro che sarà certamente più denso



            calendario-1       

   calendario-2 

   calendario-3



Il widget di Phideaux3 era ovviamente in inglese ma, come vedete, sono riuscito a tradurlo in italiano. Il titolo  "Archivio del Blog" può essere modificato e reso grande quanto si vuole perché avrà lo stesso aspetto dei titoli degli altri widget che avete nelle sidebar.
  1. Nel menù a tendina può essere selezionato un mese dell'archivio.
  2. Accanto a ogni mese sarà presente il numero dei post pubblicati.
  3. I giorni in cui sono stati pubblicati gli articoli saranno evidenziati.
  4. Se si punta con il mouse un qualunque giorno del mese si visualizzeranno i titoli dei post che si sono pubblicati in quella data.
  5. Esistono cinque layout del widget con colori chiari e con colori scuri per tutte le esigenze
  6. Se si clicca su un giorno del mese veniamo indirizzati in una pagina con tutti gli articoli pubblicati quel giorno
  7. Andando sulle frecce direzionali in Scorri Archivio si può passare al mese precedente o quello successivo
  8. Sotto al widget saranno elencati tutti gli articoli pubblicati nel mese visualizzato
  9. Quando si passa da un mese a un altro si vedrà una immagine animata con la scritta "Sto caricando" 
  10. Questo widget è la versione per Blogger di un plugin di Wordpress

Per procedere con l'installazione andate su Layout > Modifica HTML, salvate il modello completo e non espandete i modelli widget. Cercate la seguente linea di codice

<b:widget id='BlogArchive1' locked='false' title='Archivio Blog' type='BlogArchive'/>
Può essere che al posto di BlogArchive1 ci sia un altro numero in ogni caso la linea è facile da visualizzare. Cancellatela e sostituitela con quest'altro codice
<b:widget id='BlogArchive1' locked='false' title='Archivio Blog' type='BlogArchive'>
<b:includable id='main'>
<b:if cond='data:title'>
<h2><data:title/></h2>
</b:if>
<div class='widget-content'>
<div id='ArchiveList'>
<div expr:id='data:widget.instanceId + "_ArchiveList"'>
<b:if cond='data:style == "HIERARCHY"'>
<b:include data='data' name='interval'/>
</b:if>
<b:if cond='data:style == "FLAT"'>
<b:include data='data' name='flat'/>
</b:if>
<b:if cond='data:style == "MENU"'>
<b:include data='data' name='menu'/>
</b:if>
</div>
</div>
<b:include name='quickedit'/>
</div>
</b:includable>
<b:includable id='toggle' var='interval'>
<!-- Toggle not needed for Calendar -->
</b:includable>
<b:includable id='flat' var='data'>
<div id='bloggerCalendarList'>
<ul>
<b:loop values='data:data' var='i'>
<li class='archivedate'>
<a expr:href='data:i.url'><data:i.name/></a> (<data:i.post-count/>)
</li>
</b:loop>
</ul>
</div>

<div id='blogger_calendar' style='display:none'>
<table id='bcalendar'><caption id='bcaption'>

</caption>
<!-- Table Header -->
<thead id='bcHead'></thead>
<!-- Table Footer -->

<!-- Table Body -->
<tbody><tr><td id='cell1'> </td><td id='cell2'> </td><td id='cell3'> </td><td id='cell4'> </td><td id='cell5'> </td><td id='cell6'> </td><td id='cell7'> </td></tr>
<tr><td id='cell8'> </td><td id='cell9'> </td><td id='cell10'> </td><td id='cell11'> </td><td id='cell12'> </td><td id='cell13'> </td><td id='cell14'> </td></tr>
<tr><td id='cell15'> </td><td id='cell16'> </td><td id='cell17'> </td><td id='cell18'> </td><td id='cell19'> </td><td id='cell20'> </td><td id='cell21'> </td></tr>
<tr><td id='cell22'> </td><td id='cell23'> </td><td id='cell24'> </td><td id='cell25'> </td><td id='cell26'> </td><td id='cell27'> </td><td id='cell28'> </td></tr>
<tr><td id='cell29'> </td><td id='cell30'> </td><td id='cell31'> </td><td id='cell32'> </td><td id='cell33'> </td><td id='cell34'> </td><td id='cell35'> </td></tr>
<tr id='lastRow'><td id='cell36'> </td><td id='cell37'> </td></tr>
</tbody>
</table>
<table id='bcNavigation'><tr>
<td id='bcFootPrev'></td>
<td id='bcFootAll'></td>
<td id='bcFootNext'></td>
</tr></table>

<div id='calLoadingStatus' style='display:none; text-align:center;'>
<script type='text/javascript'>bcLoadStatus();</script>
</div>
<div id='calendarDisplay'/>
</div>

<script type='text/javascript'> initCal();</script>
</b:includable>
<b:includable id='posts' var='posts'>
<!-- posts not needed for Calendar -->
</b:includable>
<b:includable id='menu' var='data'>
Configure your calendar archive widget - Edit archive widget - Flat List - Newest first - Choose any Month/Year Format
</b:includable>
<b:includable id='interval' var='intervalData'>
Configure your calendar archive widget - Edit archive widget - Flat List - Newest first - Choose any Month/Year Format
</b:includable>
</b:widget>
dove il titolo del widget "Archivio blog" può essere sostituito con un altro. Adesso cercate la riga
</head>
e, immediatamente sopra, incollate il seguente codice
<!-- Inizio Calendario Archivio Blog -->
/* Incollare il CSS prescelto */
<script src='http://sites.google.com/site/ideepercomputeredinternet/calendario/blogger_archive.js' type='text/javascript'/>
<script src='/feeds/posts/summary?max-results=0&amp;alt=json-in-script&amp;callback=timezoneSet'/>
<!-- Fine Calendario Archivio Blog -->
Per quanto riguarda la riga evidenziata di rosso serve per incollare il CSS (foglio di stile) che preferite tra quelli che vi metterò a disposizione e che darà l'aspetto definitivo all'archivio con calendario. Salvate il modello.
Adesso andate in Layout > Elementi pagina
calendario-4
e cliccate su Modifica nell'elemento "Archivio del Blog". Dovete mettere il segno di spunta a Elenco compresso in Stile e a Mensile in Frequenza archiviazione, se volete potete modificare il Titolo del gadget. Cliccate su Salva per terminare.
Phideax3 ha configurato quattro diversi modelli per il widget dell'archivio con calendario. Date uno sguardo alla pagina e scegliete quello che vi piace di più appuntandovi il nome. Di seguito riporto i codici per ciascun modello
Blue Black
<link href='http://sites.google.com/site/ideepercomputeredinternet/calendario/blue_black.css' rel='stylesheet' type='text/css'/>
Dark Theme
<link href='http://sites.google.com/site/ideepercomputeredinternet/calendario/dark_theme.css' rel='stylesheet' type='text/css'/>
Dusty Blue
<link href='http://sites.google.com/site/ideepercomputeredinternet/calendario/dusty_blue.css' rel='stylesheet' type='text/css'/>
Plain White
<link href='http://sites.google.com/site/ideepercomputeredinternet/calendario/plain_white.css' rel='stylesheet' type='text/css'/>
Andate nuovamente su Layout > Modifca HTML. Copiate il codice del foglio di stile che preferite e sostituitelo alla riga
/* Incollare il CSS prescelto */
presente nel blocco di codice inserito sopra al tag </head>, come mostrato in questo screenshot
calendario-5
Nel blog di cui il link all'inizio dell'articolo ho inserito quello Blue Black. Abbiamo finito e non resta che salvare il modello per l'ultima volta. Credo invece che sia la prima volta che questo widget per Blogger sia stato presentato da un blog italiano, tradotto nella nostra lingua. E' indubbiamente un modo molto originale di presentare l'archivio ai visitatori del blog.
Aggiornamento: Ho aggiunto un file CSS con i colori di questo blog che ho chiamato blue-red. Se volete scegliere quell'aspetto ecco il codice da inserire con le modalità appena descritte
Blue Red
<link href='http://sites.google.com/site/ideepercomputeredinternet/calendario/blue_red.css' rel='stylesheet' type='text/css'/>


26 commenti :

  1. bello davvero!! urkukan!! l'ho installato subitanemante subito ;)
    dengiù

    RispondiElimina
  2. è la prima volta che modifico il cod html del mio blog previo salvataggio e devo dire che tutto ha funzionato alla grande .. ottimo widget, molto meglio di quello che passa il convento

    RispondiElimina
  3. @Tex Willer
    Ho visto! Hai fatto un ottimo lavoro

    RispondiElimina
  4. ciao parsifal,bellissimo come tutti gli altri widget che hai pubblicato fino ad oggi,anche se la maggior parte di essi vanno al di la' delle mie possibilita'di comprensione, complimenti per la semplicita' con cui descrivi tutto quello che proponi,
    approfitto di questa occasione per augurarti buone feste e ringraziarti di tutto,cordiali saluti,alfonso.

    RispondiElimina
  5. Grazie, parsifal,
    per questo bellissimo suggerimento.
    Già sfruttato! Con il tuo modello :-)
    E ho sfruttato anche l'ultima segnalazione sulle pag statiche!
    Davvero grazie a voi che ci aiutate a gestire meglio i nostri spazi!
    g

    RispondiElimina
  6. Questo widget dell'archivio con calendario è veramente bello, però secondo me, per chi pubblica molti post nel corso del mese, questo widget facendo vedere "tutti" i titoli pubblicati tende ad espandere il blog in maniera considerevole e forse poco pratica per chi, comunque vuole mantenere un layout "corto"... mi domandavo, esiste la possibilità di fare espandere il widget solo se richiesto dall'utente che cerca nell'archivio?

    RispondiElimina
  7. @TexBlogger
    Non mi risulta che esista. In ogni caso il tempo di caricamento della pagina rimane immutato sia che si inserisca questo widget che si lasci l'archivio come di default.
    Il fatto che si vedano molti post è positivo perché aumentano le possibilità che un visitatore ci clicchi sopra e non esca subito dal blog

    RispondiElimina
  8. uff, peccato che non si possa eliminare l'elenco dei post sotto al widget, mi allungherebbe troppo il layout...

    RispondiElimina
  9. @filokalos
    guarda che l'archiviazione è mensile. Il mese scorso ho scritto cento post eppure non ho visto grossi inestetismi neppure al 31 Marzo.
    Ciao

    RispondiElimina
  10. Scusate ma io non ho mica capito come si istalla questo calendario....
    ho un blog con wordpress su un mio dominio ho cercato di venirne a capo ma niente
    qualcuno mi potrebbe dare una mano???

    RispondiElimina
  11. @Roberto
    Questo calendario è per blog sulla piattaforma Blogger. Non è possibile installarlo in uno su Wordpress.
    Comunque ci sono migliaia di plugin a disposizione per la tua piattaforma e certamente troverai qualcosa di simile.
    Ciao

    RispondiElimina
  12. Riprendo questo vecchio post complimentandomi con te, non capisco però perché il calendario non mostra tutti i post. Mi spiego: nonostante ogni giorno abbia almeno 4/5 post solo alcuni giorni di ogni mese sono cliccabili e hanno l'elenco dei post, da cosa pensi che possa dipendere?

    RispondiElimina
  13. Non sei il solo ad aver lamentato questo problema che però a me non è mai capitato. Può essere un bug di Blogger che si manifesta ogni tanto.
    Ciao

    RispondiElimina
  14. ciao!
    ho fnalmente installato questo bellissimo widget senza alcun problema grazie alla tua guida.
    Ho dovuto solo penare un po'per adattare il foglio di stile al layout del mio blog(se vuoi te lo passo).
    Mi si è, però, ristretta la "cella" in basso, quella con la scritta "SCORRI ARCHIVIO". Come posso riallargarla fino alla larghezza delle altre?

    RispondiElimina
  15. Non capisco perchè sotto il calendario mi viene comunque l'elenco dei film. Ti renderei merito se mi dessi un occhiata al blog e mi dicessi come fare.. comunque originalissimo! :)
    http://filmitaliamegaupload.blogspot.com/

    RispondiElimina
  16. @parsifal32
    meglio scusa si può togliere l'elenco sotto?

    RispondiElimina
  17. @Corvo Michele Si tratta dell'elenco dei post del mese. E' un widget analogo a quello degli ultimi post solo che fa vedere tutti quelli del mese. Il 1 Aprile andrà via da solo, poi inizierà a crescere man mano che pubblicherai articoli.

    RispondiElimina
  18. @Ernesto T. dio grazie, mie era sfuggito il passaggio scusa!

    RispondiElimina
  19. Ciao, io ho un problema, il calendario dell'archivio funziona a meraviglia, solo che tra i post elencati sotto mi inserisce anche quelli salvati in bozze e non ancora pubblicati. Logicamente questi ultimi vorrei non fossero inseriti. Grazie

    RispondiElimina
  20. Ah dimenticavo, ora ho ripristinato l'archivio che avevo in precedenza.

    RispondiElimina
  21. @Lori
    Probabilmente Blogger ha cambiato delle impostazioni perché anche nei miei blog di prova il widget non funziona più bene.

    RispondiElimina
  22. grazie ernesto in efetti neanche io ce l'ho più è sparito!è una vera tragedia ernesto,non funziona più neanche l'effetto query per dividere la sidebar in schede!!

    RispondiElimina
  23. Grazie ai tuoi consigli sto riuscendo a fare un blog davvero bello!

    RispondiElimina

Non inserire link cliccabili altrimenti il commento verrà eliminato. Metti la spunta a Inviami notifiche per essere avvertito via email di nuovi commenti.
Info sulla Privacy