A SmugMug “Photostream”


2009-05-18 Update: I’ve refreshed the code with a few new features like a loading screen and better support for some SmugMug themes other than the default.

I love SmugMug, but I’ll admit it, I’ve always been a bit jealous of my Flickr friends’ photostreams. It’s such an easy way to show people what’s new no matter where it gets categorized.

I’ve gone ahead and put together my own version of of the photostream using the SmugMug public RSS feeds and a little bit of JavaScript. Here’s what it looks like on my homepage.

A photostream for SmugMug.
A photostream for SmugMug.

Want to add one to your SmugMug Page?

First, download this file and extract the two files that you find inside. (photostream.zip)

Adding Customizations to the CSS section.
Adding Customizations to the CSS section.

Second, copy the contents of the Style.css file into the “CSS” section of the SmugMug Control Panel -> Customize -> Site-Wide Customization page.



Adding contents of the JavaScript file to the Head section.
Adding contents of the JavaScript file to the Head section.

Third, open the JavaScript.js file, change value of the SmugMugNickname variable to your SmugMug nickname, and update the number of photos you want to be shown. (Four works well with the default SmugMug theme.) Then, copy the contents of JavaScript.js into the “Head” section of the Site-Wide Customization page.


You’re done! Click “Update” and reload your SmugMug homepage!

The Caveats

Out of the box, this shows four images across on the default template. If you’re using something other than the default template, you might need to edit the value of the “margin-right” property at the very top of the CSS file.

If you’re using the original size thumbnails, you’ll probably want to update all of the instances of 150px in the CSS to be 100px. From what I can tell, the SmugMug original option for the thumbnails fit within a 100 x 100 pixel box.

Finally, I’ve done my best to use the same styles that SmugMug uses, but I haven’t tested it on very many of their themes, so please let me know if you run into problems!

7 Responses to “A SmugMug “Photostream””

  1. Glenn

    Hi Brian, love your photostream. I would love to use it on my site, I followed your instructions to the letter and all I get is the Newer/Older controls, no photos. Any assistance would be greatly appreciated.


  2. Richard

    Thanks Brian, this is just what I was looking for. It works great!

  3. Jeremy

    Hey Brian, where are you hosting the jquery file? Is it free?
    I am currently using yahoo’s free geocities site for stuff like this but it is shutting down soon.

    Also, have you thought about writing the photostream code with YUI since it’s already loaded when SmugMug loads?

  4. brian


    I’m currently hosting it on my own servers. If it gets really popular and the bandwidth starts costing me real money, I’ll switch it over to Google’s hosted version of jQuery on ajax.google.com.

    I haven’t put any thought at all into writing it using YUI. I’ve used YUI in the past, and it’s been fine but I’m more familiar with jQuery these days.

  5. Terry

    Brian, the script looks great and it looks great in action on your website. Im putting this on my ‘to do’ list for my smugmug site. I see you are using jquery 1.2.6. Do you know if there is no significant advantage in using the latest version, jquery-1.3.2? Im using the latest one with my smugmug menu, but Im not sure if it is necessary. Ver 1.2.6 is slightly lighter weight in file size. I downloaded the full size version of 1.3.2 and then compressed it with bananascript to about 35% of its original size however.

  6. Jeremy

    Wow, can’t believe I’m just finding out about the google ajax library.
    With the ability to load the version you desire I’m not sure why you’d even want to host on your own site. Thanks for pointing me there Brian.

    Now if that really cool example out there isn’t easy to convert to YUI then I can bite the bullet and go with it’s library.

  7. Lorraine

    thank you for such a wonderful application / additive for smugmug pages!

Leave a Reply