How To Add Large Share Buttons To Your Blog Posts

on
Social networking now plays a major role in getting traffic to a blog and it all becomes better when your readers can easily share or bookmark your blog posts on their favourite social network.
This post explains how to add large share buttons to your blog posts. This includes facebook, twitter, digg, delicious and the whole rest of them.

1. Log in to your blogger account, click on design, then edit html.

2. Always remember to back up your template so you can restore it in case something goes wrong.

3. Click on Expand widget template

4. Press CTRL + F and search for this code:

<data:post.body/>
 
If you’re using a magazine style template or have more than one of this code in your template, locate the one that actually contains the post body on blog post pages. If you’re confused about the right one to use, search for this code instead:

<div class=’post-footer-line post-footer-line-2′/>
 
5. Just below that, paste this code:


<div style='border: 1px #3b5998; background-color: #eff3fa;'><div align='center'><b:if cond='data:blog.pageType == &quot;item&quot;'><strong>&#9829; CONSIDER SHARING THIS POST WITH YOUR FRIENDS IF YOU LIKE IT &#9829;</strong> <br/> <a class='opacity' expr:href='&quot;http://www.facebook.com/share.php?u=&quot; + data:post.url + &quot;&amp;title=&quot; + data:post.title' target='_blank' title='Share this post Facebook'><img alt='Facebook' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEh4oTjjQF4wagP4XalYinqZOgEnxN63t2TPaUR5AkW-WO0ynK_CSDf7AWmO8c1PsxCwyoo7D91dX0UGs-1MeIsNjUQ01Kx4i6dk_Sfi2AYy4ryEXiTF0gJ4oUwqRBYh4wVQbcsgRNu4dw/s1600/facebook_icn.png'/></a> <a class='opacity' expr:href='&quot;http://twitter.com/home?status=&quot; + data:post.url + &quot;&amp;title=&quot; + data:post.title' target='_blank' title='Tweet About This Post'><img alt='Twitter' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEidMe1h9aWwHQTaFbIzeDU_gqVhyWzlfHL0jgokTMuf62b6RfR-m5gLcOzRXjN_p7n8VdQZkBCYt7ATCSedd0QOoPJOHbdGWd7UuszLu6lOPsNY3Ics_zWmevKBUKXFJBpzxZnbIiHuFg/s1600/twitter_icn.png'/></a> <a class='opacity' expr:href='&quot;http://www.stumbleupon.com/submit?url=&quot; + data:post.url + &quot;&amp;title=&quot; + data:post.title' target='_blank' title='StumbleUpon This Post'><img alt='StumbleUpon' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhnzgkZ6yL7h0oglU9p4LrNUNn_grw9HkRT5_Surljg0QJjvwmFl_YPW18YXbac0myR2RpGUqLiBPeeEdNlZK9J8Ev4I3iTniZMXgv5SWapmFWue8JpPz94qrN3_u3fXRYXuBXTVsDaHw/s1600/stumbleupon_icn.png'/></a> <a class='opacity' expr:href='&quot;http://digg.com/submit?url=&quot; + data:post.url + &quot;&amp;title=&quot; + data:post.title' target='_blank' title='Digg This Post'><img alt='Digg' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgF__2bEegFw1gGwAO65zoZ1-45dP6N9JT7JctChCNDQ5E-PPRRK5oLjam_livxNvSzLobWxj8-DR8fpE9j9cdo0X2YQLs9dLig7UEsnYlWhiNJWz96DbfrybYusnDonzH8FZla-m8MIg/s1600/digg_icn.png'/></a> <a class='opacity' expr:href='&quot;http://del.icio.us/post?url=&quot; + data:post.url + &quot;&amp;title=&quot; + data:post.title' target='_blank' title='Add to Delicious'><img alt='Delicious' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg3ZU0iyiYSE65lJfc-OkGf8-bhVrO8ZbpIznpRQ1yxlqv8u3pIUmFMS-h1bK2SDS7DIGGiVE7vyNZf_Dp6VFi8QYqvzF3Oy9Od6HOJzOmdyabIH6EXeF3KSjfR6sDPbD-yaz8sY_1Skg/s1600/delicious_icn.png'/></a> <a class='opacity' expr:href='&quot;http://reddit.com/submit?url=&quot; + data:post.url + &quot;&amp;title=&quot; + data:post.title' target='_blank' title='Reddit this post'><img alt='Reddit' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgsDqMz_mfy-STT8QsEHqCJO38XmZu65Fkrq45kkHDOkf1PPZ-WYYFm9xFYBZxEMs4-an4fcb7JYk7whXyPY5HgOd7Ck2T-QAu1LuuZYE3-Fck76r3jssoc3Bh2I-yhp-cm2-z7GmlKJA/s1600/reddit_icn.png'/></a> <a class='opacity' expr:href='&quot;http://www.technorati.com/faves?add=&quot; + data:post.url' target='_blank' title='Add this to Technorati Favs'><img alt='Technorati' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgv0Ke9vR6xW55fSy8-qOWe8iNOd2uXhETJvFdhpHAw_YNrNJ9px88qQdPzmV503PdnjvEr7VDMB0ZYCW7b28NlQ64Wr9PkId771TA50DlcVtT805Vgo14vUavLH2hGhlnqhH5x5OH-8Q/s1600/technorati_icn.png'/></a> <a class='opacity' expr:href='&quot;http://www.mixx.com/submit?page_url=&quot; + data:post.url + &quot;&amp;title=&quot; + data:post.title' target='_blank' title='Mixx it'><img alt='Mixx' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgAeAmeUg_KqDnK2xh3-yfOpx9XLlOlRcNe0vKmfaiHUrmlkdoaaWLsdCj5DI7TEhCn50VHorGPkm_gcLL6SfyCBm2IH7SACRbM1SpwXWd9agcV5tp5IXh0LkZv1FcMKpksfRS4Ry9yKw/s1600/mixx_icn.png'/></a> <a class='opacity' expr:href='&quot;http://www.linkedin.com/shareArticle?mini=true&amp;url=&quot; + data:post.url + &quot;&amp;title=&quot; + data:post.title' target='_blank' title='Share on Linkedin'><img alt='Linkedin' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhFlhOtkT0aW_L8C9fM-v_4RDEfyPxvKeY-qpFF8Uvg68fRoIzvfvfHzh31uBN1NaGxnTivr1fkmd1kise_fuX8x6g3aF4euK2HZDJ_isulcT-d_a5VVkbRuPr9XOF-Y5mqpWC-KzUHzg/s1600/linkedin_icn.png'/></a><br/><small></small></b:if></div></div>

6. Save your template.
Now check any of your blog template and you can now see the large share buttons with facebook, twitter, digg, delicious, reddit, technorati, linkedin, mixx and stumbleupon.

You can as well style the icons with css.

Comments

Post a Comment