VIEW ALL GALLERY LIGHTS

Friday, September 24, 2010

Simplex News Aggregator - RSS reader template

One man who mailed to me request a template that can get RSS news from other sites . He has a lot of blogs ,so he want to make a portal that can aggregate latest posts from these blogs. Like a blog network ^^ Here is my result



Live Demo 

Download




This template is built base on GAjaxfetcher script from Dynamicdrive.com . I modified and imroved it for making this template .

This template can get RSS from other sites and display it in time order .
How to install this template :
1,Download this template .

2,Open it in any word editor you have

3,In template file ,you will see these div elements :

<div class="box">
                 <h1>Category 1</h1>
                 <script type="text/javascript">
                     var newsfeed=new gfeedfetcher("list1")
                     newsfeed.addFeed("NYT", "http://www.nytimes.com/services/xml/rss/nyt/International.xml")
                     newsfeed.addFeed("Yahoo News", "http://rss.news.yahoo.com/rss/world")
                     newsfeed.filterfeed(5) //Show 5 entries, sort by date
                     newsfeed.init() //Always call this last
                 </script>
             </div>

             <div class="box">
                 <h1>Category 2</h1>
                 <script type="text/javascript">
                     var newsfeed=new gfeedfetcher("list2")
                     newsfeed.addFeed("BBC", "http://feeds.bbci.co.uk/news/technology/rss.xml")
                     newsfeed.addFeed("CNN", "http://rss.cnn.com/rss/cnn_tech.rss")
                     newsfeed.addFeed("Pcworld", "http://feeds.pcworld.com/pcworld/techlog")
                     newsfeed.addFeed("todaypc", "http://feeds.pcworld.com/pcworld/blogs/todayatpcw")
                     newsfeed.filterfeed(5) //Show 5 entries, sort by date
                     newsfeed.init() //Always call this last
                 </script>
             </div>

             <div class="box">
                 <h1>Category 3</h1>
                 <script type="text/javascript">
                     var newsfeed=new gfeedfetcher("list3")
                     newsfeed.addFeed("BBC", "http://news.bbc.co.uk/rss/newsonline_world_edition/uk_news/politics/rss091.xml")
                     newsfeed.addFeed("CNN", "http://rss.cnn.com/rss/cnn_allpolitics.rss")
                     newsfeed.addFeed("YN", "http://rss.news.yahoo.com/rss/mideast")
                     newsfeed.filterfeed(5) //Show 5 entries, sort by date
                     newsfeed.init() //Always call this last
                 </script>
             </div>
            

Here is the code of first category
<div class="box">
                 <h1>Category 1</h1>
                 <script type="text/javascript">
                     var newsfeed=new gfeedfetcher("list1")
                     newsfeed.addFeed("NYT", "http://www.nytimes.com/services/xml/rss/nyt/International.xml")
                     newsfeed.addFeed("Yahoo News", "http://rss.news.yahoo.com/rss/world")
                     newsfeed.filterfeed(5) //Show 5 entries, sort by date
                     newsfeed.init() //Always call this last
                 </script>
             </div>


Let's take a closer look inside the code

- In this code <h1>Category 1</h1> is the title of category.

- This line var newsfeed=new gfeedfetcher("list1") define the element wrapping arround the RSS news , "list1" is the id of element . Id of element must be unique .
- This line newsfeed.addFeed("NYT", "http://www.nytimes.com/services/xml/rss/nyt/International.xml") will add a RSS feed at address http://www.nytimes.com/services/xml/rss/nyt/International.xml to the list of RSS source for Category 1 ,and NYT is the label of this feed source

-This line  newsfeed.addFeed("Yahoo News", "http://rss.news.yahoo.com/rss/world") is similar to the line above
-This line  newsfeed.filterfeed(5) //Show 5 entries, sort by date indicate the number of news item  will be displayed .
-This line  newsfeed.init() //Always call this last will start the function getting feeds from RSS sources above .

Other categories has the same structure .

Now ,everything is very clear .

To change the category name : you can change the text Category .. in <h1>Category ...</h1> to your category name ,for example ,Politics ,Business ...

To add feed sources ,just use this structure newsfeed.addFeed(" feed-label ", " feed address ")

Wanna show more items in each category ? change value "5" in this line newsfeed.filterfeed(5) //Show 5 entries, sort by date
to the value you want .

To add more category ,just copy this code :

<div class="box">
                 <h1>Category 1</h1>
                 <script type="text/javascript">
                     var newsfeed=new gfeedfetcher("list1")
                     newsfeed.addFeed("NYT", "http://www.nytimes.com/services/xml/rss/nyt/International.xml")
                     newsfeed.addFeed("Yahoo News", "http://rss.news.yahoo.com/rss/world")
                     newsfeed.filterfeed(5) //Show 5 entries, sort by date
                     newsfeed.init() //Always call this last
                 </script>
             </div>
 
and paste it in template .

change the category title ,add your feed ,change the number of item ,and remember to change the "list1" in this line var newsfeed=new gfeedfetcher("list1") to an unique value .

4,To change the logo

find this <img src="http://img684.imageshack.us/img684/4229/logopa.jpg"/> and change http://img684.imageshack.us/img684/4229/logopa.jpg to your logo link .

Save template ,and upload it to Blogger .

Go to Blogger Dashboard ,click on Design - > Page Elements ,you can add or remove any widget you want in the footer .

That's all for this template . I hope this template helpful to your work .Feel free to leave me comments ^^ Thanks .

No comments:

Post a Comment