Integrating PhotoShelter into Your Website

by Meghan Grosso

As a Client Services Representative at PhotoShelter, I often speak with new and potential members who are unsure how a PhotoShelter site will fit in with their existing website. Maybe it’s a portfolio site that beautifully showcases your best images, or a blog that keeps your clients informed of what you’ve been working on recently.  Either way, you devoted a lot of time to building it, or invested a significant amount of money to work with designer, and created a custom design that you love.

But showing your pictures isn’t enough nowadays. You might want to add a shopping cart that allows your clients to license images or purchase prints and products directly off the site, or make it easier to create and manage your galleries and distribute high resolution files. If that’s the case, don’t worry! If you’re happy with your existing site, then we like it, too!  We can appreciate the value of a custom built design, and if our design themes don’t provide the look-and-feel you’re after, you can customize PhotoShelter to enhance the site you already have.  This is possible because PhotoShelter pages can actually be easily integrated into any outside website.

How does website integration work? 
In addition to our pre-made website themes, we provide all our Standard and Pro subscribers with access to “Master Templates,” “Public Pages,” and “Customer Pages” sections, which exposes the HTML/CSS code that defines the appearance of your PhotoShelter pages. Any designer with working knowledge of CSS and HTML has the ability to adjust the code on these existing templates until the customized PhotoShelter page design reflects the look-and-feel of your personal site.

The HTML/CSS templates are very similar to the customization options that you might find on blogger, WordPress or other content management systems. So any designer who has done this type of work before should feel pretty comfortable with out system as well.

If you need help doing the customization, we can recommend a designer to you, or you may hire a member of our in-house design team to help you out. Chip Allen did just that when he decided it was time to integrate PhotoShelter’s gallery, search, and e-commerce pages into his blog.  For $500 our team skinned his PhotoShelter pages so they appeared to be an extension of his existing site.

Here is his original Sacramento Architectural, Stock & Fine Art Photography website:

Here’s his original PhotoShelter branded website, prior to integrating his design:

And here’s the website after customization:

 

After the pages within your PhotoShelter account are customized, you can add a link to your PhotoShelter-customized pages on your personal site, which combines PhotoShelter features into your existing site.  As your clients navigate through the two separate sites, they’ll feel as if they are viewing one single, seamless site the entire time, which preserves your brand identity and user experience. If you click on the “Client Archive” or “Search Archive” links on Chip’s blog, you move over to his PhotoShelter site, although it appears that you never left:

Using Your Own Domain
Even the URL of your PhotoShelter site can be customized to maintain your branding.  You can set up what’s known as a “CNAME” for your customized PhotoShelter homepage if you do not want your clients typing in an address containing “photoshelter”.  A CNAME is a domain name alias that you may set up through your domain registrar (e.g. GoDaddy, Network Solutions, Dotster, etc). If your domain was mycoolphotos.com, then your CNAME could be archive.mycoolsphotos.com, or images.mycoolphotos.com, or “anything”.mycoolphotos.com. The name is up to you.  

Due to security constraints, not all customized pages will retain your domain name and will switch to “photoshelter.com,” but your custom domain can always be used as an “entry point” to your PhotoShelter customization. John Thawley, for example, uses a CNAME for his PhotoShelter homepage: http://ecommerce.johnthawley.com.  He links to that CNAME from his main site, http://www.johnthawley.com, under the heading “Stock & Print Sales”. 

Here are a few more examples of PhotoShelter members who have integrated with their existing site:

Karim Sahai built a portfolio site using liveBooks. He then requested them to link both the “Search” and the “Prints” options to his PhotoShelter pages to provide print sales capability.

Here’s Karim’s PhotoShelter site:

Landscape & Fine Art Photographer, Elizabeth Carmel uses a custom-design Livebooks site.

Her online, rights-managed licensing engine is powered by PhotoShelter and integrated to match her custom design:

Wildlife stock and editorial photographer, Daniel Cox, embedded our search box on the left-hand side of his site. 

When you perform a search, the results are returned on a PhotoShelter search results page:

If you collaborate with an outside designer, you can create a very unique, custom design within the templates. Australian music photographer, Nic Bezzina hired Portland-based interactive design, Deb Pang Davis,  to build a custom website for him, which she integrated into PhotoShelter to provide e-commerce and high-resolution file delivery.

If you click on “Archives” from his site’s menu, a submenu will appear containing  links to each of his Photoshelter pages.

If you are intent on integrating PhotoShelter with an existing or planned website, it’s best to finalize that design first. Then you can often use some of the same design elements and CSS files (if it’s not a Flash site) which reduces coding and maintenance.

You can find additional examples of integrated PhotoShelter sites on the left-hand side of the Photography Website Examples in our tour.

If you plan to work on your own custom integration, we host a PhotoShelter Website Customization 201 webinar each month that covers using manual templates in depth.
You can also watch a recorded version of that presentation.

If you have any questions, would like to hire us to integrate with an outside site, or would like a list of recommended designers, just shoot us an email at customization@photoshelter.com and we’ll get back to you!