Like us on facebook to get more free pro tricks daily...!

Liked us?

Thursday 5 April 2012

Pin It

Facebook Social Bookmarking Widget for you



I hope most of you have downloaded the free Social Media Buttons which are designed just how Facebook Buttons are designed. In today's tutorial we will learn how you can add those buttons to your blogger blogs. The steps are similar to the earlier Social Bookmarking widget that we shared.

Facebook-Bookmarking-Widget




Live Demo

Steps To Be Followed

  1. Go To Blogger > Design > Edit HTML
  2. Back up your template
  3. Check the Expand Widget Templates box
  4. Then click Ctrl + F and in the browser search box paste this,
data:post.body
    5. Now Just above this code paste the code below,
<b:if cond='data:blog.pageType == &quot;item&quot;'>
<table border='0'>
<tr>
<td>
<!--Stumbleupon-->
<a expr:href='&quot;http://www.stumbleupon.com/submit?url=&quot; + data:post.url + &quot;&amp;title=&quot; + data:post.title' rel='external nofollow' target='_blank'><img alt='Stumble' src='StumbleUpon Button Link'/></a>
</td>
<td>
<!-- Twitter -->
<a expr:href='&quot;http://twitthis.com/twit?url=&quot; + data:post.url + &quot;&amp;title=&quot; + data:post.title' rel='external nofollow' target='_blank'><img alt='Twitter' src='Twitter Button Link '/></a>
</td>
<td>
<!--DIGG-->
<a expr:href='&quot;http://digg.com/submit?phase=2&amp;url=&quot;  + data:post.url' rel='external nofollow' target='_blank'><img alt='Digg This' src='DIGG Button Link '/></a>
</td>
<td>

<!--Email a Friend-->
<a expr:href='data:post.emailPostUrl' expr:title='data:top.emailPostMsg'>
              <img alt='' src='EMAIL Button Link'/>
          </a>
</td>
<td>
<!--Facebook-->
<iframe allowTransparency='true' expr:src='&quot;http://www.facebook.com/plugins/like.php?href=&quot; + data:post.url + &quot;&amp;layout=standard&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; width:450px; margin-top:16px; height:40px;'/>
</td>
</tr>
</table></b:if>

    6.  Simply Replace the blue bolded text with button links I shared in last post on Facebook Buttons. Finally save your template and you are done! :>

Kindly Bookmark this Post using your favorite Bookmarking service:
Technorati Digg This Stumble Reddit Facebook Twitter
Do you Like this Article..?

Get Subscribe to Free Email Updates!!

*Your email address will not be shared with anyone.



Link To This Page:


Link To Home Page:

0 Responses to Facebook Social Bookmarking Widget for you

Confused? Feel free to ask

Your feedback is always appreciated. We will try to reply to your queries as soon as time allows.

Note:
1. To add HTML CODE in comments then please use our HTML Encoder.
2. If you are including a link, Please include it using html tags. However irrelevant links are not tolerated.
3. Please do not spam, Spam comments will be deleted immediately after our review.

Regards,
Rupesh.

 

Total Pageviews

Translate

7TeraByte © 2012. All Rights Reserved | DMCA Protected | Back To Top