Jump to Sidebar Content | Jump to Main Page Content

Begin site navigation:
End site navigation.
Begin left menu:


End of left menu.
Begin main content:
Archive for the Code Category
Next Entries »

Parsing OPML to Display Your Fargo Outline

Sunday, May 12, 2013 7:56 pm

I’ve been messing around with Fargo, the little outline tool from Dave Winer’s Small Pictures lab that you can use for notes and to-do lists. Though it does integrate with WordPress, I wanted to display a list in a standard PHP page. I discovered two ways to do this: 1) embed the Reader feed in an iframe or 2) parse the OPML file to display inline. Here’s how:

Embed the Reader feed in an iframe

1) Locate the Reader feed for your outline

  • From the Fargo menu, go to File > View in Reader

2) Copy the URL from the browser

3) Add the URL in an iframe, as this

<iframe src="http://reader.smallpicture.com/?opmlurl=https%3A%2F%2Fdl.dropbox.com%2Fs%2Fi08c5n3c0vqgczj%2FyardTasks.opml" width=70% height=500 frameBorder="0" scrolling="yes" allowtransparency="true"></iframe>

4) This will embed your outline as shown here:

Parse the OPML file to display inline

If you’d rather display the list inline without using an iframe, you need to convert the OPML file to HTML. Then you can format it as desired. Here’s a function using PHP’s SimpleXMLElement to output an OMPL file as a basic HTML list. For this example, I’m using an outline called “Yard Tasks”, you can view the OPML file here: https://dl.dropbox.com/s/i08c5n3c0vqgczj/yardTasks.opml

1) Locate the OPML feed for your outline

  • From the Fargo menu, go to File > Get Public Link
  • Create a public link for the “Yard Tasks” file? Click OK
  • Public link for “Yard Tasks”. Copy the URL, then click Ok

2) Add this code to your PHP file:

function parse_opml($xml,$depth=1) {
  if (count($xml->children()) > 0) {
foreach ($xml->children() as $child) {
  echo '<li>'.$child['text'].'</li>'; // level 1 outlines
  parse_opml($child,$depth+1); // nested outlines
  if (count($xml->children()) > 0) {
  echo '</ul>';
$file = new SimpleXMLElement("https://dl.dropbox.com/s/i08c5n3c0vqgczj/yardTasks.opml",null,true);
echo '<h4>' . $file->head->title . '</h4>';
echo '<em>' . 'Created in <a href="http://fargo.io/">Fargo</a> © 2013 <a href="http://smallpicture.com/">Small Picture<</a>, Inc.' . '</em>'; ?>

3) This will display your outline as shown here:

Yard Tasks

  • What to do with all the rocks?
  • Dispose of:
    • propane tank
    • canister
    • rusty mower
    • leftover paint
    • creepy old doghouse
    • pipe on north side
  • Dig up junipers:
  • Clean debris from planter off study patio

Created in Fargo © 2013 Small Picture, Inc.

4) You can pull other items from the OPML file, such as:

Creator = $file->head->ownerName
Email = $file->head->ownerEmail
File Date = $file->head->dateModified

5) Or display Fargo icons.

To do that, you will need to include the Font Awesome code in your website. Then add the icon class:

Change this line:

  echo '<li>'.$child['text'].'</li>'; // level 1 outlines

To this:

  echo '<li>'.' <i class="icon-'.$child['icon'].'"></i> '.$child['text'].'</li>'; // level 1 outlines

6) It will update when you save changes to your Fargo list - see the live example on my home page

7) Enjoy!

End of main content.