Create a Mobile Web Site With RSS + CSS
by JetCityOrange in Circuits > Websites
3968 Views, 10 Favorites, 0 Comments
Create a Mobile Web Site With RSS + CSS
RSSmachine creates RSS feeds with CSS style sheets designed for mobile phone users. These RSS feeds are a quick and easy way to create mobile web pages. Combined with Dropbox, it's a free way to publish a mobile web site.
Download & Install RSSmachine
RSSmachine is an RSS 2.0 template, a set of 10 CSS style sheets, and several other files. You can download it from QRdvark.com/rss/
UnZIP the files into a directory on your machine.
UnZIP the files into a directory on your machine.
Watch the YouTube Video
My original goal was to build web pages for cell phone users. But inspired by recent protests in the Middle East I also wanted to provide a way for people to self-publish web pages quickly and easily "on the go".
There are various complex and involved ways to repurpose RSS as HTML but I wanted something self-contained and straightforward. For me, it meant putting aside my assumptions about what RSS was and could do, and how to build mobile web pages.
There are various complex and involved ways to repurpose RSS as HTML but I wanted something self-contained and straightforward. For me, it meant putting aside my assumptions about what RSS was and could do, and how to build mobile web pages.
RSSmachine.xml & RSSmachine-comments.xml
The template is provided in two formats, a barebones version and one with comments in it.
The commented version provides ample documentation about the various parts of the underlying XML file. One thing to remember is that RSS files are a LIFO stack, the newest post is at the top of the file.
One crucial difference between building pages for phones vs. computers is file size and transmission speed. Download times are critical when dealing with mobile pages. Bandwidth is a limited resource. The comments need to be stripped out to keep the file as small as possible.
Start by reading RSSmachine-comments.xml but use RSSmachine.xml as your working copy.
Of course you can rename your XML file anything you want; www.example.com/feed.xml for example.
The commented version provides ample documentation about the various parts of the underlying XML file. One thing to remember is that RSS files are a LIFO stack, the newest post is at the top of the file.
One crucial difference between building pages for phones vs. computers is file size and transmission speed. Download times are critical when dealing with mobile pages. Bandwidth is a limited resource. The comments need to be stripped out to keep the file as small as possible.
Start by reading RSSmachine-comments.xml but use RSSmachine.xml as your working copy.
Of course you can rename your XML file anything you want; www.example.com/feed.xml for example.
Configure the Channel Portion
Describe your feed by editing the channel portion of the XML file.
Begin Adding Items to Your Page
Each of the items in your XML file will be a separate post, much like a blog or Twitter. Remember that the oldest items are at the bottom of the file, the newest at the top.
The guid needs to be unique for each item in your feed.
The guid needs to be unique for each item in your feed.
Select a CSS Style Sheet
RSSmachine contains 10 CSS style sheets, each reformatting your mobile web page with a different look and feel.
Your style sheet is referred to in the 2nd line of the XML file. You can either pick one style to use and rename it style.css
<?xml-stylesheet type="text/css" href="style.css"?>
or you can call each style by its name
<?xml-stylesheet type="text/css" href="style-8.css"?>
RSSmachine is released under Creative Commons (CC BY 3.0) This means you are encouraged to edit and modify the style sheets as long as your page contains a link back to QRdvark.com/templates/
Your style sheet is referred to in the 2nd line of the XML file. You can either pick one style to use and rename it style.css
<?xml-stylesheet type="text/css" href="style.css"?>
or you can call each style by its name
<?xml-stylesheet type="text/css" href="style-8.css"?>
RSSmachine is released under Creative Commons (CC BY 3.0) This means you are encouraged to edit and modify the style sheets as long as your page contains a link back to QRdvark.com/templates/
Host Your Feed
If you already have a web site you can host your XML & CSS files on the server you use for you existing site.
if you don't have a site and need to host your new mobile site somewhere you can use Dropbox and host your file for free. Read how here: QRdvark.com/rss/dropbox/
if you don't have a site and need to host your new mobile site somewhere you can use Dropbox and host your file for free. Read how here: QRdvark.com/rss/dropbox/
Tell the World About Your New Mobile Site!
Once your feed is done and hosted online you need to tell the world about it.
If you already have a web site link to your feed/mobile site from there. Use RSS icons and don't forget to use autodiscovery too.
Use Feedburner, announce your new mobile site on Twitter, Facebook, and other social media sites you use. Be creative and spread th word.
If you already have a web site link to your feed/mobile site from there. Use RSS icons and don't forget to use autodiscovery too.
Use Feedburner, announce your new mobile site on Twitter, Facebook, and other social media sites you use. Be creative and spread th word.
Next...
While RSSmachine may appear to be simplistic, v1.x is merely the first step.
We gots plans. BIG plans. Stay tuned...
We gots plans. BIG plans. Stay tuned...