SEO Search

  • Subscribe to our RSS feed.
  • Twitter
  • StumbleUpon
  • Reddit
  • Facebook
  • Digg

Sunday, 4 March 2012

Add Social Bookmarking Buttons near Adsense Ads

Posted on 18:04 by Unknown
The main advantages of this widget is that you can increase your AdSense impressions along with CTR - and of course, fill up the empty space besides Adsense units, making your blog look more attractive.

Adding the social bookmarking buttons at the top of your blogger post, will make things easier when your readers will want to share your posts via the networking sites. The widget includes buttons for Del.icio.us, Twitter, Facebook, StumbleUpon, Technorati and Digg.


How to add this widget:

1. Firstly, login to your Blogger Dashboard and go to Template and then click on the Edit HTML button
 (don't forget to make a backup of your template)

2. Search (CTRL + F) for the following tag:

]]></b:skin>

3. Paste the following CSS code just above it:

.ads{margin-bottom:10px; border-top:solid 1px #DEDEDE; padding-top:10px; font-size:13px;}
.ads-right-min{border-left:solid 1px #DEDEDE; height:250px; padding-left:10px;}
.ads-right-min a:link,
.ads-right-min a:visited,
.bottom-share-links a:link,
.bottom-share-links a:visited{
font-size:12px;
color:#222;
display:block;
height:22px;
line-height:22px;
margin-bottom:16px;
padding-left:32px;
}
.ads-right-min a:hover,
.bottom-share-links a:hover{color:#666;}
.mini-tech{background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiy3z9TAm-xAWcJ7GHwVHNHQWo3ciKGzV3jk2hoCpL-CXylJlKWbOMvLwn6EyLd6Mtds8RQhTTCK2I1ECLg6UFtcno6sQuHdOfL5D8dvPsjNPvYM3Dco-ZJdZR6Bd37LgNhy0551HRuD5YR/s1600/technorati.gif) no-repeat;}
.mini-facebook{background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEguDicpY06amIYdTekmVJ1esy9vIePojt4osfrg_EEEZCYR-g5xMrQ8mNRpf64kssYy7M8NLpIfTsVtZlrmKMDNSqaLrlK1VFGjggkjO5SDHf8Cnz_E5z6IZ_vckANHwTQsVuKp2KZu4_av/s1600/facebook.gif) no-repeat;}
.mini-tweet{background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjtfIOmkd_Omi2WYfAHGMHwPs_ggZDUft5s73I8O537mfmPTcQ8fXSf0oe_5_K7_UYU78KPey9gM3XXZeQrvjtArL_O5wxLt9m6dAiOv81UI7escFU7_GMH84RFTMLLJjGlgKRok1Lich0n/s1600/tweet.gif) no-repeat;}
.mini-del{background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg4DG7EKK5VXIGLTDLwXajZDH-QIqu2CUvRSdd-kJs35GNPWegJNoym8H57_ZNwpd0aAQdEHKOINjcRWXjks5czzBOBWvcWJgO8EQgAEQCoD4goZs9X4Bd-SxXNwzGHYl9X-wplLQ1i4Xld/s1600/delicious.jpg) no-repeat;}
.mini-stumble{background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhO9W0zKRv4z7SdSZcn6GtLxw2FtvmR0xC3FMOYASEqmcIGHViFYa3wxKlg0MwzhiItodlhei7XNLcGyY1NlnMKjaJ0BUQfWvV5DYS8dSLlCpv4p-_3AKGOOZurJEkxjLR0VtECACsqDHQQ/s1600/stumbleupon.png) no-repeat;}
.mini-digg{background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgMUkh-C1GEF18W-QrM44x8KEXTawlh0wXS9JaWb7593DHmxL5FwGx5_UvEj4LhW-_-wWtQ090z0WsviLeY-RKF9jNMmQzhK24yaiL76OPNhct2bolaDeNIueSDsGEqTdUzMi2siNV6noWx/s1600/Digg.png) no-repeat;}

4) Now search - using "CTRL+F" - for the following line:

<div class='post-body entry-content'>

 If you can't find it, search for this one:

<div class='post-body entry-content' expr:id='&quot;post-body-&quot; + data:post.id'>

5) Add the following code directly below it:

<b:if cond='data:blog.pageType == &quot;item&quot;'>
<div class='ads'>
<table border='0' cellpadding='0' cellspacing='0' width='100%'>
<tr>
<td width='354'>
&lt;script type=&#39;text/javascript&#39;&gt;&lt;!--
google_ad_client=&quot;pub-YOUR PUBLISHER ID&quot;;
google_ad_host=&quot;pub-1556223355139109&quot;;
google_ad_width=300;
google_ad_height=250;
google_ad_format=&quot;300x250_as&quot;;
google_ad_type=&quot;text_image&quot;;
google_ad_host_channel=&quot;0001&quot;;
google_color_border=&quot;FFFFFF&quot;;
google_color_bg=&quot;FFFFFF&quot;;
google_color_link=&quot;0000FF&quot;;
google_color_url=&quot;008000&quot;;
google_color_text=&quot;000000&quot;;
//--&gt;&lt;/script&gt;
&lt;script src=&#39;http://pagead2.googlesyndication.com/pagead/show_ads.js&#39; type=&#39;text/javascript&#39;&gt;
&lt;/script&gt;
</td>
<td><div class='ads-right-min'>
<a class='mini-del' 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 Del.icio.us'>Add This To Del.icio.us</a>
<a class='mini-tweet' expr:href='&quot;http://twitter.com/home?status=Reading &quot; + data:post.title + &quot; &quot; + data:post.url' target='_blank' title='Post this article on Twitter'>Tweet/ReTweet This</a>
<a class='mini-facebook' expr:href='&quot;http://www.facebook.com/sharer.php?u=&quot; + data:post.url + &quot;&amp;title=&quot; + data:post.title' target='_blank' title='Share On Facebook'>Share on Facebook</a>
<a class='mini-stumble' expr:href='&quot;http://www.stumbleupon.com/refer.php?url=&quot; + data:post.url + &quot;&amp;title=&quot; + data:post.title' target='_blank' title='Stumble This'>StumbleUpon This</a>
<a class='mini-tech' expr:href='&quot;http://www.technorati.com/faves?add=&quot; + data:post.url' target='_blank' title='Add To Technorati'>Add to Technorati</a>
<a class='mini-digg' expr:href='&quot;http://digg.com/submit?phase=2&amp;url=&quot; + data:post.url + &quot;&amp;title=&quot; + data:post.title' target='_blank' title='Digg This'>Digg This</a>
</div>
</td>
</tr>
</table>
</div>
</b:if>

Replace YOUR PUBLISHER ID with your AdSense account ID. You'll find it with the Home tab, on your "Account settings" page. It should look something like this:

pub-5623269265862168 (copy only the numbers and then paste them)

6) Save template... and just go to one of your post to see the changes!
Email ThisBlogThis!Share to XShare to Facebook
Posted in adsense, adsense optimization, blogger, social media, social media plugins | No comments
Newer Post Older Post Home

0 comments:

Post a Comment

Subscribe to: Post Comments (Atom)

Popular Posts

  • How to change Blogger "Post A Comment" Message
    In this tutorial i will show you how to replace the 'Post A Comment' text that appears above the comment form with an image. Also, I...
  • CSS Basics. How to Apply Rounded Corners On Images #1
    This tutorial will explain how to change the outside border of any image using some simple CSS rules to make it round, but this is so easy t...
  • Google adsense optimization tips
    What is Google Ad S ense?  Google AdSense is a free program run by Google that allows you to display Google adverts on your blog/website and...
  • CSS Basics. How to Apply Rounded Corners On Images #2
    In the previous post I have mentioned that we will learn to round images using CSS, without needing to edit them one by one using a program...
  • 4 Different Styles For the Popular Posts Widget
    Blogger allows us to easily add a " Popular Posts " widget, that we select from its list of gadgets, and we can do that by going t...
  • Turn off the lights with jQuery
    For those who enjoy watching videos on the net, this is a very useful script made by Janko with jQuery. So what this script does? It will ...
  • How to Replace Older Posts and Newer Posts Links with Blogger Post Titles
    If you have ever visited a WordPress blog, you might have noticed that the blog pager on these blogs displays the actual post titles, not ju...
  • How to Make the Blogger Posts Have a Calendar for the Date in
    It's quite common to see calendar style dates next to some WordPress posts but for the Blogger platform it isn't always an very easy...
  • Hide/Show Widgets/Gadgets in Home/post/static/archive pages in Blogger
    As some of you may have noticed, all the widgets/gadgets you add to your blog, will be displayed on all the pages by default, including the ...
  • Ways To Increase Page Impressions and Traffic on Your Blog
    What is a Google AdSense "Page Impression"? The page impressions or page views - how much time a user stays on your website and h...

Categories

  • adsense
  • adsense optimization
  • adsense tips
  • Auto Video Template
  • avatars
  • blockquotes
  • Blog Design
  • blogger
  • blogger posts
  • color code generator
  • Comments
  • comments tricks
  • css
  • emoticons
  • Emoticons/Smileys
  • Facebook
  • feedburner
  • forum
  • Hacks
  • how to
  • how to make a blog
  • Image Effects
  • internet
  • jQuery
  • labels
  • menus
  • Navigation
  • navigation menu
  • popular posts
  • posts
  • read more
  • recent comments
  • recent posts
  • related posts
  • RSS
  • SEO
  • sitemaps
  • slideshows
  • social media
  • social media plugins
  • static pages
  • Templates
  • threaded comments
  • titles
  • tools
  • translating
  • webbligi
  • Widgets

Blog Archive

  • ►  2013 (57)
    • ►  November (4)
    • ►  October (16)
    • ►  September (13)
    • ►  June (3)
    • ►  May (4)
    • ►  April (5)
    • ►  March (12)
  • ▼  2012 (73)
    • ►  July (1)
    • ►  June (3)
    • ►  May (9)
    • ►  April (23)
    • ▼  March (30)
      • How To Add Related Posts Widget To Blogger with Th...
      • How to change Blogger "Post A Comment" Message
      • How to optimize Images and Increase Blog Traffic
      • How To SEO Optimize Your Blogger Blog Titles For H...
      • How To Remove Blogger Attribution Gadget
      • How to add a gadget/widget inside your Blogger Blo...
      • How to Burn Blogger RSS Feeds at Feedburner
      • Add Facebook Like Button Below Post Titles
      • Auto Read More with thumbnail for Blogger/Blogspot...
      • Adsense Ad Code Converter
      • How to put Adsense ads on Blogger/Blogspot
      • How To Remove Blogger Threaded Comments
      • Add Videos/Images in Blogger/Blogspot Comments
      • How to add Facebook Like/Fan Box to Blogger
      • Add Recent Comments Widget with Avatars To Blogger
      • Add Random Posts Widget to Blogger
      • Remove - Subscribe to: Posts (Atom) from Blogger
      • Add Multi-Colored Popular Posts to Blogger
      • Recent Comments Widget For Blogger
      • Hide/Show Widgets/Gadgets in Home/post/static/arch...
      • How to create Google Adsense Account
      • How to create a Facebook Fan Page for your Blog
      • How to remove/hide or add a Peek A Boo Effect to y...
      • Awesome Slide Open Heart Bookmarking Gadget For Bl...
      • Add Css/Jquery fixed horizontal menu to blogger blog
      • What is blogger and how you can create a blogger b...
      • Google adsense optimization tips
      • Add Social Bookmarking Buttons near Adsense Ads
      • AdSense optimization tips straight from Google
      • Wrap text around Adsense block in left or right co...
    • ►  February (7)
Powered by Blogger.

About Me

Unknown
View my complete profile