NOW ADD NEW 4 In 1 Social Shere Sliding Pop Out Widget To Blogger.

NOW ADD NEW  4 In 1 Social Shere Sliding Pop Out Widget To Blogger.

 1. Go To Blogger than go to tag Design   and than  Edit HTML

2.   THAN CLICK BOX  Expand Widget Template
3.   Search For The Tag </head> (by Using ctrl + f )
4.    Copy and Paste Below Code Before  </head>

<link rel="stylesheet" href="https://gj37765.googlecode.com/svn/trunk/[www.linktohow.blogspot.com]multipopoutwidget.css"/>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js"></script>
<script type="text/javascript" src="http://apis.google.com/js/plusone.js"></script>
<script type="text/javascript">
jQuery(document).ready(function(){
 jQuery("#facebook_right").hover(function(){ jQuery(this).stop(true,false).animate({right:  0}, 500); },function(){ jQuery("#facebook_right").stop(true,false).animate({right: -200}, 500); });    jQuery("#twitter_right").hover(function(){ jQuery(this).stop(true,false).animate({right:  0}, 500); },function(){ jQuery("#twitter_right").stop(true,false).animate({right: -250}, 500); });     jQuery("#google_plus_right").hover(function(){ jQuery(this).stop(true,false).animate({right:  0}, 500); },function(){ jQuery("#google_plus_right").stop(true,false).animate({right: -154}, 500); });    jQuery("#feedburner_right").hover(function(){ jQuery(this).stop(true,false).animate({right:  0}, 500); },function(){ jQuery("#feedburner_right").stop(true,false).animate({right: -303}, 500); });    });

</script>

5.  Save  Template  all done !!!!


  second step  Adding HTML Code

• Go to Blogger>>Design>>>Add a Gadget 
• Choose HTML/Javascript 
• Copy n paste below HTML code Into It,

<div id="on">
    <div id="facebook_right" style="top: 18%;">
        <div id="facebook_div">
            <img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgIqFywBgEolfxZg8kbydp-j1kgaz_MB8U6XEXJ2gHi2_ejX-eHu7FN54m5hRk8qGZGKlPgEZ2_zHX_IjLTcvTCyNPt_ytQOgZjc44pSjlM1loJn8h5iWWq3dwoeZtP0gAs9AaI47pAph05/s1600/%255Bwww.gj37765.blogspot.com%255Dfacebook_right.png" alt="" />


            <iframe src="http://www.facebook.com/plugins/likebox.php?href=http%3A%2F%2Ffacebook.com%2Fthewallofwierd&amp;locale=en_GB&amp;width=200&amp;connections=9&amp;stream=&amp;header=false&amp;show_faces=0&amp;height=356"   scrolling="no"></iframe>
        </div>
    </div>
</div>
<div id="on">
    <div id="twitter_right" style="top: 35%;">
        <div id="twitter_div">
            <img id="twitter_right_img" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjrGCs03ez-tiJszJIGOTgpoP4wvPD0y4hxKswEf4cM5aWOzQEvqOEsH1SE6rGz3Tv7l39bVBSUbG5SWphKlQ99OlgrL0qdEWw9oPzsyv827H5RUdEUyRzMbGJZKjo0WUmCH2LTQfE2O7A_/s1600/%255Bwww.gj37765.blogspot.com%255Dtwitter_right.png">
            <script src="http://widgets.twimg.com/j/2/widget.js"></script>
            <script>
                new TWTR.Widget({
                version: 2,
                type: 'profile',
                rpp: 4,
                interval: 1000,
                width: 246,
                height: 265,
                theme: {
                shell: {
                background: '#63BEFD',
                color: '#FFFFFF'
                },
                tweets: {
                background: '#FFFFFF',
                color: '#000000',
                links: '#47a61e'}
                },
                features: {
                loop: false,live: true,
                scrollbar: false,hashtags: false,timestamp: true,avatars: true,behavior: 'all'                  }
                }).render().setUser('linktohow').start();
            </script>
        </div>
    </div>
</div>
<div id="on">
    <div id="google_plus_right" style="top: 52%;">
        <div id="google_plus_div">
            <img id="google_plus_right_img" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEj9G5oflufrRtOqU7tsm-0a-70ytsT1LkQRd10pnoeug6tysBHYydMRYMAeJm9fGB19aBlwJNeWgXC9J9lz5fp_wLmexRm8aEaeg9vFSo2QdYNEh-VsxGpllBDiz04gJuO9VYpwsmZKgkyF/s1600/%255Bwww.gj37765.blogspot.com%255Dgoogle_plus_right.png">
            <div style="float:left;margin:10px 10px 10px 0;"><g:plusone size="tall" expr:href="data:post.url"></g:plusone></div>
    </div>
</div>
<div id="on">
    <div id="feedburner_right" style=" top: 69%;">
        <div id="knfeedburner_div">
<center>
<h4 style="color:#F66303;">You can also receive Free Email Updates:</h4> 
            <form action="http://feedburner.google.com/fb/a/mailverify" method="post" target="popupwindow" onsubmit="window.open('http://feedburner.google.com/fb/a/mailverify?uri=thewallofwierd', 'popupwindow', 'scrollbars=yes,width=550,height=520');return true"><input gtbfieldid="10" class="enteryouremail" name="email" value="Enter your email here..." onblur="if (this.value == &#39;&#39;) {this.value = &#39;Enter your email here...&#39;;}" onfocus="if (this.value == &#39;Enter your email here...&#39;) {this.value = &#39;&#39;;}" type="text" /><input value="thewallofwierd" name="uri" type="hidden" /><input value="Submit" class="submitbutton" type="submit" /></form></center>


            <img id="feedburner_right_img" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgeP6yx_MJ4hP6dWEFigbQJz6WAaQSA6FMjPKlIvQwPiH0oReTVxRisYSxfGIG-OWnMSwkIxCB1ytP58X16K2wyWJDzogw9FiCwuPSrZN66gUjlvZcezOeaAxK9S5npGh5dOxHSNmkbyb_m/s1600/%255Bwww.gj37765.blogspot.com%255Dfeedburner_right.png">

        </div>
    </div>
</div>

Replace In Above Code
1. thewallofweird With Your Facebook User name
2. lthewallofweird With Your Twitter User name
3  thewallofweird  With Your Feed Title

IF ITS WORKING SO COMMNET ITS WORK IN BLOG