CODEWITHSUNDEEP
javascriptjquerypinterest
craftykate
craftykate

Reputation: 83

Multiple custom Pinterest "Pin It" buttons on a page?

I have a page on my site with multiple products, each product div has its own direct link like "mysite.com/products.php#product1" or "mysite.com/products.php#product2".

Pinterest provides a button to specify the url (so I can be specific and link to the exact product on the page) and image to be pinned, so I can use that on multiple places on the page, but it will not let me use a CUSTOM IMAGE for the pinit button.

What I'd like is a custom (meaning, using my own image) pinterest button for each product. I have found many examples for making a custom pinterest button, but they pull ALL the images from the page and link to the url the browser is on (like, "mysite.com/products.php", not the more specific url for that very product.)

So, I need code that will let me generate 1) a custom image for the button itself but will ALSO 2) let me specify the link and url like the original pinit button does.

Any help? I can find examples to do half of what I want, but I can't find anything that will let me satisfy both requirements.

Thank you!

Upvotes: 4

Views: 2787

Answers (1)

Sean Haddy
Sean Haddy

Reputation: 1666

You can specify an image for your Pinterest Button...

<a target="_blank" href="http://pinterest.com/pin/create/button/?url=YOURWEBSITE.com&media=YOURIMAGEURLHERE&description=YOURDESCRIPTIONHERE" class="pin-it-button" count-layout="none"><img border="0" src="//assets.pinterest.com/images/PinExt.png" title="Pin It" /></a>

Check out this JS Fiddle: http://jsfiddle.net/GF69r/1/

Upvotes: 1

Related Questions