So it’s not often that I post contributor tips (I should really do more of it, if you have ideas send them to me), but this one really caught my eye, and I just had to do a little post about it. Check out this stamp design by TDSwhite, and then look below in the product description:
There are thumbnail links to all of his other wedding stamps. Very contextual… brilliant! This is cool and others should consider doing it, as it’s a great way to cross-sell customers to other relevant products from your gallery. So, you wanna learn to do it yourself? It’s pretty simple, let’s get started:
- Go to the product page of each product that you want to include and click on the “Link to This” button in the upper right hand corner:
- A little dialog will pop up, then copy the code in either of the two sections. I recommend the bottom one because it will be easier for what we’re doing. What is the difference between the two? Well, the top section has a bunch of extra stuff that we aren’t going to use like the product title and other text, so it is just as easy to construct our own code that is simpler. Also make sure you choose the image size that you want to use – if you only have a few products that you want to include then go with a larger image, but if you have lots of products then you might want to go smaller.
- Now you should have a line of code that looks like this “http://rdr.zazzle.com/img/imt-prd/pd-172405618385291633/isz-m/tl-Cream+Rose.jpg” right? Good. This is known as the image source, save that line for later (any text editor will do), ’cause we’ll be using it soon. Now close the “Link to This” window and go back to the product page. Here we want to copy the URL of the product page, just go to the address bar in your browser – it should look something like this “http://www.zazzle.com/product/172405618385291633“. Save this for later.
- Ok, so now we have two pieces of information: the image source and the product URL. Now we just need to make these work together. To do this we need this one line of html code:
<a href=”URL“><img src=”image source” border=”0″ alt=”Title of your product” /></a>
Just take the code you got earlier for the product URL and put that in between the quotes where it says “URL”, then take the code you got earlier for the image source and put that in between the quotes that says “image source”. Finally, to help search engines get a better look at your links, you might want to include the title of your product in between the double quotes where it says “title of your product”.
Then you should have something that looks like this:
<a href=”http://www.zazzle.com/product/172405618385291633“><img src=”http://rdr.zazzle.com/img/imt-prd/pd-172405618385291633/isz-m/tl-Cream+Rose.jpg” border=”0″ alt=”Cream Rose Postage” /></a>
- Got it? Good! You now have your cross-sell code! WooHoo! Now you can either repeat steps 1-4 to create a list of cross-sell links (like TDSwhite did) for lots of your products, or if you only need one, then just paste that bad boy into the long description of the product page where you want it to appear.
So that’s it – welcome to the wonderful world of cross selling!