Leggere e visualizzare Feed Rss: Feed Reader

Gli RSS sono un popolare formato tramite in quale mostrare su un sito contenuti provenienti dall' esterno, come ad esempio le Ultime Notizie di TGcom. Ebbene, in questo tutorial vedremo come inserire in una pagina web un lettore RSS dall' aspetto assai gradevole. Per la ricezione degli RSS verrà usato un semplice script PHP ("LarsRSS"), mentre per la pubblicazione dei contenuti ricavati, si farà uso di Ajax e DHTML.

Ecco le features che presenterà tale script:

  • Possibilità di scegliere quali elementi del feed mostrare nella pagina, scegliendo tra titolo, descrizione, data di pubblicazione, autore, ecc-
  • Ciascun feed RSS è salvato sul webserver
  • Possibilità di modificarne le impostazioni-base, tramite JavaScript (ogni quanto salvare gli RSS sul webserver, quale stile CSS utilizzare, quale parte del feed mostrare, ecc)
  • Possibilità di attivare l' effetto "diffusione" tra un messaggio e l' altro, per un look ancora più accattivante
  • Possibilità di stoppare l' alternarsi dei feed al passaggio del mouse
  • Possibilità di leggere più feed RSS, mantenendo per ciascuno diverse impostazioni

Per iniziare, ecco la demo di ciò che andremo a creare.

Ciascun lettore RSS viene richiamato nella pagina singolarmente ed indipendentemente dagli altri, mediante questo script:

<script type="text/javascript">
//rssticker_ajax(RSS_id, cachetime, divId, divClass, delay, optionalswitch)
new rssticker_ajax("BBC" , 1200, "ddbox" , "bbcclass" , 3500, "date+description")
</script>

Per poter continuare, è indispensabile il download e l' installazione di RSStickerajax.zip contenente:

  • demo.htm: una demo di ciò che creeremo
  • rssticker.jr: la libreria Javascript necessaria per la lettura degli RSS
  • lastrss/bridge.php: lo script PHP che mostra i feed in formato XML
  • lastrss/lastRSS.php: la classe lastRSS.php

Ecco le operazioni da seguire per

1)demo.html:

Apriamo demo.html ed accertiamoci che il percorso di rssticker sul server corrisponda a quello impostato in

<script src="rssticker.js" type="text/javascript">
//credit notice here
</script>

All' interno della tag BODY vi è la porzione di codice necessaria per avviare la lettura dell' RSS; La chiamata-base, che potremo trasportare ovunque per la pagina, a seconda della locazione nella quale la vorremo porre, è:

<script type="text/javascript">

//rssticker_ajax(RSS_id, cachetime, divId, divClass, delay, optionalswitch)


1)"RSS_id" è il nome del feed RSS da leggere
2)"cachetime" viene espresso in secondi e rappresenta ogni quanto tempo salvare sul server gli RSS ricevuti
3)"divId" è l' ID numerico associato a ciascuna istanza di lettura
4)"Divclass" è il nome della classe CSS che verrà associata al lettore RSS
5)"Delay" è il tempo di attesa tra un RSS ed il successivo
6)"optionalswitch" determina invece quali elmenti dell' RSS mostrare. Di default, ne mostra titolo + link, ma impostando il parametro a "date+description" , l' output per ciascun RSS sarà: titolo + link + data + descrizione

new rssticker_ajax("BBC" , 600, "ddbox" , "bbcclass" , 3500, "date+description")

</script>

2) rssticker.js:

Apriamo rssticker.js ed accertiamoci che la path di "bridge.php" sia corretta

//URL Relativo:
var lastrssbridgeurl="lastrss/bridge.php"
//URL Assoluto (uncomment below)
//var lastrssbridgeurl="http://" +window.location.hostname+ "/lastrss/bridge.php"

3) bridge.php:

Bridge.php è uno script PHP che permette la comunicazione tra lo script di lettura RSS e lastRSS.php per mezzo di Ajax. Editandone le sezioni corredate da commenti, si potranno modificare le impostazioni del lettore RSS.

4) lastRSS.php

nessuna operazione in particolare

Personalizzazione dello script:

Una volta installato, potremo personalizzare il il lettore RSS semplicemente editandone la chiamata in JavaScript

<script type="text/javascript">
//rssticker_ajax(RSS_id, cachetime, divId, divClass, delay, optionalswitch)
new rssticker_ajax("BBC" , 1200, "ddbox" , "bbcclass" , 3500, "date+description")
</script>

Come possiamo notare, presenta infatti un buon numero di parametri, ciascuno corrispondente ad un settaggio:

  • "RSS_id" è il nome del feed RSS da leggere
  • "cachetime" viene espresso in secondi e rappresenta ogni quanto tempo salvare sul server gli RSS ricevuti
  • "divId" è l' ID numerico associato a ciascuna istanza di lettura
  • "bbcclass" è il nome della classe CSS che verrà associata al lettore RSS
  • "optionalswitch" determina invece quali elmenti dell' RSS mostrare. Di default, ne mostra titolo + link, ma impostando il parametro a "date+description" , l' output per ciascun RSS sarà: titolo + link + data + descrizione

Più in alto avevamo accennato all' effetto "diffusione" che poteva caratterizzare lo scorrimento degli RSS ricevuti. ebbene, per impostarlo basterà editare la classe CSS associata al lettore, aggiungendovi:

filter:progid:DXImageTransform.Microsoft.alpha(opacity€);
-moz-opacity: 0.8;

 



Ti potrebbe interessare anche

commenta la notizia

C'è 1 commento
Redazione
Ti interessano altri articoli su questo argomento?
Chiedi alla nostra Redazione!