Bonjour,
je rencontre quelques souci pour l'instalation d'un petit lecteur rss sur mon forum xooit.
j'ai le script en local qui fonctionne parfaitement,
pour le mettre sur mon forum, je met cette partie entre les balises body:
<div id="logo-rss"><a href="http://espace-bonsai.xooit.info/rss.php" title=""><img style="margin-left:15px; margin-top:18px;" src="http://img77.imageshack.us/img77/4613/buttonrssgv3.png" width="50" height="21" border="0" /></a></div>
<script type="text/javascript">
var cssfeed=new gfeedpausescroller("example1", "example1class", 2500, "_new")
cssfeed.addFeed("Espace bonsai", "http://espace-bonsai.xooit.info/rss.php")
cssfeed.displayoptions("datetime snippet")
cssfeed.setentrycontainer("div")
cssfeed.filterfeed(20, "date")
cssfeed.entries_per_page(1)
cssfeed.init()
</script>
un peu de css dans ma feuille de style:
.titlefield { text-decoration: none; font-weight:bold; color: #900000; }
.labelfield { color:#4d4d4f; }
.datefield{ color:gray; }
#example1{
float:left;
width: 800px;
height: 50px;
border: 2px dotted #6d7549;
padding: 5px 0 3px 15px ;
background-color: #b4a297;
color: #4d4d4f;
}
#logo-rss {
float:left;
width:80px;
height:58px;
border-top: 2px dotted #6d7549;
border-left: 2px dotted #6d7549;
border-bottom: 2px dotted #6d7549;
background-color: #b9b7a3;
}
pour creer le template js sur mon forum, j'heberge le fichier.js
sur xooimage. il me donne ce lien:
Ex: http://.../gajaxscroller.js
que je place dans l'appel du js (obligé de faire comme ça sur les forums gratuit)
<script type="text/javascript" src="http://.../gajaxscroller.js"></script>
sa crér correctement le template .js que voici:
// -------------------------------------------------------------------
// gAjax RSS Pausing Scroller- By Dynamic Drive, available at: http://www.dynamicdrive.com
// Created: Aug 2nd, 2007 Updated: n/a
// REQUIRES: gfeedfetcher.js class, available at http://dynamicdrive.com/dynamicindex18/gajaxrssdisplayer.htm
// -------------------------------------------------------------------
var gfeedfetcher_loading_image="indicator.gif" //Specify full URL to "loading" image. Overwrites same var from gfeedfetcher.js
function gfeedpausescroller(divid, divClass, delay, linktarget){
this.tickerid=divid //ID of outermost scroller div
this.delay=parseInt(delay) //Default delay between msg change, in miliseconds.
this.mouseoverBol=0 //Boolean to indicate whether mouse is currently over scroller (and pause it if it is)
this.hiddendivpointer=1 //index of RSS feed array's entry for hidden div
this.itemsperpage=1 //Entries to show per page
document.write('<div id="'+divid+'" class="'+divClass+'" style="position: relative; overflow: hidden">')
document.write('<div class="innerDiv" style="position: absolute; width: 100%" id="'+divid+'1"><span style="position: absolute">Initializing RSS scroller...</span></div>')
document.write('<div class="innerDiv" style="position: absolute; width: 100%; visibility: hidden" id="'+divid+'2"></div>')
gfeedfetcher.call(this, divid+"unneeded", divClass+"unneeded", linktarget) //inherit properties from "gfeedfetcher" class, but feed it bogus ID/Class, as we won't be using the DIV generated by "gfeedfetcher"
document.write('</div>')
this.itemcontainer="<div>" //default element wrapping around each RSS entry
this.feedcontainer.style.display="none" //Hide unneeded div generated after inheriting properties from "gfeedfetcher" class
this.feedcontainer=document.getElementById(divid+'1') //overwrite inherited "feedcontainer" to reference the first DIV within scroller container
this.tickerdiv=document.getElementById(divid)
this.visiblediv=document.getElementById(divid+"1")
this.hiddendiv=document.getElementById(divid+"2")
this.visibledivtop=parseInt(this.tickerdiv.currentStyle? this.tickerdiv.currentStyle["paddingTop"] : window.getComputedStyle? window.getComputedStyle(this.tickerdiv, "").getPropertyValue("padding-top") : 0) //Determine the "top" boundary of the visible div, factoring in any CSS padding
this.tickerdivwidth=this.tickerdiv.currentStyle? parseInt(this.tickerdiv.currentStyle["width"]) : this.tickerdiv.offsetWidth //IE has trouble getting offsetWidth while page is loading, so use global CSS value instead
this.tickerdivheight=this.tickerdiv.currentStyle? parseInt(this.tickerdiv.currentStyle["height"])+50 : 0 //IE has trouble getting offsetWidth while page is loading, so use global CSS value instead. "50" accounts for any possible padding skewing things. Variable used by any other browser.
}
gfeedpausescroller.prototype=new gfeedfetcher //inherit methods from gfeedfetcher class
gfeedpausescroller.prototype.constructor=gfeedpausescroller
gfeedpausescroller.prototype._displayresult=null //Remove inherited method "_displayresult()"
// -------------------------------------------------------------------
// entries_per_page()- Sets the number of RSS entries to display per page (at once)
// -------------------------------------------------------------------
gfeedpausescroller.prototype.entries_per_page=function(num){
this.itemsperpage=num
}
// -------------------------------------------------------------------
// _signaldownloadcomplete()- Signals to the rest of the script when the fetching of all RSS feeds is complete
// -------------------------------------------------------------------
gfeedpausescroller.prototype._signaldownloadcomplete=function(){ //overwrite inherited method "_signaldownloadcomplete()"
this.feedsfetched+=1
if (this.feedsfetched==this.feedurls.length) //if all feeds fetched
this._populateticker(this.feeds) //Populate the two DIVs within scroller with the fetched data
}
// -------------------------------------------------------------------
// _populateticker()- Pre-populates the two DIVs of the scroller with the 1st and 2nd RSS entries.
// -------------------------------------------------------------------
gfeedpausescroller.prototype._populateticker=function(feeds){
gfeedfetcher._sortarray(feeds, this.sortstring)
//set width of inner DIVs to outer DIV's width minus padding (padding assumed to be top padding x 2)
this.visiblediv.style.width=this.hiddendiv.style.width=parseInt(this.tickerdivwidth)-(this.visibledivtop*2)+"px"
this.itemsperpage=(this.itemsperpage>=feeds.length)? 1 : this.itemsperpage //Adjust "itemsperpage" if needed (based on total # of avail entries)
var feedslice1=feeds.slice(0, this.itemsperpage) //Get subsection of feed array based on how many entries to show at once
this.hiddendivpointer=this.itemsperpage //Set the feed array index of the hidden div accordingly
var feedslice2=feeds.slice(this.hiddendivpointer, this.hiddendivpointer+this.itemsperpage)
this.visiblediv.innerHTML=formatrssmessage(feedslice1, this.showoptions, this.itemcontainer, this.linktarget)
this.hiddendiv.innerHTML=formatrssmessage(feedslice2, this.showoptions, this.itemcontainer, this.linktarget)
this._initscroller()
}
// -------------------------------------------------------------------
// _initscroller()- Initialize the scroller by setting initial positions of the two dinner DIVs, start up down animation
// -------------------------------------------------------------------
gfeedpausescroller.prototype._initscroller=function(){
var scrollerinstance=this
this.getinline(this.visiblediv, this.hiddendiv)
this.hiddendiv.style.visibility="visible"
//set width of inner DIVs to outer DIV's width minus padding (padding assumed to be top padding x 2)
this.visiblediv.style.width=this.hiddendiv.style.width=parseInt(this.tickerdivwidth)-(this.visibledivtop*2)+"px"
this.tickerdiv.onmouseover=function(){scrollerinstance.mouseoverBol=1}
this.tickerdiv.onmouseout=function(){scrollerinstance.mouseoverBol=0}
if (window.attachEvent) //Clean up loose references in IE
window.attachEvent("onunload", function(){scrollerinstance.tickerdiv.onmouseover=scrollerinstance.tickerdiv.onmouseout=null})
setTimeout(function(){scrollerinstance._animateup()}, this.delay)
}
// -------------------------------------------------------------------
// formatrssmessage()- Global function that formats a RSS entry(s) to the desired components (title, date, description etc)
// -------------------------------------------------------------------
function formatrssmessage(feedslice, showoptions, itemcontainer, linktarget){
var rssoutput=(itemcontainer=="<li>")? "<ul>\n" : "" //if "itemcontainer" is set to "<li>", define a "<ul>" tag to wrap around the result
for (var i=0; i<feedslice.length; i++){ //Loop through the entered slice of a RSS feed (1 or more entries)
var itemtitle="<a href=\"" + feedslice[i].link + "\" target=\"" + linktarget + "\" class=\"titlefield\">" + feedslice[i].title + "</a>"
var itemlabel=/label/i.test(showoptions)? '<span class="labelfield">['+feedslice[i].ddlabel+']</span>' : " "
var itemdate=gfeedfetcher._formatdate(feedslice[i].publishedDate, showoptions)
var itemdescription=/description/i.test(showoptions)? "<br />"+feedslice[i].content : /snippet/i.test(showoptions)? "<br />"+feedslice[i].contentSnippet : ""
rssoutput+=itemcontainer + itemtitle + " " + itemlabel + " " + itemdate + "\n" + itemdescription + itemcontainer.replace("<", "</") + "\n\n"
}
rssoutput+=(itemcontainer=="<li>")? "</ul>\n" : ""
return rssoutput
}
// -------------------------------------------------------------------
// _animateup()- Move the two inner divs of the scroller up and in sync
// -------------------------------------------------------------------
gfeedpausescroller.prototype._animateup=function(){
var scrollerinstance=this
if (parseInt(this.hiddendiv.style.top)>(this.visibledivtop+5)){
this.visiblediv.style.top=parseInt(this.visiblediv.style.top)-5+"px"
this.hiddendiv.style.top=parseInt(this.hiddendiv.style.top)-5+"px"
setTimeout(function(){scrollerinstance._animateup()}, 40)
}
else{
this.getinline(this.hiddendiv, this.visiblediv)
this._swapdivs()
setTimeout(function(){scrollerinstance._rotatemessage()}, this.delay)
}
}
// -------------------------------------------------------------------
// _swapdivs()- Swap between which is the visible and which is the hidden div
// -------------------------------------------------------------------
gfeedpausescroller.prototype._swapdivs=function(){
var tempcontainer=this.visiblediv
this.visiblediv=this.hiddendiv
this.hiddendiv=tempcontainer
}
gfeedpausescroller.prototype.getinline=function(div1, div2){
div1.style.top=this.visibledivtop+"px"
div2.style.top=Math.max(div1.parentNode.offsetHeight || this.tickerdivheight, div1.offsetHeight)+"px"
}
// -------------------------------------------------------------------
// _rotatemessage()- Populate the hidden div with the next message before it's visible
// -------------------------------------------------------------------
gfeedpausescroller.prototype._rotatemessage=function(){
var scrollerinstance=this
if (this.mouseoverBol==1) //if mouse is currently over scoller, do nothing (pause it)
setTimeout(function(){scrollerinstance._rotatemessage()}, 100)
else{
var i=this.hiddendivpointer
var ceiling=this.feeds.length
this.hiddendivpointer=(i+this.itemsperpage>ceiling-1)? 0 : i+this.itemsperpage
var feedslice=this.feeds.slice(this.hiddendivpointer, this.hiddendivpointer+this.itemsperpage)
this.hiddendiv.innerHTML=formatrssmessage(feedslice, this.showoptions, this.itemcontainer, this.linktarget)
this._animateup()
}
}
// -------------------------------------------------------------------
// gAjax RSS Feeds Displayer- By Dynamic Drive, available at: http://www.dynamicdrive.com
// Created: July 17th, 2007 Updated: n/a
// -------------------------------------------------------------------
var gfeedfetcher_loading_image="indicator.gif" //Full URL to "loading" image. No need to config after this line!!
google.load("feeds", "1") //Load Google Ajax Feed API (version 1)
function gfeedfetcher(divid, divClass, linktarget){
this.linktarget=linktarget || "" //link target of RSS entries
this.feedlabels=[] //array holding lables for each RSS feed
this.feedurls=[]
this.feeds=[] //array holding combined RSS feeds' entries from Feed API (result.feed.entries)
this.feedsfetched=0 //number of feeds fetched
this.feedlimit=5
this.showoptions="" //Optional components of RSS entry to show (none by default)
this.sortstring="date" //sort by "date" by default
document.write('<div id="'+divid+'" class="'+divClass+'"></div>') //output div to contain RSS entries
this.feedcontainer=document.getElementById(divid)
this.itemcontainer="<li>" //default element wrapping around each RSS entry item
}
gfeedfetcher.prototype.addFeed=function(label, url){
this.feedlabels[this.feedlabels.length]=label
this.feedurls[this.feedurls.length]=url
}
gfeedfetcher.prototype.filterfeed=function(feedlimit, sortstr){
this.feedlimit=feedlimit
if (typeof sortstr!="undefined")
this.sortstring=sortstr
}
gfeedfetcher.prototype.displayoptions=function(parts){
this.showoptions=parts //set RSS entry options to show ("date, datetime, time, snippet, label, description")
}
gfeedfetcher.prototype.setentrycontainer=function(containerstr){ //set element that should wrap around each RSS entry item
this.itemcontainer="<"+containerstr.toLowerCase()+">"
}
gfeedfetcher.prototype.init=function(){
this.feedsfetched=0 //reset number of feeds fetched to 0 (in case init() is called more than once)
this.feeds=[] //reset feeds[] array to empty (in case init() is called more than once)
this.feedcontainer.innerHTML='<img src="'+gfeedfetcher_loading_image+'" /> Retrieving RSS feed(s)'
var displayer=this
for (var i=0; i<this.feedurls.length; i++){ //loop through the specified RSS feeds' URLs
var feedpointer=new google.feeds.Feed(this.feedurls[i]) //create new instance of Google Ajax Feed API
var items_to_show=(this.feedlimit<=this.feedurls.length)? 1 : Math.floor(this.feedlimit/this.feedurls.length) //Calculate # of entries to show for each RSS feed
if (this.feedlimit%this.feedurls.length>0 && this.feedlimit>this.feedurls.length && i==this.feedurls.length-1) //If this is the last RSS feed, and feedlimit/feedurls.length yields a remainder
items_to_show+=(this.feedlimit%this.feedurls.length) //Add that remainder to the number of entries to show for last RSS feed
feedpointer.setNumEntries(items_to_show) //set number of items to display
feedpointer.load(function(r){displayer._fetch_data_as_array(r)}) //call Feed.load() to retrieve and output RSS feed
}
}
gfeedfetcher._formatdate=function(datestr, showoptions){
var itemdate=new Date(datestr)
var parseddate=(showoptions.indexOf("datetime")!=-1)? itemdate.toLocaleString() : (showoptions.indexOf("date")!=-1)? itemdate.toLocaleDateString() : (showoptions.indexOf("time")!=-1)? itemdate.toLocaleTimeString() : ""
return "<span class='datefield'>"+parseddate+"</span>"
}
gfeedfetcher._sortarray=function(arr, sortstr){
var sortstr=(sortstr=="label")? "ddlabel" : sortstr //change "label" string (if entered) to "ddlabel" instead, for internal use
if (sortstr=="title" || sortstr=="ddlabel"){ //sort array by "title" or "ddlabel" property of RSS feed entries[]
arr.sort(function(a,b){
var fielda=a[sortstr].toLowerCase()
var fieldb=b[sortstr].toLowerCase()
return (fielda<fieldb)? -1 : (fielda>fieldb)? 1 : 0
})
}
else{ //else, sort by "publishedDate" property (using error handling, as "publishedDate" may not be a valid date str if an error has occured while getting feed
try{
arr.sort(function(a,b){return new Date(b.publishedDate)-new Date(a.publishedDate)})
}
catch(err){}
}
}
gfeedfetcher.prototype._fetch_data_as_array=function(result){
var thisfeed=(!result.error)? result.feed.entries : "" //get all feed entries as a JSON array or "" if failed
if (thisfeed=="") //if error has occured fetching feed
alert("Google Feed API Error: "+result.error.message)
for (var i=0; i<thisfeed.length; i++) //For each entry within feed
result.feed.entries[i].ddlabel=this.feedlabels[this.feedsfetched] //extend it with a "ddlabel" property
this.feeds=this.feeds.concat(thisfeed) //add entry to array holding all feed entries
this._signaldownloadcomplete() //signal the retrieval of this feed as complete (and move on to next one if defined)
}
gfeedfetcher.prototype._signaldownloadcomplete=function(){
this.feedsfetched+=1
if (this.feedsfetched==this.feedurls.length) //if all feeds fetched
this._displayresult(this.feeds) //display results
}
gfeedfetcher.prototype._displayresult=function(feeds){
var rssoutput=(this.itemcontainer=="<li>")? "<ul>\n" : ""
gfeedfetcher._sortarray(feeds, this.sortstring)
for (var i=0; i<feeds.length; i++){
var itemtitle="<a href=\"" + feeds[i].link + "\" target=\"" + this.linktarget + "\" class=\"titlefield\">" + feeds[i].title + "</a>"
var itemlabel=/label/i.test(this.showoptions)? '<span class="labelfield">['+this.feeds[i].ddlabel+']</span>' : " "
var itemdate=gfeedfetcher._formatdate(feeds[i].publishedDate, this.showoptions)
var itemdescription=/description/i.test(this.showoptions)? "<br />"+feeds[i].content : /snippet/i.test(this.showoptions)? "<br />"+feeds[i].contentSnippet : ""
rssoutput+=this.itemcontainer + itemtitle + " " + itemlabel + " " + itemdate + "\n" + itemdescription + this.itemcontainer.replace("<", "</") + "\n\n"
}
rssoutput+=(this.itemcontainer=="<li>")? "</ul>" : ""
this.feedcontainer.innerHTML=rssoutput
}
Et pour finir, j'ai demander un apikey à google pour que le rss soir reconnu.
<script type="text/javascript" src="http://www.google.com/jsapi?key=ABQIAAAAc8QhfO9HJdkMnhqWGXVlXhR7IU8eZNt8TDnjBezIDE7AeHeqlRQ18y1pv4iRveOgi5fp3nSpTxUu9g"></script>
Voilà j'aimerais donc comprendre, là je suis un peu dépassé..
j'ai surrement oublié un truc mais lequel,
Pourquoi fonctionne t'il parfaitement en local et pas sur mon forum.
faut t'il déclarer que l'on utilise AJAX ? avec un http/request, j'ai lu ça quelques part sans vraiment comprendre..
Merci d'avance pour l'aide que vous pourrez m'apporter. 
Liste des membres
Calendrier
Aide
/
[Résolu] [AJAX] Feeds Rss, comment sa marche?
![[Valid RSS]](http://www.pcinfo-web.com/valid-rss.png "Validate my RSS feed")
