![javascript rss feed reader javascript rss feed reader](https://static.iono.fm/files/p2872/logo_7449_20220728_105504_600.jpg)
#JAVASCRIPT RSS FEED READER CODE#
Paste the following code into your index.php page.Īs I said earlier, I don't want to go too much into the "design". We now need to create our index.php page and call the function. Simply view the source of any RSS feed to analyze the structure. That's all that we'll need for this particular project, but I'd advise you to review some of the other information that is available to you. The title tag obviously houses the title of the posting. The "link" tag contains a link to the actual posting. Within our "foreach" statement, we only need to extract the link and title, and place it within an "li" tag. All of the information that we need can be accessed this way. Then, each posting in your feed will be wrapped within an "item" tag. Every feed contains a wrapping "channel" tag. The wonderful thing about RSS feeds is that they all implement the same basic structure. This statement basically says, "create a variable called $entry that will contain the value of each item tag in our RSS feed.
![javascript rss feed reader javascript rss feed reader](https://static.iono.fm/files/p1119/banner_7483_20220811_181023_1500.jpg)
Then, we cycle through each entry in our RSS feed using a "foreach" statement. We begin by echoing the opening unordered list tag. Within the parenthesis, we'll pass in our $content variable.įinally, we need to run through the RSS feed and extract the information that we desire. Next, we'll create a new instance ($x) of SimpleXmlElement. Now, when we call the function, we can do so like this: In order to use this variable from an outside source, we need to make sure that the function accepts one parameter. But, what if they want to grab different feeds? Wouldn't it be nice if we could pass the url into the function instead of hard-coding it? Of course it would! Consequently, rather than inputting the path, we'll simply use a variable called "$feed_url". Imagine that we have many different pages in our web application that want to call this "getFeed()" function. But, we should always have the word "reusability" lurking in the back of our minds when working. The method would correctly read the RSS feed and store the results in our "$content" variable. First, we could pass in a string to our RSS feed - like so: Now that you understand the definition, we only need to pass in our file. "file_get_contents" is the preferred way to read the contents of a file into a string." Next, we're creating a variable called "$content" and making it equal to the result of: file_get_contents($feed_url). The basic structure of any PHP function is: "" įirst, we're creating a function called getFeed(). After that, continue reading for the code analysis.Įcho "link' title='$entry->title'>". We'll be creating only one function that's relatively simple. To keep things as clean and "to the point" as possible, we'll be using the most naked form of a tab structure - speaking in terms of the design. Just as the programming was beyond the scope of that tutorial, working on "design" will be beyond the scope of this article. As mentioned previously, Collis has already created a wonderful skin. *Note - the intention of this tutorial is to demonstrate the back-end work involved. Our server-side script of choice today will be PHP, and we'll use some jQuery to create the tab structure. We want to dynamically import these feeds into our document. We'll be creating a tab system for three unique RSS feeds: I'll embed the video on this site shortly. At least for the next couple of hours, you can watch the video. There's a strange issue with converting this video to Flash. You also might want to grab some raisins. At roughly forty-five minutes in length, you might want to take a quick "pre-screencast bathroom break".
#JAVASCRIPT RSS FEED READER HOW TO#
In today's video tutorial, I'll show you exactly how to do this using PHP. However, dynamically pulling in an RSS feed was beyond the scope of that article. If you haven't already, I 100% recommend that you review it. Back in April, Collis Ta'eed - CEO of Envato - wrote a fantastic tutorial on designing a tab structure using CSS/HTML/JS.