Pubblicato il 03/02/10 - aggiornato il  | 4 commenti :

Come inserire il widget degli Ultimi Articoli direttamente nel modello di Blogger.

L'inserimento dei commenti recenti nel modello di Blogger ho riscontrato essere possibile solo in determinati template e con procedimento reiterato. Con il widget degli Ultimi Articoli non ho invece riscontrato alcun problema, nel caso si presentassero vi prego di comunicarmelo.
Questo metodo di inserimento dei widget serve per due ragioni
  1. Velocizzare il caricamento della pagina visto che non si richiedono indirizzi esterni
  2. Evitare problemi di blackout del sito in cui sono stati caricati gli script
Il procedimento è semplicissimo. Si va su Layout > Modifica HTML e dopo aver salvato il modello completo si cerca la riga
</head>
immediatamente sopra si incolla lo script del widget. E' meglio inserire dei commenti all'inizio e alla fine per essere sicuri di riconoscere il codice per eventuali future modifiche

<!--ULTIMI ARTICOLI INIZIO-->
<script type='text/javascript'>
//<![CDATA[
//credit to hoctro - tradotto da Parsifal32 - parsifal32.blogspot.com

function rp(json) {
document.write('<ul>');for (var i = 0; i < numposts; i++) {
document.write('<li>');
var entry = json.feed.entry[i];
var posttitle = entry.title.$t;
var posturl;
if (i == json.feed.entry.length) break;
for (var k = 0; k < entry.link.length; k++) {
if (entry.link[k].rel == 'alternate') {
posturl = entry.link[k].href;
break;
}
}
posttitle = posttitle.link(posturl);
var readmorelink = "(leggi tutto)";
readmorelink = readmorelink.link(posturl);
var postdate = entry.published.$t;
var cdyear = postdate.substring(0,4);
var cdmonth = postdate.substring(5,7);
var cdday = postdate.substring(8,10);
var monthnames = new Array();
monthnames[1] = "Gen";
monthnames[2] = "Feb";
monthnames[3] = "Mar";
monthnames[4] = "Apr";
monthnames[5] = "Mag";
monthnames[6] = "Giu";
monthnames[7] = "Lug";
monthnames[8] = "Ago";
monthnames[9] = "Set";
monthnames[10] = "Ott";
monthnames[11] = "Nov";
monthnames[12] = "Dic";
if ("content" in entry) {
var postcontent = entry.content.$t;
} else if ("summary" in entry) {
var postcontent = entry.summary.$t;
} else
var postcontent = "";
var re = /<\S[^>]*>/g;
postcontent = postcontent.replace(re, "");
document.write(posttitle);
if (showpostdate == true) document.write(' - ' + monthnames[parseInt(cdmonth,10)] + ' ' + cdday);
if (showpostsummary == true) {
if (postcontent.length < numchars) {
document.write(postcontent);
} else {
postcontent = postcontent.substring(0, numchars);
var quoteEnd = postcontent.lastIndexOf(" ");
postcontent = postcontent.substring(0,quoteEnd);
document.write(postcontent + '...' + readmorelink);
}
}
document.write('</li>');
}
document.write('</ul>');
}
//]]>
</script>
<!--ULTIMI ARTICOLI FINE-->
come mostrato dal seguente screenshot
ultimi-articoli
Adesso andate in Layout > Elementi pagina > Aggiungi un gadget > HTML/Javascript e in Sezione del sito incollate questo codice
<script>
var numposts = 8;
var showpostdate = false;
var showpostsummary = false;
var numchars = 100;
</script>
<script src="http://parsifal32.blogspot.com/feeds/posts/default?orderby=published&alt=json-in-script&callback=rp"></script>
<div style="font-size:50%;text-align:center"><p> <a href="http://goo.gl/2O9J">Install widget</a> </p></div>
Le personalizzazioni riguardano
  1. Il numero di articoli da visualizzare (8)
  2. Se si vuole mostrare anche la data del post (false non si mostra true invece sì)
  3. L'opzione di mostrare il sommario del post (false non si visualizza con true invece sì)
  4. Il numero dei caratteri del sommario (100) nel caso si sia scelto true alla riga precedente
  5. Ovviamente l'URL del blog evidenziato di rosso
Dopo aver inserito il Titolo del widget si clicca su Salva e con il drag & drop si posiziona andando su Layout > Elementi pagina. La realizzazione può essere vista nel post demo dedicato agli articoli recenti.
Nella demo ho scelto di non mostrare né sommario dell'articolo, né data. Se invece si scelgono le altre opzioni il widget avrà questa forma
        image         ultimi-articoli-3       ultimi-articoli-3




4 commenti :

  1. Ciao, hai un'idea di come fare la stessa cosa ma con dei feed che NON siano di un blog su blogger?
    Grazie! :)

    RispondiElimina
  2. @Giorgiogal
    So che i feed di un blog wordpress sono
    http://www.nomedominio.com/feed/
    poi il modo di inserirli in questo contesto non lo conosco. Loro hanno un sacco di plugin e non hanno di questi problemi...

    RispondiElimina
  3. Ok. ma se sostituisco il feed di worpress (ad esempio) a quello di blogger non funziona. Es:
    < s cript src="http://www.nomedominio.com/feed?alt=json-in-script&callback=rp" >< /s cript >
    Hai un'idea del perché? il json non funziona con tutti i feed? hai un'idea di come fare?
    Grazie!

    RispondiElimina
  4. @giorgiogal
    Il json funziona con Blogger perché sono state fissate le istruzioni di inserimento in BloggerBuzz quattro anni fa. Leggi qua sotto
    http://buzz.blogger.com/2006/11/json-on-new-blogger.html
    dovresti trovare delle istruzioni di inserimento anche per wordpress o, meglio ancora, per un feed generico.
    Personalmente non ne sono a conoscenza.
    Ciao

    RispondiElimina

Non inserire link cliccabili altrimenti il commento verrà eliminato. Metti la spunta a Inviami notifiche per essere avvertito via email di nuovi commenti. Se ti ho aiutato con il post o con le risposte ai commenti condividi su Facebook o su Twitter. Grazie.