Posts

Showing posts from August, 2012

How to add Diggit, Technorati, Del.icio.us, Stumbleupon, Reddit and pInterest buttons to your Blogger posts

Image
Here's how you can add a row of social media sharing buttons all at one go :) Step 1 Locate the <data:post.body/> code in the HTML template. Step 2 Copy and paste the code below just after the  <data:post.body/> tag. <!--Digg--> <a expr:href='"http://digg.com/submit?phase=2&amp;url=" + data:post.url + "&amp;title=" + data:post.title' target='_blank'><img src="https://sites.google.com/site/mydesiowfamily/Home/diggit.png" border="0"/></a> <!--Technorati--> <a expr:href='"http://technorati.com/faves?add=" + data:post.url' target='_blank'><img src="https://sites.google.com/site/mydesiowfamily/Home/technorati.png" border="0"/></a> <!--Del.icio.us--> <a expr:href='"http://del.icio.us/post?url=" + data:post.url + "&amp;title=" + data:post.title' target='_blank'>

How to add pInterest button to Blogger posts

I got this easily done by referring to Bloggers Sentral's tutorial . Only two simple steps: Step 1 Locate the <data:post.body/> code in the HTML template. Step 2 Copy and paste the code below just after the  <data:post.body/> tag. You can change the "count-layout" attribute to either horizontal, vertical or none (no count) <!-- Pinterest Start --> <div id='pin-wrapper' style='margin:5px 10px 5px 0; text-align: left;'> <a class='pin-it-button' count-layout='horizontal' expr:href='&quot;http://pinterest.com/pin/create/button/?url=&quot; + data:post.url'>Pin It</a> <a href='javascript:void(run_pinmarklet())' style='margin-left:-93px; width:43px; height:20px; display:inline-block;'/> </div> <script src='http://assets.pinterest.com/js/pinit.js' type='text/javascript'/> <script type='text/javascript'> function run_pin

How to add StumbleUpon button to Blogspot

Image
In this post, I will show you how you can add a Stumbleupon button to each of your Google Blogger posts. Step 1 First, visit the StumbleUpon website ( https://www.stumbleupon.com/dt/badges/create ) to decide which badge style you prefer   As I was preparing this tutorial, there were 6 different styles of badges for selection as the ones below. Style 1 Style 2 Style 3 Style 4 Style5 Style 6 Step 2 Log in your Blogger dashboard and click the "Template" tab.  Thereafter, click the "Edit HTML" button. Step 3 After you have completed Step 3, Blogger will show you the partial HTML codes.  Make sure you check the "Expand Widget Templates" to see the complete codes. Step 4 Next,  use the Find function of your browser to look for this snippet of code.  Move on to Step 6 once you have located this code. <data:post.body>   Step 5 Place your cursor after the <data:post.body> and paste the