After reading PhotoShelter’s Facebook Fan Pages for Photographers Guide, I decided to create a Facebook fan page for NiO Photography. Finally! I have many ideas for the fan page, so it will probably be a work in progress for a while. Something I included immediately however, is a gallery (photo wall) with recent images from my PhotoShelter image archive. I did this using the NiO PhotoShelter RSS Gallery widget. So, no uploading of images to Facebook and the gallery automatically refreshes when new work is uploaded to PhotoShelter. Have a look … and make sure to also “Like” the page whilst you’re visiting
:
In this post, I will share how I included the PhotoShelter image gallery in my Facebook fan page, provide a few screen shots of sample galleries and provide a link to download three sample applications. To add a gallery to your Facebook fan page, you will need to have the NiO PhotoShelter RSS Gallery widget up and running.
Read more about the NiO PhotoShelter RSS Gallery widget
Read more about animations for the NiO PhotoShelter RSS Gallery widget
Special thanks go out to my colleagues Dan Morris (www.danmorris.com) and Dave Pattinson (www.davepattinson.com) for helping me with setting up and testing the NiO PhotoShelter RSS Gallery widget on Facebook!
Ok, here are the steps for making it work:
A link to download the samples is provided at the bottom of this post.
Upload the samples to the “niorssgallery” directory on your domain (facebook1.php, facebook2.php and facebook3.php). Leave these samples as they are for now.
This sounds scary, but it really isn’t. Go to develop section of Facebook (http://www.facebook.com/developers/), log in using your normal Facebook credentials (if you’re not already logged in) and hit the “Set up new App” button at the top of the page:

This will take you to the following page:

The only thing you need to do here is to give the application a name and agree to the terms. The “App Name” you specify will be the “Tab” name on your Facebook fan page, so pick one carefully! After clicking the “Create App” button, you will be asked to fill in a Captcha code to verify that you are human. Once that is confirmed, the following screen will appear:

Use the screen to fill in a description for the application and to provide an icon for it. The icon will appear next to the tab for the application on the Facebook fan page. Once that is done, click the “Facebook integration” option in the menu to the left (you don’t have to save first). This will take you to the screen below:

In the screen above, you need to tell Facebook where to find the content of your application:
You can leave the rest of the options as they are. Hit “Save changes” and you will have created the application.
Once the changes have been saved, the “My Apps” page will appear. Please note that “Edit Settings” can be selected if you want to make changes to the application later:

Select the “Application Profile Page” option. This will take you to the profile page of your application. Select “Add to My Page” in the left sidebar menu. A pop-up will appear:

Select your fan page from the list to enable the application and to finalize this process. Check your fan page to see if it works.
Once the sample works, you can start hacking and customize the widget settings to your liking (you can use the readme.pdf that came with the widget)! The first thing you need to do however, is to edit the sample and replace the url’s with “niophoto” in it, to make sure they actually point to your domain. You also need to replace the RSS feed parameter of the widget to make sure your own images show up.
In Facebook, the NiO PhotoShelter RSS Gallery widget offers all of functionality as available when used in for instance WordPress. Images link through to PhotoShelter, can be resized, made square, shown with or without captions or headlines, etc. If needed everything can be styled using CSS.
A few tips:
The download offers three sample setup’s (click the image to see a larger version):
A photo wall set-up with the images visualized against each other.
A gallery with square thumbs.
A gallery with thumbs that have captions underneath.
The Facebook samples can be downloaded using the link provided below:
Click to download version 1.0.1:
NiO PhotoShelter RSS Gallery widget samples for Facebook (122)
If you like the NiO PhotoShelter RSS Gallery widget and decide to use it, please donate, blog about it or provide a credit on your site with a link to my site (http://www.niophoto.com).
The Facebook samples are free software: they can be redistributed and/or modified under the terms of the GNU General Public License as published by the Free Software Foundation, either version 3 of the License, or any later version. The widget is distributed in the hope that it will be useful, but WITHOUT ANY WARRANTY; without even the implied warranty of MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the GNU General Public License for more details.
If you are interested in using either PhotoShelter or Graph Paper Press and want to sign up for a trial, please consider using the image buttons below to get yourself (and me) a discount …
This entry was posted on Friday, June 10th, 2011 at 1:05 AM. It is filed under Software, Tech & Books and tagged with: Facebook, Fan page, How to, NiO PhotoShelter RSS Gallery Widget, Photoshelter, thumbnail gallery . You can follow any responses to this entry through the RSS 2.0 feed.
All content © 2013 NiO Photography & Johan Peijnenburg. All rights reserved. Sitemap

Johan – As ever, a great article! I was with a friend last night who has started to do a lot of paid work developing FB pages for clients here in Bali, and the conversation spurred me on to sort my own out. And now I wake up and see this – perfect timing. I will take a shot at integrating your RSS widget, but have one question – as per usual! Would it be possible to modify the RSS widget so that it pulls out selected images, rather than just the most recent? For instance, using a keyword like ‘FB’ and having those pulled out by the widget? Is that possible? The reason I ask is that I often post images for clients in hidden galleries, but these still have to remain on public view for search purposes. So they pop up in my ‘most recent’ feed…
Of course, rather than modifying the widget itself, the alternative might be to set up a custom RSS feed with a filter? Again, no idea if that is possible…
Anyway, hope all is well! Thanks for the post Johan, good stuff! Todays job – sort out my FB page!
Matt
Hi again Johan – I think I might have answered my own question. Simply keyword the images I want to appear on facebook with something very specific such as ‘FCBK’, do a search in PS for the same keyword, then use that RSS feed in your widget? Should work I hope, will give it a go later on… Matt
Hi Matt,
Tnx! Yes that would work perfectly. An alternative would be to create a gallery to which you copy the images you want and then use the feed of that gallery.
Let me know how it goes.
Cheers,
Johan
Thanks for this great write-up, Johan
Thanks and you’re welcome Miles!
Excellent, thanks Johan I got very excited about this when I saw your note last week. It’s on my to-do list
Looking forward to seeing what you do with it, John!
Hi Johan,
I love this facebook widget! It’s been pretty easy for me to install so far too, thanks to the impeccable instructions. I need to play around with it some more to tweek but so far I love it! Thanks again,
Kat
Thanks and you’re welcome Kat!
Hi Johan,
Just to say this widget works as intended – nice work.
Was reading over Matthew Oldfield’s post and yes, might need to something similar here – as in having specific images appear rather than whole batches of images appearing as and when they are uploaded. Will look into this at a later date.
Cheers – Rogan
Hi Rogan. Hope all’s well over there! Thanks for the feedback. Just let me know if you need help!
Johan, this widget is a great idea. I’m a little clueless on where to upload the samples as I’m using Photoshelter and don’t know where to create the “niorssgallery”. I looked for the pdf instructions in the download but didn’t see them. Any help appreciated!
Jim
Oops, just realized you were talking about uploading samples where Photoshelter is hosted, not Photoshelter itself. Never mind!!
Hi Jim,
The assumption is that the samples get copied to the niorssgallery directory that you have created previously as part of for instance a WordPress installation! Just let me know if you need more info …
Cheers,
Johan
Thanks for the clarification. I do not have WordPress installed, so can I still make use of the widget? If so, please provide details
Jim
Hi Jim,
I’m afraid not. The niorssgallery widget needs to be installed somewhere outside of PhotoShelter. If you don’t have a location like that or don’t know someone who can provide you with it, you won’t be able to use it. So the question is if you have access to a webserver somewhere?
Cheers, Johan
Hi
Thanks for sharing another awesome widget!
My question is that when I look at your image sample above, the photo wall looks great, with no spaces between the images, but the sample gallery I downloaded looks very untidy with spaces etc… likewise with the square gallery it looks great above, but in the sample gallery the images are not actually square, but they are in a square box with a black background and the images rectangular inside that. I can’t see how to rectify this in the code?
Any help would be great!
Thanks!
Hi Tiffany,
Sounds like a few parameters are a bit off. I’ll contact you via email to get it fixed.
Cheers, Johan
[...] also make sure to check out the new animation add-on for the widget and the possibilities for using the widget on facebook!What the widget doesThe NiO PhotoShelter RSS Gallery widget creates dynamic thumbnail galleries of [...]
Johan thank you for creating and sharing what you know.
Last night I attempted to integrate your widget into FB but was unable to.
It appears FB is looking to make things little more secure with apps
by requiring secure connections.
But wait there’s more! It also appears they are changing the way apps integrate to pages as well.
https://developers.facebook.com/blog/post/611/
Do you have an idea for how to go about making your awesome widget work
with these new changes?
Thanks
O
Hi there all, here every one is sharing these familiarity, thus it’s nice to read this web site, and I used to pay a quick visit this blog every day.