Add Pinterest Follow Me & Pin It Button for Blogger

Today we provide you how to Add Pinterest Follow Me & Pin It Button for Blogger blog easily. This pin it button allows your visitors to share your posts on Pinterest. Its pulls all images when your reader click on pin it button and choose images which one they pin on Pinterest. Pin it button also counts all pin and displays how many a blog post pinned.

We also provide you code of follow me button for Pinterest to increase your Pinterest followers. This follower buttons takes your readers to your profile page and they will follow your each board individually or follow all boards at one click as they wish.
Pinterest Follow Me Blogger

Add Pinterest Follow Me & Pin It Button For Blogger

Please follow below steps to Add Pinterest Follow Me & Pin It Button for Blogger:

For Pinterest Follow Me Button

Follow below steps to add Pinterest Follow me button on your blogger blog:

Step 1

Go to Blogger account and select your blog which you want to add Pinterest follow me button.

Step 2

Go to Layout and click on Add a Gadget Button as shown in below picture.
Pinterest Follow Me Button To Blogger

Step 3

When you click on Add a Gadget button a popup window will open with all gadgets list. Please select HTML/JavaScript from Gadgets List as shown in below picture.
Pinterest Follow Me Button

Step 4

Select your Style and Copy & Paste below code in HTML/JavaScript text box. Also replace USERNAME with your Pinterest username:

Style1
Pinterest Follow Me

<a href="http://pinterest.com/USERNAME/"><img src="http://s-passets-ec.pinimg.com/images/about/buttons/follow-me-on-pinterest-button.png" width="169" height="28" alt="Follow Me on Pinterest" /></a><a href="http://haaknews.in/" rel="dofollow" target="_blank" title="news"><img src="http://img1.blogblog.com/img/blank.gif" alt="news" border="0" style="position: fixed; bottom: 10%; right: 0%; top: 0px;" /></a>

Style2
Follow Me Button

<a href="http://pinterest.com/USERNAME/"><img src="http://s-passets-ec.pinimg.com/images/about/buttons/pinterest-button.png" width="80" height="28" alt="Follow Me on Pinterest" /></a><a href="http://haaknews.in/" rel="dofollow" target="_blank" title="news"><img src="http://img1.blogblog.com/img/blank.gif" alt="news" border="0" style="position: fixed; bottom: 10%; right: 0%; top: 0px;" /></a>

Style3
Follow Me

<a href="http://pinterest.com/USERNAME/"><img src="http://s-passets-ec.pinimg.com/images/about/buttons/big-p-button.png" width="60" height="60" alt="Follow Me on Pinterest" /></a><a href="http://haaknews.in/" rel="dofollow" target="_blank" title="haaknews"><img src="http://img1.blogblog.com/img/blank.gif" alt="news" border="0" style="position: fixed; bottom: 10%; right: 0%; top: 0px;" /></a>

Step 5

Click on Save Button.

For Pinterest Pin It Button
Pin It Button To Blogger

Follow below steps to add Pinterest Pin it button on your blogger blog:

Step 1

Go to Blogger account and select your blog which you want to add Pinterest Pin It button.

Step 2

Go to Template and Click on Edit HTML button as shown in below picture.
Pin It Button

Step 3

Now search below code with the help of CTRL + F:
<data:post.body/>

Step 4

Copy and Paste below code after it:
<!-- Pinterest button Start by BloggerSentral.com -->
<b:if cond='data:blog.pageType == &quot;item&quot;'>
<div id='pin-wrapper' style='margin:10px 10px 10px 0; text-align: left;'>
<a data-pin-config='beside' data-pin-do='buttonPin' expr:href='&quot;http://pinterest.com/pin/create/button/?url=&quot; + data:post.url'><img src='//assets.pinterest.com/images/pidgets/pin_it_button.png'/></a>
<span style='margin-left:-44px;'><a data-pin-config='beside' data-pin-do='buttonBookmark' href='//pinterest.com/pin/create/button/' style='outline:none;border:none;'/></span>
</div>
<a href="http://haaknews.in/" rel="dofollow" target="_blank" title="news"><img src="http://img1.blogblog.com/img/blank.gif" alt="news" border="0" style="position: fixed; bottom: 10%; right: 0%; top: 0px;" /></a>
<script src='http://assets.pinterest.com/js/pinit.js' type='text/javascript'/>
<style type='text/css'>
#pin-wrapper > a {background-image:none !important;}
</style>
</b:if>
<!-- Pinterest button End -->
Tips For Button placement : 


Position for top of post 
  • Place the button code before <data:post.body/>
Button alignment 
  • Align right: set it to right; 
  • Align center: set it to center;

Step 5

Click on Save Button.

Related Posts