As you know, iPhone has Safari browser onboard. It's pretty neat and great working... but sites with huge layouts don't look good on small iPhone screen. When you have own blog it would be good to display it in customized way.
Today almost all blogs have RSS Feeds so if we want to display our blog in cusomized, iPhone ready look it's just to put blog's feed through some RSS parser and display it as iPhone ready web page. Let's use iui - project started by Joe Hewitt - creator of firebug. It's a simple JavaScript framework for iPhone web pages.
So, we have iui now we need some PHP RSS reader. We'll use SimpleXMLObject class because it's ... simple.
<?php
$feed = simplexml_load_file($feedURL);
?>
As you can notice in php code we have function calls to something called xcache - it's very nice plugin for php speeding up your code by doing magic opcode caching. But for now we'll use different advantage of cache - you can store variables just in your server memory and get access to it on different php file calls. I this case we use this to download RSS feed once and store it for a while. So if you refresh your browser or some one else will go on your blog we do not need to download feed again.
Now we have our blog's feed and we can display it in nice iui internface.
Putting all things together we have pretty simple and neat iPhone blog: http://botmonster.com/iFeed/
Now, let's make browser detection - if browser is iPhone's Safari redirect user to our "iPhone ready" blog page. Just paste this JavaScript snippet into html section of your blog template. Replace "feedURL=" with link to your blog's feed.
<script type="'text/javascript'">
//<!--[CDATA[
if(document.location.href == 'http://blog.botmonster.com/' && navigator.userAgent.match(/iPhone|iPod/i)){ document.location='http://botmonster.com/blog/?feedURL=http://feeds.feedburner.com/BotmonstersWired'; }
//]]-->
</script>
It's very simple detection, if you need more sophisticated detection I'll recommend using this webkit detect script Just try to enter this address into your iPhone: blog.botmonster.com - you'll be redirect into iFeed page and you will see something like this:
You can download all iFeed code from google code at http://code.google.com/p/ifeed/
Available under MIT licence.
Tuesday, December 25, 2007
How to put your own blog on iPhone...
Subscribe to:
Post Comments (Atom)
3 comments:
This is excellent - You don't explicitly say so or in the Google Download instructions, but XCache is mandatory to be able to run the code - yes ?
It's not mandatory, as you can see in code I use $cache = function_exists('xcache_set'); so when we do not have xcache everything should work just fine.
Hmmm I'm obviously doing something wrong then as I get an error retrieving the feed URL. Does the Feed URL look like the below, if for example Digg was the feed you were after ?
$feedURL = isset($_GET['http://www.digg.com/rss/index.xml']) ? $_GET['http://www.digg.com/rss/index.xml'] : '';
Post a Comment