How to Add a Custom Pin It Button to your WordPress Blog

 

I’m super excited to share with you something that I only just learned how to do fairly recently. Today I’m showing you how to easily add your own custom “Pin It” button to your WordPress blog without knowing a lot of fancy code. Actually, you don’t need to know any code to do this! Let’s get started.

Step 1

The first thing you need to do is design your custom “Pin It” button. We use Photoshop so my instructions are for Photoshop. If you don’t have Photoshop or another program to use, we have provided some free downloads for you at the end of the post.

We start by creating a 100px x 100px square artboard. I’m creating a round button so I choose to turn off my background layer immediately so that I can see the edge of my design.

When my design is ready I save for use on the web. If you are doing a shape other than square be sure your background layer is transparent and be sure to save your button as a PNG.

Step 2

Log into your WordPress site and go to Plugins > Add New. Search for “JQuery Pin It Button for Images” then install and activate.

Once activated, find it in your plugins and go to the settings. I left the majority of the settings the way they were but down where it asks for the minimum size I made mine 400 x 400 as the smallest size. This may vary depending on your site. I didn’t want my pin it button to show up on my thumbnails or smaller graphics on my sidebar.

Under the “visual” tab, you can keep the settings as-is until you get to “use custom image”. Make sure you check this box and then upload your design.

Once uploaded, be sure to scroll down to the bottom of the page and save your changes for it to take effect.

Now you can go view your site and check out the fabulous new, custom “pin it” button you’ve added without writing any code! You may find that you need to go back and make a few tweaks here and there; I did. Just be sure to save each time you make a change.

Download Here