How to add social sharing button after below the post title.

How to add social sharing button after below the post title.

At first login your blog with your blog ID.

Go to Design>Edit HTML

Expand Widget Templates.

Search for <data:post.body/> using Ctrl+F.

Place the following code just above it.

<!--GOOGLE+1-TWEET-FACEBOOK-STUMBLE-STARTS-->

<b:if cond='data:blog.pageType == &quot;item&quot;'>

<div style='padding:4px;'>

<table border='0'>

<tbody><tr>

<td>

<div style='margin-right:10px;'>

<a class='twitter-share-button' data-count='horizontal' data-via='mybloggertips' href='http://twitter.com/share'>Tweet</a><script src='http://platform.twitter.com/widgets.js' type='text/javascript'/>

</div>

</td>

<td>

<div style='margin-right:10px;'>

<iframe allowTransparency='true' expr:src='&quot;http://www.facebook.com/plugins/like.php?href=&quot; + data:post.url + &quot;&amp;layout=button_count&amp;show_faces=false&amp;width=100&amp; action=like&amp;font=arial&amp;colorscheme=light&quot;' frameborder='0' scrolling='no' style='border:none; overflow:hidden; margin-left:0px; width:100px; height:20px;'/>

</div>

</td>

<td>

<div style='margin-right:10px;'>

<g:plusone expr:href='data:post.url' size='medium'/>

</div>

</td>

<td><div style='margin-right:10px;'>

<a expr:share_url='data:post.url' name='fb_share' rel='nofollow' type='button_count'/>  

<script src='http://static.ak.fbcdn.net/connect.php/js/FB.Share' type='text/javascript'/>

</div>

</td>

<td>

<div style='margin-right:10px;'>

<script expr:src='&quot;http://www.stumbleupon.com/hostedbadge.php?s=1&amp;r=&quot; + data:post.url'/>

</div>

</td>

</tr>

</tbody></table></div>

</b:if>

<!--GOOGLE+1-TWEET-FACEBOOK-STUMBLE-STOPS-->

Click Save template. You are done.

Read More

How to add different type Facebook like button in your blog.

Today I discuss how to add different types of Facebook like button in your blog. Now facebook is the leeding social site. You can see that, my blog has a Facebook like button at the end of a post and another just below the post title. Some days ago I discuss, how to add Facebook like button in your bog but today I discuss about different type of facebook like button. Facebook like button allow visitor to like your post so that other facebook friend can see this. Facebook like button helps you to increase traffic to your blog. 

There are three type of Facebook like button are shown in below

   

You can add any of them in your blog.

At first login your bolg with your Blogger ID,

Step 1. Go To Dashboard > Choose blog > Template > Edit HTML > Check "Expand Widget Template".

Step 2. Search (Ctrl+F) for <data:post.body/> and immediately before it place the following code:

Standard Facebook like button.

Code:

<b:if cond='data:blog.pageType != &quot;static_page&quot;'>
<iframe allowTransparency='true' expr:src='&quot;http://www.facebook.com/plugins/like.php?href=&quot; + data:post.url + &quot;&amp;send=false&amp;layout=standard&amp;show_faces=false&amp;width=400&amp;action=like&amp;font=arial&amp;colorscheme=light&amp;height=30&quot;' frameborder='0' scrolling='no' style='border:none; overflow:hidden; width:400px; height:30px;'/> </b:if>

Facebook like button with box count on top.

Code:

<b:if cond='data:blog.pageType != &quot;static_page&quot;'>
<iframe allowTransparency='true' expr:src='&quot;http://www.facebook.com/plugins/like.php?href=&quot; + data:post.url + &quot;&amp;send=false&amp;layout=box_count&amp;show_faces=false&amp;width=50&amp;action=like&amp;font=arial&amp;colorscheme=light&amp;height=63&quot;' frameborder='0' scrolling='no' style='border:none; overflow:hidden; width:50px; height:63px;'/>
</b:if>

Facebook like button with box count at side.

Code:

<b:if cond='data:blog.pageType != &quot;static_page&quot;'>
<iframe allowTransparency='true' expr:src='&quot;http://www.facebook.com/plugins/like.php?href=&quot; + data:post.url + &quot;&amp;send=false&amp;layout=button_count&amp;show_faces=false&amp;width=95&amp;action=like&amp;font=arial&amp;colorscheme=light&amp;height=25&quot;' frameborder='0' scrolling='no' style='border:none; overflow:hidden; width:95px; height:25px;'/>
</b:if>

Step3:

Now save the template. You are done.

Read More

How to add beautiful twitter bird in your blog.

Now social networking are played an important role to increase visitor to your blog and now Twitter is the second most popular social networking site. So you can use Twitter to increase traffic in your blog just add twitter follow me button. But today I will discuss about how to add twitter “Follow me” and “Tweet This” flying bird in your blog. It is one of the most attractive twitter widget which works on javascript,the animated flying bird goes to every corner of your blog when page is scroll up or down,it generally follow the cursor (mouse),it has a "tweet this" "follow me" link attach to it and this widget is compatible with all browsers.

To add this twitter bird follow those below steps:

Login your blogger account using your Id.

Go to Design>Edit HTML.

Back up your template first.

Now find </body> using Ctrl+F.

Paste the following code just above </body>

Code:

 

<!--Flying twiter bird code Start-->

<script src='http://bloggerblogwidgets.googlecode.com/files/way2blogging.org-tripleflap.js' type='text/javascript'>

 </script>

 <script type='text/javascript'>

 var twitterAccount = &quot; royaltech999 &quot;;

 var tweetThisText = &quot; <data:blog.pageTitle/> : <data:blog.url/> &quot;;

 tripleflapInit();

 </script>

<!--Flying twiter bird code end-->

Replace royaltech999 with your twitter username.

Save the template and go to your page to see beautiful twitter bird.

Read More