05 settembre 2011

Come creare un menù verticale con tutti i titoli degli articoli.

Avevo già presentato questa interessantissima personalizzazione che non si sa se definire menù o widget. Serve per mostrare in un elenco verticale con barra di scorrimento tutti i post del blog o solo gli ultimi 1000 articoli se ne avete pubblicati un numero superiore. Tale widget si basava sui Pipes di Yahoo e quindi aveva smesso di funzionare come del resto molti altri gadget che utilizzavano lo stesso strumento in fase di aggiornamento da V1 a V2.

Dai dati di Yahoo mi risulta che più di 50 persone avevano clonato il Pipe e quindi erano in molti che lo stavano usando. Ho pensato quindi di realizzare un altro Pipe funzionante in modo tale che, coloro che lo avevano nel blog, possano reinstallare il widget. Chi si trovasse in questa situazione può consultare il vecchio post, clonare nuovamente il Pipe e modificare il codice come illustrato.

Alternativamente possono seguire questo tutorial insieme agli altri che si accingono a installarlo per la prima volta. Ho creato due Pipe distinti. Il primo mostra gli Ultimi 1000 post mentre il secondo si limita a mostrare solo gli Ultimi 800. Se vi sembrano troppi si può sempre creare un altro Pipe che mostri un numero inferiore di post. Magari lasciatemelo scritto nei commenti e, se la richiesta di un nuovo limite sarà supportata da più persone, vedrò cosa posso fare.  

Per l'installazione si va su Layout > Aggiungi un gadget > HTML/Javascript e si incolla il seguente codice

<script type="text/javascript">
<!--
document.write('<select style="width:100%;"  onchange="location=this.options[this.selectedIndex].value;">');
function MenuPost(feed) {
var Titolo = "<option>Clicca per selezionare un post in ordine alfabetico</option>";
document.write(Titolo);
var i;
for (i = 0; i < feed.count ; i++)
{
var href = "'" + feed.value.items[i].link + "'";
var TitoloPost = feed.value.items[i].title;
var Elenco = "<option style='width:210px;' value=" + href + 'title="' + TitoloPost + '">' + TitoloPost;
document.write(Elenco);
document.write('</option>');
}
document.write('</select>');
document.write('<div style="font-size:60%;text-align:right"><a href="http://goo.gl/mVEps">Get widget</a></div>');
}
//-->
</script>
<script src="http://pipes.yahoo.com/pipes/pipe.run?
YourBlogUrl=http://www.ideepercomputeredinternet.com
&Order=alphabet
&_id=eb111916ba50a6d28a5a90c57b01c68a  
&_callback=MenuPost
&_render=json"
type="text/javascript"></script>
<noscript><a href='http://goo.gl/LlBrA' target='_blank'><span style='font-size: x-small;'>Drop Down Menu</span></a></noscript>

dove le personalizzazioni riguardano i seguenti elementi:

  1. L'inserimento dell'URL della homepage del blog senza slash finale
  2. La scelta dell'ordinamento tra alphabet e chrono con ovvio significato
  3. La scritta che appare nella prima voce del menù e che è evidenziata di viola

Per acquisire l'ID del Pipe si procede nello stesso modo visto con altri widget. Ci si reca nella Pipe di Yahoo che preferiamo

Dopo esserci loggati con il nostro account Yahoo, si clicca su Clone per copiare il Pipe, quindi inseriamo nei due campi l'URL del blog (senza slash finale) e una delle opzioni alphabet o chrono. Si va su Run Pipe per vedere se il Pipe ci funziona. Se, nella parte bassa della pagina, visualizziamo l'elenco dei nostri post significa che abbiamo svolto tutte le operazioni in modo corretto.

creare una pipe con yahoo

Non resta che copiare la stringa alfanumerica evidenziata di giallo nello screenshot e sostituirla a quella del codice. Il widget può essere collocato in una sidebar oppure in un'altra zona del template. All'occorrenza può anche essere posizionato in una pagina statica incollando lo script in Modalità HTML.

menu-widget-ultimi-mille-post

Ho postato due menù realizzati con questo script, il primo in ordine alfabetico in un elemento HTML e il secondo in ordine cronologico in una pagina statica




9 commenti:

  1. Mi sembra che funzioni ancora quello precedente. Va reinstallato ugualmente?

    RispondiElimina
  2. @Stefano
    Se ti funziona no, lo lasci com'è.

    RispondiElimina
  3. sei un genio ! Ora funziona ! ti bacio virtualmente anche se da vicino dato che abito a meno di mezz'ora da Firenze !

    ciao

    RispondiElimina
  4. Testato ed inserito. Stupendo!
    Ma se li volessi tutti quanti? (Ho pubblicato fin'ora più di 2000 post...).
    E' possibile?

    RispondiElimina
  5. @Benzene
    Al momento mi sono fermato a mille ma posso anche modificare il Pipe. Non ora però perché sono molto delicati e possono smettere di funzionare.

    RispondiElimina
  6. Corretto "l'errore dei primi 1000"... LOL... Un neurone si rifiuta di tornare dalle ferie :-) Grazie.
    Se dovessi modificare fammelo sapere!!!!!!!! (La mail dovresti averla per tutte le volte che stresso ha ha ha!!!!)
    Ciao e buona serata!

    RispondiElimina
  7. Dunque, sfruttando questo widget o in modo simile, si potrebbe avere in poco tempo un elenco con link di tutti i post del proprio blog e di poterli mettere in ordine alfabetico in un altro post?

    RispondiElimina
  8. @Corvo Michele
    Apri il menù qui sotto :)
    degli ultimi 800 post in ordine alfabetico

    RispondiElimina
  9. Grazie, l'ho inserito su uno dei miei blog, ottimo widget

    RispondiElimina

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