Lately you might see quite a number of blogs with Pin it Buttons for individual images that enables you to click and pin the certain image straight away on Pinterest. If you have not, just hover on images in my other posts (I have disabled them in this post).

There are quite a few WordPress plugins for Pin it buttons on individual images. However, the buttons are usually the original buttons or logo of Pinterest. Today I’m sharing with you 9 pretty Pin it buttons that you can download and use for free (+tutorial on how to install them after the jump at the very bottom of this post!)

pretty-pin-it-buttons-design-is-yay

Here’s an example of what one of them is going to look like on your images

Pretty-Pin-It-Buttons-Design-is-Yay

 Download the buttons and the plugin, and instructions on how to install them after the jump!

 

download-button

 Click the download link above to download a .zip file containing 9 .png button files. I am using WordPress.org (self-hosted wordpress) as my blogging platform. I don’t think these buttons and the tutorial is going to work for wordpress.com, and I don’t know how to install them in other blogging platforms. You might want to ask an expert.

support-button

These buttons are free, and so is supporting this blog : ) Please support Design is Yay by sharing this post on facebook, twitter or pinterest.
Click one of the share buttons below this post. Thank You!

conditionsofuse

All photos and artwork are © Wita Puspita for Design is Yay. The images or documents you download in this article (or across my entire blog) are free for personal use only. Please do not use them commercially. If you re-post or re-use them in any way for your site or blog, please credit my blog. If you would like to use the printable for any commercial projects of yours, please ask for my permission first. Thank You!

So this is my first tutorial. I hope I’m doing it right. In case I make some mistakes, feel free to politely and nicely let me know at the comments section below ;)

Also, a little disclaimer, I’m not a programmer, web developer, or a web-designer. I have really really basic knowledge about CSS and HTML and other stuff like those two. So the tutorial below might not be the best way to do it, but this is what works for me. If you know a better way, please use your way. I am not an expert. 

After downloading the buttons file and extracting them from the .zip folder, follow these steps.

First, Download and install jQuery Pin It Button For Images to your wordpress.org.

Update: Good news! the jQuery Pin It Button For Images plugin author has updated the plugin. The latest version (0.9) enable users to upload their own buttons and set everything up on the plugin page! That means, no coding whatsoever needed!

So, after downloading and activating the plugin, here’s what you do:

1. Upload the button png file of your choice into media file, copy the URL

2. Go to the jQuery Pinit Button for Images plugin settings. Which is located on the left sidebar, Under “Settings” tab. When you hover, there will be jQuery Pin It Button for Images link that you can click.

3. On the plugin settings page, click to select the “use custom pinterest button” option. 

4. Underneath that, paste the URL of the button image. Set up the Height and Width px in the boxes (You can find the size of your uploaded button on the image chart included in the zip folder)

5. Click Update Settings

Done! How easy is that??? 

Preview your site, and you should be able to see you pretty Pin-It Buttons now! :D

If there’s any question, feel free to comment below, or contact me!

 

 

35 Responses to Free Pretty Pin it Buttons + Tutorial

Leave a Reply

Your email address will not be published. Required fields are marked *