A challenge that many website owners face is how to supply continuously fresh content for new and repeat visitors to peruse.
It can be a very time-consuming task to manually upload regular updates. Fortunately, there is an easy way to showcase free, readily available news content on a wide variety of topics.
We will examine a quick and effective method of incorporating RSS (Really Simple Syndication) coding in order to add news content to any site. First, let’s look at what RSS is, and how it works.
RSS is an online coding solution that delivers automatic updates for Web content. Say, for instance, you add an RSS code for international news to your website from a popular source, such as CNN, Reuters, or the BBC. Visitors would be able to access new content links as often as the source updated their news feed. In other words, you get the benefit of presenting the very latest desired information online, with no effort on your part.
Due perhaps to a misguided perception that it is difficult to add the necessary coding to make RSS work within a website’s framework, it remains an extremely underutilized resource.
A typical RSS newsfeed (this one from the BBC) looks like:
http://feeds.bbci.co.uk/news/world/rss.xml
When the XML document is updated by the BBC, the new information is automatically displayed on any website that has incorporated the above URL to obtain World News.
You can find RSS feeds all over the Web; just look for the small orange icon with a dot and two waves above it. The very latest data is available on diverse subjects ranging from international news, to financial updates, to reports on innovations in the food and drink industry, to the latest updates on plants and gardening.
So, now that we have a better understanding about RSS and what it can do, let’s move on to finding out how to incorporate the correct coding into a website in order to gain the noted benefits.
Google Feed API
Google has developed an exceedingly convenient method to display RSS feed data, via their Feed API feature. Using this technique, you can showcase any newsfeed by incorporating some simple Javascript lines into a web page.
To begin utilizing the Feed API, insert the following script into the Head section of your web page, beneath the meta tag area and just in front of the closing Head tag:
<script type="text/javascript" src="https://www.google.com/jsapi"></script>
<script src="http://www.google.com/uds/solutions/dynamicfeed/gfdynamicfeedcontrol.js"
type="text/javascript"></script>
<style type="text/css">
@import url("http://www.google.com/uds/solutions/dynamicfeed/gfdynamicfeedcontrol.css");
#feedControl {
margin-top : 10px;
margin-left: auto;
margin-right: auto;
width : 440px;
font-size: 12px;
color: #9CADD0;
}
</style>
<script type="text/javascript">
function load() {
var feed ="http://feeds.bbci.co.uk/news/world/rss.xml";
new GFdynamicFeedControl(feed, "feedControl");
}
google.load("feeds", "1");
google.setOnLoadCallback(load);
</script>Then, insert the following code into the desired area of the web page:
<div id="body">
<div id="feedControl">Loading...</div>
</div>After uploading the web page to the Internet, you should see the following addition:
The width of the four-stack vertical dynamic newsfeed is set at 440px by default, but it can be adjusted based on the size constraints of the given area within the page, or the HTML table, in which it is placed.
The newsfeed pointer rotates continuously between the news items, displaying a link and short summary for each.
Feed Customization
You can manually change the coding variables in the following expression:
#feedControl {
margin-top : 10px;
margin-left: auto;
margin-right: auto;
width : 440px;As noted, you can raise or lower the set width of the display. The margins can also be adjusted. If, for example, you want to create more space at the top of the newfeed box, the ‘margin-top’ expression can be upped to 20px, or higher.
Changing News Sources
The newsfeed can also be updated to accommodate a new source very easily.
Say that you got tired of the BBC feeds, and instead wanted to incorporate news from CNN. The required adjustment would be made to the following line:
var feed =”http://feeds.bbci.co.uk/news/world/rss.xml”;
The CNN RSS code would be substituted so that the line looked like:
var feed =”http://rss.cnn.com/rss/edition_world.rss”;
A similar adjustment to display an international newsfeed from Reuters would entail the following change:
var feed =”http://feeds.reuters.com/Reuters/worldNews “;
Conclusion
As this brief tutorial demonstrates, it is both quick and easy to incorporate a newsfeed into your site. The above coding can be inserted into the home page, or any interior page.
Once you get the hang of integrating the Feed API coding into your site, take a look at some more feed options by going over to https://developers.google.com/feed/.
