Early this year, I signed up with PhotoShelter to archive, showcase and sell nature and travel images online. At that point, I already knew that it would not be possible to include a blog and additional information pages using PhotoShelter only (at least not in a seamless way). So I got myself a domain at Bluehost, installed WordPress and signed up with Graph Paper Press (GPP) to get a WordPress theme that makes Integrating PhotoShelter and WordPress possible.
Integrating PhotoShelter and WordPress
Getting everything up and running was relatively easy. The main steps were:
- Getting a domain
After considering various web-hosting providers, I picked Bluehost to register and host my domain. Their offer is pretty straightforward, and they meet the requirements for installing WordPress. After signing up, the domain was available almost instantly. Up until now, their service has been very reliable.
- Installing WordPress
Bluehost offers an auto-install and auto-update for WordPress. The install procedure created a MySQL database and installs default themes.
- Installing a Graph Paper Press theme
Once subscribed to GPP, you get access to 24 themes, of which 7 provide integration with PhotoShelter. I downloaded the modularity theme and uploaded it to my domain via FTP. As I am working on a Mac, I use Transmit for Mac for that (I also tried the free FTP options from FileZilla and Cyberduck, but didn’t like the interface too much).
- Configure the GPP Modularity theme in WordPress
After activating the Modularity theme and playing with the parameters a bit, I had my first version of my site up and running on the first day. To integrate with PhotoShelter, you need to enable the PhotoShelter navigation in the navigation settings of the theme. This adds a default PhotoShelter menu to the theme’s navigation.
- Configuring PhotoShelter
Once I configured the theme, I had to replicate it to PhotoShelter. To create the same look and feel in PhotoShelter, I first selected the GPP theme in the theme options of PhotoShelter. Subsequently, I configured the content of each of the PhotoShelter pages. Once that was finished, I needed to convert to “manual customisation” in the theme options of PhotoShelter and replicate the GPP theme look and feel using PhotoShelter’s template generator.
- Install PhotoShelter plugins
To enhance the integration between GPP and PhotoShelter, I also downloaded several specific PhotoShelter plugins and uploaded them to my domain. One plugin, nowadays provided by PhotoShelter themselves, lets you include images from PhotoShelter in your blog posts, without having to re-upload the images to WordPress. A second plugin, provided by GPP, lets you display recently updated galleries in WordPress. Along the way, I developed several widgets myself to complement functionality. More on those later in this post.
Graph Paper Press and PhotoShelter offer video tutorials as well as manuals to help in the process of getting started. These materials improved a lot over the past few months.
Customising the integration
The results of the previous steps can be customised to meet specific needs and requirements. You can actually play with almost everything if you want. However, make sure you understand the concept of style sheets before you do …
For www.niophoto.com, I customised the following elements:
A lot of the colours used can be set in the Modularity theme options. The layout can be further customised by modifying the “styles” as stored in the “style.css” file. To be able to upgrade themes without too much hassle later, however, it is advised not to edit the default styles directly. It is much better to copy the style you want to change and to paste it to the bottom of the GPP theme file “custom-styles.php” and edit the copy there. The edited style will overrule the original and this way you can group all your edits in one place.
A lot of the navigation can be set in the GPP theme options. It is also possible to change the defaults by editing the menu structure as stored in the GPP theme file “nav.php.” However, make sure to make a backup before and after, just in case.
The default search option lets you search either the blog or the image archive. I wanted to offer both options in one go, so I combined the two. If you want this too, you can download the NiO Dual Search widget here.
The standard footer contains default content, which can be complemented by using the various theme widgets available. I did not like the standard footer (too much info visible on each page), so I stripped it and moved some of the info, for instance, RSS feeds, to other areas of the site.
- Slideshow on home page
The default slideshow displays a batch of images as previously uploaded to WordPress. Because these images are in PhotoShelter already, I decided to replace the default slideshow on my home page with the PhotoShelter slideshow, to avoid replication (and I like the PhotoShelter version more).
- Sign-in pop-up
By default, a client area link is provided that takes a client to a separate page for signing in. I replaced that link with a simple pop-up, to make signing in less of a hassle.
- Recent images page and sidebar gallery
Using PhotoShelter, you cannot create a page with thumbnails of recent images that update automatically, each time you upload images to the archive. Therefore I have created a separate recent images page using the NiO PhotoShelter RSS Gallery widget. A page like that gives new images more attention and they pop up in Google immediately with the full caption and keywords included.
I used the same widget to make a thumbnail gallery of these images in my blog’s sidebar.
One of the nice things about WordPress is that there are many plugins available that can complement the functionality of your site. The main ones I used are:
- Yoast SEO:
A plugin that helps in setting up search engine optimization. I looked at a number of SEO plugins but found this one quite complete and fairly easy to use.
- Conditional CAPTCHA Anti-Spam:
This plugin adds a so-called CAPTCHA to comments and contact forms, only when it suspects spam.
Integrating PhotoShelter and WordPress, by using a theme, various plugins and some customisation certainly fill a gap. Since recently, PhotoShelter offers clients the possibility to add additional information pages to their site, but adding blog functionality is another story.
The combination of PhotoShelter and WordPress/GPP does fit my needs and improved considerably in the last couple of months. The integration, however, is not yet seamless:
- A critical shortcoming is that the integration ignores the fact that blogs are by definition dynamic. Every new page and every new category added in WordPress requires an update of the navigation in PhotoShelter. PhotoShelter just didn’t deal with this in the design of PhotoShelter’s template generator. Besides that, dynamic content in the footer is no longer dynamic after using PhotoShelter’s template generator. So for instance automatically updating a “most recent posts” listing in the footer across the site doesn’t work.
- The new “Official PhotoShelter plugin” allows images as stored in PhotoShelter to be included in blog posts. Unfortunately, this doesn’t automatically generate a caption. The good news, however, is that the tag of the image includes the IPTC headline, so it is easy enough to make one. GPP release a new version of the plugin in mid-July 2010 and it is a huge improvement over the previous versions. Until now I avoided using the plugin, as it was not reliable and stable enough, and simply use the embed codes provided by PhotoShelter. The new plugin, however, is much better and does take away the extra step of having to go to PhotoShelter to fetch the embed code.
- The PhotoShelter Gallery plugin, as provided by GPP, doesn’t update correctly and never shows the last updated gallery. That’s actually one of the reasons that I created the NiO PhotoShelter RSS Gallery widget.
- Support is not integrated and in the past, GPP and PhotoShelter did not always coordinate theme updates between themselves. As a result, it was not always clear what question to ask where and when the PhotoShelter integration tool would be updated after GPP theme updates.
- If you want to track visits to your site, you can include a Google Analytics tracking code. It is not very clear, however, how to approach this when combining GPP and PS. There is a lot of information on how to deal with various situations, but picking the right approach for the combination is difficult, especially when you also use a CNAME for PhotoShelter. A bit more (SEO) documentation for the combination would help a lot. I will write a post on this topic shortly as by now I figured out how to do it.
Despite the issues mentioned above, I am quite happy with what I achieved: a more or less seamlessly integrated website with the functionality I was looking for. Not sure if I will stick with the current colours and layout on the long run, but I had to stop fiddling to move on to the next step: adding content. I am also pleased with the effort that both PhotoShelter and GPP put into integrating PhotoShelter and WordPress. I hope that there is more to come and will update this post along the way.