Friday, December 28, 2012

Grabbing Zazzle Images, and Resizing Them

Zazzle makes it very easy to grab images from their site.  There's a link button on each product page that lets you grab code to paste on your website or blog  (on some pages it's under "Share This").

Here is an image I grabbed without changing the code...
Scribbleprint Clover Sticker
Scribbleprint Clover Sticker by scribbleprints
See more Clover Stickers

Below is what that code looks like.  I've colored it for clarity.  The red code is what makes this centered (and does some other formatting which I haven't figured out the importance of).  The purple code is what turns the picture into a link.  The green code is the image code, and the bolded part is the image URL.   The code in blue is the text under the sticker. 

 <div style="text-align:center;line-height:150%"> <a href=""> <img src="" alt="Scribbleprint Clover Sticker" style="border:0;" /> </a> <br /> <a href="">Scribbleprint Clover Sticker</a> by <a href="*">scribbleprints</a> <br /> See more <a href="">Clover Stickers</a> </div>

Now lets look at just the image URL. 

Notice the number right before the jpg.  This is the pixel size.  Below, I've changed that pixel size to 200.
 Scribbleprint Clover Sticker 

Now, you can make any Zazzle image as big as 499 (after 500 they put a watermark over it) or as small as you want.

No comments:

Post a Comment