How To Add Linkedin Share Button with Counter to Blogger


Linkedin Linkedin has recently launched Share on Linkedin button for its publishers, bloggers, and businesses so that users can easily include a button on their site and enable their readers and visitors share the content of that website easily on Linkedin. As we all know that linkedin is a business-oriented Social networking site that is mainly used for business oriented networking.
Linkedin has got 3 different sharing buttons.
Integrating this into blogger will require some template edits.
To add this widget to blogger, follow these instructions:
Step 1:
Log in to Blogger, go to Design / Layout > Edit HTML and tick the "Expand Widget Templates" checkbox.



Step 2:
Now find (CTRL+F) this in the code:


<data:post.body/>

Vertical Count Button:
7
Share

Case 1:
Top Right

To place the linkedin share button at the top right corner of your post paste this code before/above it :


<div style="float:right;padding:4px;">
<script type="text/javascript" src="http://platform.linkedin.com/in.js"></script><script type="in/share" data-counter="top" expr:data-url="data:post.url">
</script>
</div>
NOTE: Don't forget to save the template.
NOTE: To change the button position from "Top-Right" to "Top-Left" just change the float position to left. i.e. float:right changes to float:left check it in Case 2 below.
Case 2:
Top Left

To place the linkedin share button at the top left corner of your post paste this code before/above it :


<div style="float:left;padding:4px;">
<script type="text/javascript" src="http://platform.linkedin.com/in.js"></script><script type="in/share" data-counter="top" expr:data-url="data:post.url">
</script>
</div>

NOTE: Don't forget to save the template.

Horizontal Count Button:Share7
Case 3:
Top Right

To place the linkedin share button at the top right corner of your post paste this code before/above it :


<div style="float:right;padding:4px;">
<script type="text/javascript" src="http://platform.linkedin.com/in.js"></script><script type="in/share" data-counter="right" expr:data-url="data:post.url">
</script>
</div>

NOTE: Don't forget to save the template.

No Count Button:Share
Case 4:
Top Right

To place the linkedin share button at the top right corner of your post paste this code before/above it :


<div style="float:right;padding:4px;">
<script type="text/javascript" src="http://platform.linkedin.com/in.js"></script><script type="in/share" expr:data-url="data:post.url">
</script>
</div>

NOTE: Don't forget to save the template.
This will put a linkedin share button to every post. But you won't be able to choose which post you want to include or exclude the button.

Check For More Social Share Buttons "How to add  Yahoo Buzz, Reddit, Facebook Like, Delicious, Google Buzz, Stumbleupon, Digg, Tweet, Retweet and Facebook Share buttons in blogger."

Comments