PhotoShelter allows you to embed images or galleries into blogs and webpages using a few different methods.

1. Embed a slideshow
2. Embed a single image

Embedding a Gallery

You can embed a gallery like a YouTube™ video in other websites. Embedding a gallery is done through a Flash-based widget. Not all websites will allow you to use the gallery slideshow widget.

Here is an example of a live slideshow:

Neil Football Selects - Images by Allen Murabayashi

When your mouse is positioned over the slideshow, next/prev arrows appear. Alternately, you can use the forward and back arrow buttons on your keyboard. When you remove your mouse from the slideshow, the pagination arrows disappear after 2.5 seconds.

Wordpress users can read Eric Hegwer's solution to using the embeddable galleries.

Facebook users can read David Calvert's solution to embedding slideshows

A default gallery widget is shown. You can override any of the default values by altering the options in "Step 1."

Configurable Options

• Show caption on hover:If the image contains an IPTC Description, moving your mouse over the image will reveal a caption overlay with this caption info.
• Show slide number: : A counter for the current and total images in the slideshow. Slideshows can display a maximum of 1,000 images.
• Image title: : Displays the image name in the upper right of the slideshow. The name used for display is based on the data in either the IPTC Headline, IPTC Title, or filename field (in that order - meaning it will display the headline unless unavailable, and then the title, etc.).
• Photog credit: Displays IPTC Credit or IPTC Author (in that order) in the lower left of the slideshow.
• Clicking images links to website: By default, clicking on an image directs the viewer back to the large version of the corresponding image in your gallery. But you can disable this behavior by choosing "do not link images."
• Allow others to embed the slideshow: Clicking the "Share" button on the bottom menu reveals HTML code that can be used by others to embed your slideshow in their own blogs or websites. Images will always link back to your site (unless "do not link images" is selected in the previous option).
• Enable send-to-friend: Will add an "Email" link to the "Share" prompt. This "Email" link will allow others to email the slideshow to others.
• Enable full-screen option: If this is disabled, it will hide the full-screen icon that allows viewers to resize the slideshow to fill their monitor screens.
• Enable image smoothing: For larger slideshows where the image might not have sufficient resolution to fill the player (or full-screen), use image smoothing to eliminate jaggies.
• Enable image upsampling: By default (as part of our security model), the largest image size that we will display is 1000px on the image's longest side. If you'd like to display images larger than the 1000px screen-resolution image, you can check this box to enable upsampling. (We recommend you enable smoothing, too, in this case.)
• Show top title bar: The top title bar displays the gallery name and file name. Uncheck this to hide the top bar entirely.
• Show bottom menu bar: The bottom menu bar displays image credit, image position, pause/play, matrix view, share, and full-screen buttons. Uncheck this to hide the bottom bar entirely
• Display watermark: Uncheck this box to disable watermarks for the slideshow only (it will not affect watermarks on the rest of your site). If you don't have a global watermark set, a watermark will never display, despite your preference here.
• Include HTML links below slideshow (SEO): ): An HTML link appears directly below the slideshow player with a backlink to the original gallery on your PhotoShelter website. This is beneficial for search engine indexing.
• Enable matrix view: Clicking the matrix button shows tiny thumbnails of the images which eases navigation within a large gallery.
• Thumbnail setting: a "thumbs" icon appears in the lower left of the player. Clicking it reveals a "filmstrip" navigation below the main image. You also have the option to always display the thumbs: Click "Thumbs filmstrip always on" to enable this. To hide thumb navigation entirely, click "No filmstrip".
• Width/Height/Constrain: You can define the size and aspect ratio of the player. This allows you to set it for panoramic, square or vertical configurations. Click "Constrain Proportions" to maintain the aspect ratio as you adjust sizes within the configurator.
• Background Color: When images do not fill the entire viewing area, the background color bleeds through with a light gray by default. You can override this color with a custom choice or make the field transparent.
• Horizontal Fit or Crop: To prevent the gray borders of the background color from displaying, you can "crop image to fit frame".
• Vertical:If you have two vertical images that are adjacently sequenced, the player will display them simultaneously next to one another in a single frame.
• Transition Style: Select from five transition styles.
• Time between slides: You can define the time elapsed between slides (from 2-10 seconds).
• Auto-play slideshow:: You can determine whether the slideshow should start to transition between images automatically, or whether a user click is required to begin the automatic advancing between images.

When you have finished selecting your options, click the blue "Update Preview" button in Step 2. The Slideshow will refresh and the embed code will update itself.

Distribution Considerations

If enabled, anyone can embed the gallery elsewhere. This is part of the virality of the widget, which effectively gives you free marketing. Even though clicking on an image in the slideshow will return the user to your PhotoShelter page, will still recommend that you set a watermark over your images for added security.

Embedding a single Image

When you are viewing an image in the Archive Browser or a gallery, you can click on the "Get Link" icon to reveal your choices for embedding the images externally (aka hotlinking). Your image has to be either publicly searchable or within a public gallery to be embedded externally.

We strongly recommend using a watermark.

There are three main options:

1. Embed
2. Image Link
3. Page Link

Embed

The embed option is a Flash object (similar to how you embed a YouTube video). This is the recommended option for using images externally because it provides an automatic link back to the originating page, where the viewer can license it. Copy and paste this code to use.

An embedded image can also be embedded by others giving you a viral and free marketing mechanism.

Image Link

In some instances, you might not be able to use a Flash object. The Image Link is an HTML-only method to use the image externally. Copy and paste this code to use.

If you wish to display an image that also links back to its home on PhotoShelter you would use both the "Image Link" and "Page Link" in a HTML <a href> tag. Here's an example.

<a href="http://www.photoshelter.com/img-show/I0000A6c9pKNBP9U"><img src='http://c.photoshelter.com/img-get/I0000A6c9pKNBP9U/s'/></a>

Page Link

The page link is a URL to the image.

More options

Click the "more options" link to see more available sizes of the embed option.

FAQ

Are my slideshows iPhone / iPad compatible?

Yes. If a viewer comes across your slideshow on an iPhone or iPad, we will display the cover image of your gallery instead of the full slideshow. (Currently, the Flash platform is not supported on an iPhone or iPad, and the slideshows are built as Flash objects.)

Known Issues

If using the Internet Explorer browser, you may notice that the matrix view does not consistently display images when previewing the slideshow from within the configurator. Please note that this problem does not occur within the live slideshows - the inconsistent display is isolated to the configurator preview in Internet Explorer.