Myerson Photo Blog

Words and Deeds of Myerson Photo

Linking to Other Images on iStockphoto

Filed under: Tutorials
9:50 am on Thursday, November 29, 2007

One of the best ways to market your stock photography on iStock is to provide buyers with links to similar images. Many iStockers group together similar images; those using the same models, those taken at one iStock event, those that fall within a certain theme (like “My Coffee Images”, “My Business Images”, “My Colonoscopy Images”, etc.). Lacking any hard data (or even soft data) to support this claim, I’ll go ahead and pretend that setting up links to similar images has accounted for 32.8% of all my sales. Why not?

Linking to Other Images on iStockphoto

A lot of iStockers - especially those new to the game - have trouble with the code and setup required to do something like this. Fear not, amigos, I’m here to help. In general, I’d say there are three methods available to the iStockphoto contributor for this kind of job. These are the one-off, the private lightbox, and the search.Before we dive into these, though, lets take a minute to discuss code. Since each of the methods discussed here involves providing a link, we’d better learn how to do that. iStock uses a method called UBB to allow contributors to write code. UBB code uses tags in [square brackets] to indicate that the browser should display something special, like links. The way to tell UBB to generate a link is with the [URL] code. In its general form it looks like this:
[url=http://www.something_or_other.com/directory/page].

It has a matching end tag that looks like this: [/url]. Between those two tags, you put the text that you want to become linkified. So, if you write code like this:
[url=http://www.myersonphoto.com]Myerson Photo[/url]

You’d wind up with this:
Myerson Photo

Simple, no? Images work in a similar way. You have an open tag and a close tag: [img] and [/img]. Between those, you’d place the url of your image. The fun comes when you create an [img] inside the open and close tags of an [url]. So let’s get started:

The One-Off
The one-off is nothing more than a link to one specific picture in your description. This would be useful if you have two variants of an image; a black and white version and a full-color one, for instance. Or a horizontal crop vs. a vertical one. For each image, you’d provide a link to the other. The link in this case would go directly to the image detail page for the other image. That would look like this:
[url=http://www.istockphoto.com/file_closeup.php?id=1788872] My Other Cool Image [/url]

Alternatively, you can use an image in place of the “My Other Cool Image” text, using the [img]...[/img] code, above. The image you use can be anything. You may use an image in your own web hosting space, in some free image hosting place, or on iStockphoto itself. If I were linking directly to image #1788872, as above, I’d probably use that image itself:
[url=http://www.istockphoto.com/file_closeup.php?id=1788872] [img]http://www1.istockphoto.com/file_thumbview_approve/1788872/2/istockphoto_1788872_book_afire.jpg[/img] [/url].

What the h*ck?! Where did that nonsense inside the [img] tags come from? Pretty easy. I just right clicked on the iStock thumbnail for the image, and selected “Copy Image Location” (I’m using FireFox. If this were IE, I’d right-click and select “Properties”. The URL of the image would show up in that window).

The Private Lightbox
Lets say you want to link not to one other image, but to a whole lightbox of images. This would be useful to showcase all of your images that feature the same model. The crux of what you do - URL tags surrounding an image or some text - is the same. The devil, as they say, is in the details. This time, you’ll use a different URL inside the URL tags.

Firstly create your lightbox. Throw any and all of your pertinent images in there. I’m going to take this opportunity to get up on my lightbox soapbox for a minute. The collection of images that you put into this lightbox represent a perfect opportunity to use a PRIVATE LIGHTBOX. Private lightboxes are just like public lightboxes. The only real distinction is that they won’t be found in a lightbox search. This is a good thing. Your collection of your images should not be searchable. Never fear; It’s still viewable by the public. All you have to do is tell people how to get to it, which is precisely what we’re doing here.

That said, create your private lightbox and view it. See all those swell images in there? Nice work. Go to the address bar of your browser and copy the location. Paste that into your [url=] tag, and you’ve linked to the lightbox. Nice work. An example of that would look like this:
[url=http://www.istockphoto.com/file_search.php?action=file&lightboxID=569463] All Pictures of Jamie [/url].

Alternatively (as you well know by now) I could use an image instead of text:
[url=http://www.istockphoto.com/file_search.php?action=file&lightboxID=569463] [img]http://www1.istockphoto.com/file_thumbview_approve/1277389/1/istockphoto_1277389_businesswoman.jpg
[/img][/url]
.

That second example ends up looking like this:




The Search

The final methodology for grouping and linking images is my favorite. The search is cool because it automatically updates itself anytime you upload a new image that belongs in it. You don’t even have to maintain a lightbox. It’s what I use to group and link my business pics, my coffee pics, my book pics, my school supplies pics, you name it. Because it’s based on iStock’s keywords and search capabilities, it is self maintaining. If I upload a new school supplies image tomorrow, it’ll be found by my school supplies link as soon as it’s approved and active. It takes a little more knowledge than the other methodologies, but nothing we can’t handle.

The first step here is to view your own portfolio. While you’ve got all your images returned, do a “search within” to return just the images you’ll want linked in this method. You might have to do a Boolean search to get just what you want (”books not library”, for instance, or “books and prayer”). Once you’ve got the search, and it returns the right images from your portfolio, copy the URL from the browser’s address bar. You’ll see a lot of stuff in that address, including a couple of key elements: “userID=xxx”, “within=1″, and the search terms you used. You may see a lot of weird characters as well - percent signs, plus signs, and numbers. These are just the HTML URL way of displaying parentheses, dashes and other such characters that have a way of confusing browsers. Don’t sweat it. You should be able to copy the address wholesale and copy it into the [url] tags as above. By now you should be an expert.

I hope these little management tips have been helpful. Happy iStocking!

[Slashdot] [Digg] [Reddit] [del.icio.us] [Facebook] [Technorati] [Google]

7 Comments »

Comment by Kat

January 3, 2008 @ 12:25 pm

thanks so much for publishing this blog…I definitely have seen a change of revenue since I started linking my images to each other! On some of my links, I actually made flashing gif files to further capture the attention of my clientele. Thanks again!

Comment by Carol

January 24, 2008 @ 10:21 am

I’m just starting, but I think this is a good place to do so!

Comment by dszc

January 25, 2008 @ 12:22 am

Thank you HUGELY for this tutorial!

Comment by Meppu

March 1, 2008 @ 1:23 pm

One thing that I would have appreciated; the actual spot where you write your url. Blogspot? Image edit? Some other spot?

Comment by remsan

March 5, 2008 @ 11:55 pm

A shorter version for the thumbs
/file_thumbview_approve.php?size=1&id=1277389
Skip the http://… for istock thumbnails on istock.
In this case you get more place for thumbnails :)
You can play with the size: 1,2,3 or 4

Comment by davidorr

June 11, 2008 @ 12:13 pm

Great tutorial, this is wonderful!

Comment by Patrickoberem

July 5, 2008 @ 1:07 pm

Thanks for the tutorial Ethan. I’m lost with regards to how to insert a button with text etc into the code. How does one get a button into one’s portfolio so that one can reference it for the link, eg. red banner with three or four images? Thanks for your time.

Patrick

RSS feed for comments on this post. TrackBack URI

Leave a comment

XHTML: You can use these tags: <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <code> <em> <i> <strike> <strong>