Udostępnij za pośrednictwem

Creating Widgets using Javascript Simple Syndication - JSS

  • Artykuł

Web syndication is a way to make content of your website or application available for others to use.  Rss/Atom/Rdf are specifications, which websites use for this purpose. However to consume such formats in your website, you need to know a little programming as these feeds are in Xml and they have a certain specification. Let’s say you want to show top 10 latest news items from Google news in the bottom right corner of your website. You will need to write code to read the feed off the Google website, parse the Xml and then format it into Html.

This is fine if you have the ability, but with Web 2.0, widgets, badges, AJAX, etc. Simplicity, refactoring, ease of use is what consumers are looking for. People want readymade plug and play components, which they can just plug into their website and it works, instead of diving into programming, rummaging through specifications, poking around with formatting, etc.

JSS can help in that regards. JSS is not a syndication specification, its an easy way to use the available syndication formats. All the consumer needs to do for using your syndication is to embed some lines of readymade Javascript code you provide them, which they can plug into their website to automatically display your content.

Below is a sample of what the consumer would need to put in the website –

<script language="javascript" type="text/javascript" src="Jss.ashx?url=https://news.google.com/?output=rss&count=10&showtitle=1&style=bullets"></script>

By embedding the above line of code in your website it will render something like below

Jss 

The options I have in the above URL are –

· Feed Url – The url which contains the Feed the consumer would like to display.

· Count – number of items to display

· ShowTitle – Whether to show the title of the feed.

· Table Parameters – You can specify the columns you would like to see, if style is table.

· Style – It takes 4 styles

o Bullets

Jss Bullets

o Dropdown

Jss Dropdown 

o Table – You can specify the columns in the tableparameters querystring

 

Jss Table

o Definition lists

Jss Definition List

A code implementation of JSS provided below.

Jss.zip

Comments