Formatting an rss feed using Yahoo Pipes on Squidoo

Ranked #1,417 in Squidoo Community, #149,404 overall | Donates to Squidoo Charity Fund

I never heard of Yahoo pipes until this morning and now I'm using them.

I have a lens called Weddings in North Carolina and it contains, among other things, (1) an rss feed from my blog of me singing love songs, and 2) another rss feed from my blog listing and reviewing local wedding vendors.

For a few weeks I've been asking this question around the Squidoo help forums and css - html lenses:

How can I use css or html formatting to distinguish my rss feeds from content originating on the Squidoo site?


This seemed important to me for some reason.

Today, Kate-Phizackerley gave me an important starting point, you can view her post on Yahoo pipes.

I was kind of freaked out. Pipes? Regex? I hadn't heard of those things before. So I started researching. I've only just begun but I'll update this page as I learn more.

In the picture, you see the current result of my efforts. The titles of the posts are in red, with a yellow background, and they are centered. Not a bad start!

But, AARGH, it turned out to be very difficult to explain this. So if it confuses you, leave me a comment and that will help me clarify the language.

Remember, I'm brand new at this!

What is a Yahoo Pipe?

I learned what it was a couple of hours ago

Yahoo has a service that lets you join feeds from several blogs or frequently updated sites (or, really, any site at all it appears) and run all the feeds together into one rss feed that Yahoo creates for you.

The easiest way for you to understand: browse their listing of popular pipes. If you find one you like, you can "clone" it for yourself. (You'll have to join yahoo, though, if you're not already a member.)

Usually pipes are used by people who want to combine a bunch of different feeds and spit them out in one stream, often with coding stripped out of them. Basically, they send their chosen feeds through a pipe and they come chugging out the other end.

I didn't want to combine feeds, I'm happy with two separate feeds, but I wanted to be able to add formatting to the posts before they arrived at my Squidoo rss module, because there's no way to format them once they arrive.

So, in Yahoo pipes, using filters and all sorts of magic tricks including "regex" (regular expressions) you can manipulate the rss data. Fluffanutta and Kate both have quite a few examples you can learn from (and clone for yourself) and I'll provide links to them further along in this lens.

All I wanted to do was add some formatting to my rss feeds.

This is how far I've gotten. Kate's suggestions are bold, my "explanations" follow.

Kate wrote: 1) Add a Fetch Feed - enter the URL of your source feed

  • Go to pipes.yahoo.com and log in (or register).

  • Click create a pipe.

  • See that little blue oblong in the left sidebar that says "Fetch Feed" ? Well, drag it into the "canvas" to the right.

    In the "URL" box enter the URL of your source feed.

    How do you find that? One way is to find the RSS feed icons (they might say "bloglines" on them, for instance) and then right mouse click and "Copy the URL" - that's the RSS feed. Or, if you have already subscribed to the rss feed in bloglines, for instance, go to "edit subscription" and you'll find the url there.

  • 2) Add a Regex and attach the output of the Fetch Feed to the Input, then the output of the Regex to the Pipe Output.

    Now go back to the left sidebar and click on "Operators." In the drop-down list you'll find "Regex" - drag that into your canvas below your first box.

    Left click the little circle at the bottom of the first box and drag towards the little circle on the top of the second box; when you get there, let go. There will be a swoopy blue pathway between the two boxes.

    At the bottom of your canvas, there is already a box called "Pipe Output." Drag from the bottom circle of the middle box to the top circle of the Pipe Output box. Now all your boxes are connected.

  • 3) In the Regex, the field is Item.Content. Content for me - that may vary

    I think what Kate means by this: depending on the source of your rss feed, different items will appear in the lefthand drop-down box. You will select one of them to format.

    It took a long time to get "item:description to work, so I'll put that in a separate box below. Meanwhile, fixing item.title is easier, so let's use that one.

  • 4) Replace (.*) with <div style="color:red;">$1</div> That will turn anything in the RSS feed red unless its color is set explicitly (it usually isn't).

    Put open-quote, period, asterisk, close-quote in the box following the word "replace."

    Then, in the "with" box, put your css coding. What I used: <b style="display: block; color: #c66; background-color: #ffc; text-align: center;">$1</b>

  • 5) Save & run the pipe, grab the new RSS URL and use that in your Sqidoo RSS module.

    In the upper right-hand corner of the page, click the "Save" button. In the center top of the screen, a blue "run pipe" box will appear. When you click it, you'll see the title of the pipe you created and then how it turned out.

    To name your pipe, click on the tab in the upper left-hand corner next to the "pipes" logo - change it to whatever you like - and click "OK."

    Finally - click on "Get as RSS" and you will be taken to another page. The URL you want is in the uppermost window in your browser, it ends with render=rss. Save that long, long URL and use it in your Squidoo rss module.

Here's my "formatted headings" pipe so far (work in progress)

This is a screen shot - to see how it works, clone it, or fix it (!) go see pipe which formats rss post headings.

Formatting "item:description" took a little more work.

I finally figured out the reason I couldn't get the background-color attribute to work on item:description - it was because the description was getting truncated. Therefore, my closed-div code was never getting called - and therefore, the div styling failed.

To fix this, I added a LOOP with a SUBSTRING embedded in it, arbitrarily decided to cut the blog post descriptions off at 100 characters, then added ellipsis (dot dot dot) at the 100 character cutoff with a text input module. I was able to style the description then.

NOTE: I did NOT see the background color when I clicked "run string" - it only appeared when it got fed through my Squidoo lens. Grr! that wasted a lot of time!

I expect this may not make a lot of sense unless you've seen pipes before, but hey, it can't be that hard - this is my first day!

Easiest way to understand is to look at my pipe. There is currently one non-functional module in the upper right-hand corner, ignore that.

Result: here is my Wedding Blog rss feed, formatted

Still to do: replace "smart quotes" with straight quotes so I don't get question marks.

Loading

Squidoo Formatting Resources

Using Yahoo Pipes on Squidoo
Kate-Phizackerley gave me this start!
Kate's Demo Lens
"People post their lenses in Squidu and ask for feedback on things like layout. I struggle trying to explain what I suggest as an alternative - descriptions just don't work. What's much better is to show people what I'm suggesting so that they can see what it looks like."
A Guide to Yahoo Pipes
"Yahoo Pipes is a powerful composition tool to aggregate, manipulate, and mashup content from around the web. Simple commands can be combined together to create output that meets your needs.For example, you can combine many RSS feeds into one, then sort and filter it..."
Pipes: Rewire the web
The basic Yahoo site, with tutorials, library of pipes, etc.
Customize your RSS feeds with Yahoo Pipes
"Have you ever had a bunch of RSS feeds that were very similar and that you wished were just one aggregate feed? For instance, many sites publish a number of..."
My Favourite CSS Tricks on Squidoo
The basic tools provided by Squidoo will do pretty much everything you need to get your content out to your audience. But sometimes you want to format it a little differently, and this is where inline CSS comes into play. Here I show some of the tricks I use on my lenses, and the code that does that
How to Promote All your SquidCasts at once | Captain Squid
"Wouldn't it be nice to submit ALL of your squidcasts as ONE RSS feed? Yes, it would. But wait, there isn't a way to promote that RSS feed because it doesn't exist?
That's what the Captain's for!

I have written a yahoo Pipe that allows you to create a feed for ALL your squidcasts. When you submit this feed to blog sites, your feed is updated every time you write ANY squidcast."

Any comments? Suggestions? Have you taken this further?

  • Pmona Feb 13, 2010 @ 3:58 pm | delete
    This lens really helped me to have a much better understanding of Pipes. I was directed here by ClearnerLife. 5*
  • CleanerLife Feb 13, 2010 @ 3:15 pm | delete
    This actually makes me want to try using Yahoo Pipes again. I think I'll be referring back here some more as I try to sort them out some more!
  • cjsysreform Aug 30, 2009 @ 2:12 am | delete
    Cool! You can also use feedburner to format rss feeds in html. It's a lot easier than Yahoo Pipes... but thank you for the helpful information. I'll be back.
  • Kate-Phizackerley Aug 3, 2009 @ 5:56 pm | delete
    Glad you found it helpful.
    (Just to warn you I'm about to publish a similar pipe/lens as well)
    Kate

Some of my other lenses...

Loading

by

ChapelHillFiddler

Musician in Chapel Hill with two bands: Mappamundi, a world music - klezmer - swing band, and the Pratie Heads, a Celtic - British Isles - early music... more »

Feeling creative? Create a Lens!