PreToPro Blogger: Social Buttons | Turning PreBloggers Into ProBloggers.

How To Add Cool Social Sharing Widget with hover Effect?

Kaushal Srivastava 2 Blog Gadgets, Blog Widgets, Floating Gadget, Floating Widget, PreToPro Blogger, Social Buttons, Social Widgets 04:26

<div dir="ltr" style="text-align: left;" trbidi="on">
<br />
<div class="separator" style="clear: both; text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEigxkM1-AhZii01YKazzVuN3vl_MBZOyBMuFgboR3nZH5pVZXqlXnIoSR1c57eDf0CVKAGmGpx-rsZldIKSjU3ln_Ba2-5EAoBsWiNoEKJuRz82cJWYkVr1b7d7Yg-ASK06QNBo8mQzcC4j/s1600/floating+social+bar+top.JPG" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" height="320" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEigxkM1-AhZii01YKazzVuN3vl_MBZOyBMuFgboR3nZH5pVZXqlXnIoSR1c57eDf0CVKAGmGpx-rsZldIKSjU3ln_Ba2-5EAoBsWiNoEKJuRz82cJWYkVr1b7d7Yg-ASK06QNBo8mQzcC4j/s320/floating+social+bar+top.JPG" width="278" /></a></div>
<br />
<br />
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjeQsz5N9D6MPYJSM3bfuBw-Ii7xNEptcbpyDpCh4l20LG4u9lqy5Q7WgGwNSDx7GB2kPx8wWBic2Zrwu6fyMlhR8DWVwfEU7DUXPwx4BnRfuA5U90il1bcubofC10hKnwGdRslcHqLScBH/s1600/floating+social+bar.JPG" imageanchor="1" style="clear: right; float: right; margin-bottom: 1em; margin-left: 1em;"><img border="0" height="320" padding="10" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjeQsz5N9D6MPYJSM3bfuBw-Ii7xNEptcbpyDpCh4l20LG4u9lqy5Q7WgGwNSDx7GB2kPx8wWBic2Zrwu6fyMlhR8DWVwfEU7DUXPwx4BnRfuA5U90il1bcubofC10hKnwGdRslcHqLScBH/s320/floating+social+bar.JPG" width="62" /></a>Today I am going to show you how to add a cool Social sharing widget with a nice hover effect (See the figure at the right) in your blogger blog. Social sharing widget is really important for any blog as it helps a blog to be socially active thus bringing you high traffic to your blog. This widget is very clean, sleek and has cool hover effect. It is well-coded and uses simple CSS and javascript coding and will also not slow your blog loading speed (<b>Recommended</b> : <a href="http://pretoproblogger.blogspot.com/2013/08/10-tips-to-increase-your-blog-loading.html" target="_blank">10 Tips To Increase your Blog loading speed.</a>)<br />
<div class="post-body entry-content" id="post-body-7556505276072292084" itemprop="description articleBody" style="color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 12px; line-height: 1.6em; margin: 0px 0px 0.75em;">
</div>
It Contains five social buttons:<br />
<ul style="text-align: left;">
<li>Twitter</li>
</ul>
<ul style="text-align: left;">
<li>Google+</li>
</ul>
<ul style="text-align: left;">
<li>Facebook</li>
</ul>
<ul style="text-align: left;">
<li>Rss</li>
</ul>
<ul style="text-align: left;">
<li>Pinterest</li>
</ul>
<br />
For adding this widget just follow the simple steps given below-<br />
<br />
<b>Recommended</b> :<br />
<br />
<ul style="text-align: left;">
<li><a href="http://pretoproblogger.blogspot.com/2013/07/how-to-add-best-floating-social-media.html" target="_blank">How to add the best floating social media buttons gadget in blogger (3 Designs To Choose)</a></li>
<li><a href="http://pretoproblogger.blogspot.com/2013/10/how-to-add-floating-navigation-bar-in.html" target="_blank">How to add a floating navigation bar in blogger blog?</a></li>
</ul>
<br />
<div>
<h3>
<span style="font-family: inherit;">How To Add this </span>Social Sharing Widget <span style="font-family: inherit;">:</span></h3>
</div>
<div>
<span style="font-family: inherit;"><br /></span></div>
<div>
<ul style="line-height: 1.4; margin: 0.5em 0px; padding: 0px 2.5em;">
<li style="margin: 0px 0px 0.25em; padding: 0px;"><span style="font-family: inherit;">Go to your <b>blogger dashboard</b></span></li>
<li style="margin: 0px 0px 0.25em; padding: 0px;"><span style="font-family: inherit;">Select your blogger blog</span></li>
<li style="margin: 0px 0px 0.25em; padding: 0px;"><span style="font-family: inherit;">Click on <b>Layout </b>from Drop Down menu (shown in picture)</span></li>
</ul>
<div class="separator" style="clear: both; text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhhFC00yUiEneD6AjI38US0XzgRdNNkTHwtoqTm9JAIePU5WoBPQ15Tbz9E1zq7eJgaqmu9nmXkP5hZ-elIzdQu-_aArare_n3GyD-Zb0rm7bk-L5MzwqzO_sXvn1rJIxJZDQ3IOQGf0QE/s900/1.jpg" imageanchor="1" style="color: #6a6a6a; margin-left: 1em; margin-right: 1em; text-decoration: none;"><span style="font-family: inherit;"><img border="1" height="221" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhhFC00yUiEneD6AjI38US0XzgRdNNkTHwtoqTm9JAIePU5WoBPQ15Tbz9E1zq7eJgaqmu9nmXkP5hZ-elIzdQu-_aArare_n3GyD-Zb0rm7bk-L5MzwqzO_sXvn1rJIxJZDQ3IOQGf0QE/s900/1.jpg" style="-webkit-box-shadow: rgba(0, 0, 0, 0.0980392) 1px 1px 5px; background-color: white; border: 1px solid rgb(230, 230, 230); box-shadow: rgba(0, 0, 0, 0.0980392) 1px 1px 5px; padding: 1px; position: relative;" width="400" /></span></a></div>
<div class="separator" style="clear: both; text-align: center;">
</div>
<div>
<span style="font-family: inherit;"><br /></span>
<br />
<ul style="line-height: 1.4; margin: 0.5em 0px; padding: 0px 2.5em;">
<li style="margin: 0px 0px 0.25em; padding: 0px;"><span style="font-family: inherit;">A new Window appear</span></li>
<li style="margin: 0px 0px 0.25em; padding: 0px;"><span style="font-family: inherit;">Click on <b>Add gadget</b></span></li>
<li style="margin: 0px 0px 0.25em; padding: 0px;"><span style="font-family: inherit;">And select <b>HTML/JavaScript</b></span></li>
<li style="margin: 0px 0px 0.25em; padding: 0px;"><span style="font-family: inherit;">Next Box of HTML/JavaScript will appear <b>(shown in picture)</b></span></li>
</ul>
</div>
<div style="text-align: center;">
<span style="font-family: inherit;"><b style="background-color: white; font-size: 13px; line-height: 18px;">    </b></span><br />
<div class="separator" style="background-color: white; clear: both; font-size: 13px; line-height: 18px;">
<b><a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhGAMOxnn2e2idyVYMtV5VFR0V8y4gRM4WvXfjh-Uj4RTeahMfv0NZ4KMtnTL0hgUsBSHtjW0v96bm52gxxVuAlZLOH4mSyV4liN99iqDL0EEBjA-ISYSmmMoHMEa9y-xUOmQ5ADyld1wk/s900/2.png" imageanchor="1" style="color: #6a6a6a; margin-left: 1em; margin-right: 1em; text-decoration: none;"><span style="font-family: inherit;"><img border="1" height="221" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhGAMOxnn2e2idyVYMtV5VFR0V8y4gRM4WvXfjh-Uj4RTeahMfv0NZ4KMtnTL0hgUsBSHtjW0v96bm52gxxVuAlZLOH4mSyV4liN99iqDL0EEBjA-ISYSmmMoHMEa9y-xUOmQ5ADyld1wk/s900/2.png" style="-webkit-box-shadow: rgba(0, 0, 0, 0.0980392) 1px 1px 5px; border: 1px solid rgb(230, 230, 230); box-shadow: rgba(0, 0, 0, 0.0980392) 1px 1px 5px; padding: 1px; position: relative;" width="400" /></span></a></b></div>
<span style="font-family: inherit;"><b style="background-color: white; font-size: 13px; line-height: 18px;"></b><span style="background-color: white; font-size: 13px; line-height: 18px;"></span><br style="background-color: white; font-size: 13px; line-height: 18px;" /></span>
<br />
<div style="background-color: white; font-size: 13px; line-height: 18px; text-align: left;">
<ul style="line-height: 1.4; margin: 0.5em 0px; padding: 0px 2.5em;">
<li style="margin: 0px 0px 0.25em; padding: 0px;"><span style="font-family: inherit;">Now the box of HTML/JavaScript will appear when you click on the box.</span></li>
</ul>
</div>
<div class="separator" style="background-color: white; clear: both; font-size: 13px; line-height: 18px;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjuUdV6YIWJL_6zaX7XjWBObPleQyH90jbXnEyWlI1cx-p71AHEPFFTP_HHljNXTZsdowc_jZVihijglqjUzCgfqwCt7ENToRb94VpaD7pBmHPYYdY1epu_Cw5TmOh7S2SVcGqujzXNRB0/s900/5.png" imageanchor="1" style="color: #6a6a6a; margin-left: 1em; margin-right: 1em; text-decoration: none;"><span style="font-family: inherit;"><img border="1" height="221" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjuUdV6YIWJL_6zaX7XjWBObPleQyH90jbXnEyWlI1cx-p71AHEPFFTP_HHljNXTZsdowc_jZVihijglqjUzCgfqwCt7ENToRb94VpaD7pBmHPYYdY1epu_Cw5TmOh7S2SVcGqujzXNRB0/s900/5.png" style="-webkit-box-shadow: rgba(0, 0, 0, 0.0980392) 1px 1px 5px; border: 1px solid rgb(230, 230, 230); box-shadow: rgba(0, 0, 0, 0.0980392) 1px 1px 5px; padding: 1px; position: relative;" width="400" /></span></a></div>
<div style="text-align: left;">
<ul style="background-color: white; font-size: 13px; line-height: 1.4; margin: 0.5em 0px; padding: 0px 2.5em;">
<li style="margin: 0px 0px 0.25em; padding: 0px;"><span style="font-family: inherit;">Now <b>paste the following code to install the gadget</b> to your blog.</span></li>
</ul>
<div style="background-color: white;">
<span style="font-size: x-small;"><span style="line-height: 18px;"><br /></span></span></div>
<div style="background-color: white; font-size: 13px; line-height: 18px;">
<span style="font-family: inherit;"><br /></span></div>
<div>
<blockquote class="tr_bq" style="font-size: 13px; line-height: 18px;">
<blockquote>
<span style="background-color: white;"><style type="text/css"></span><br />
<span style="background-color: white;">ul#social {</span><br />
<span style="background-color: white;">    position: fixed;</span><br />
<span style="background-color: white;">    margin: 0px;</span><br />
<span style="background-color: white;">    padding: 0px;</span><br />
<span style="background-color: white;">    top: 10px;</span><br />
<span style="background-color: white;">    left: 0px;</span><br />
<span style="background-color: white;">    list-style: none;</span><br />
<span style="background-color: white;">    z-index:9999;</span><br />
<span style="background-color: white;">}</span><br />
<span style="background-color: white;">ul#social li {</span><br />
<span style="background-color: white;">    width: 100px;</span><br />
<span style="background-color: white;">}</span><br />
<span style="background-color: white;">ul#social li a {</span><br />
<span style="background-color: white;">    display: block;</span><br />
<span style="background-color: white;">    margin-left: -2px;</span><br />
<span style="background-color: white;">    width: 100px;</span><br />
<span style="background-color: white;">    height: 70px;</span><br />
<span style="background-color: white;">    background-color:#fff;</span><br />
<span style="background-color: white;">    background-repeat:no-repeat;</span><br />
<span style="background-color: white;">    background-position:center center;</span><br />
<span style="background-color: white;">    border:1px solid #AFAFAF;</span><br />
<span style="background-color: white;">    -moz-border-radius:0px 10px 10px 0px;</span><br />
<span style="background-color: white;">    -webkit-border-bottom-right-radius: 10px;</span><br />
<span style="background-color: white;">    -webkit-border-top-right-radius: 10px;</span><br />
<span style="background-color: white;">    -khtml-border-bottom-right-radius: 10px;</span><br />
<span style="background-color: white;">    -khtml-border-top-right-radius: 10px;</span><br />
<span style="background-color: white;">    -moz-box-shadow: 0px 4px 3px #000;</span><br />
<span style="background-color: white;">    -webkit-box-shadow: 0px 4px 3px #000;</span><br />
<span style="background-color: white;">}</span><br />
<span style="background-color: white;">ul#social .twitter a{</span><br />
<span style="background-color: white;">     background:#0F96C6 url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjg3LfXgl6ZjCj9Qy1-xa18z5gVVppTNBomcxZbOBQYhZ-9gQ0qyVSmSI9Jld7eoKgrTG5af5hOwB6Mn3yfpZsCIwq87Kq88uD75VGJwchCYss9-FrisdoAA4Ee0zYcrhau_9sBp4BA0Rk/s1600/Twitter.png)no-repeat;</span><br />
<span style="background-color: white;">background-position:center center;</span><br />
<span style="background-color: white;">}</span><br />
<span style="background-color: white;">ul#social .googleplus a      {</span><br />
<span style="background-color: white;">    background:#D73D27 url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgMh_4ZBofpG_IU7WIx0MWd4Hu1MqSdUh0rU-cvsorHnaBKjkehp_6jZGaQvGPBzkIxA6wtlC__80WadJYNt_F6mUD80Wum6pnP71QI_H-GkO2U94J4_VKCCVvEWT0Xf3ixXMI89c2J3OQ/s1600/GOOGLE+PLus.png)no-repeat;</span><br />
<span style="background-color: white;">background-position:center center;</span><br />
<span style="background-color: white;">}</span><br />
<span style="background-color: white;">ul#social .facebook a      {</span><br />
<span style="background-color: white;">    background:#1A4B97 url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEj9jKVu979veqCYDoY_63q-N4wHkZpomddlqZV3B_N5kISo-BtU4wV4eQh4BjxYa_hEdwjJXv-i6W0l4ry7vzo2I23MHxXu8_Y0eA9s449n1vM4Uk0XDNSQxtWqdTE1s8wANb0XNlzr8WI/s1600/Facebook.png)no-repeat;</span><br />
<span style="background-color: white;">background-position:center center;</span><br />
<span style="background-color: white;">}</span><br />
<span style="background-color: white;">ul#social .rss a      {</span><br />
<span style="background-color: white;">    background:#FAAE17 url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhsku2BlsiS-iPM1gF5TNACPsjWiLqFUKK_KDpFOCDBcTH9HbgPNE_w9I31R7WpEHHw0IIzlbGwvnnZhSZCXaC36a5vVtT_RPfwVFf9iWKh4d9anOB4JoihpQdrEXmI1OFM9T4V2oNnjQU/s1600/rss.png)no-repeat;</span><br />
<span style="background-color: white;">background-position:center center;</span><br />
<span style="background-color: white;">}</span><br />
<span style="background-color: white;">ul#social .pinterest a   {</span><br />
<span style="background-color: white;">    background:#963336 url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiyEq3fRFBgVZYNcBEhGrAMfma-rRPeFBXIV4Ki1_cQLJuJbhiGDQ244av-46_XeGBQnxdzZguuMoza84WienSUIqeABlCaQe0rA57uc7iV2zjQ9ZlDBIM-ibCYsisgLFHl7Sd2MEj94pg/s1600/Pinterest.png)no-repeat;</span><br />
<span style="background-color: white;">background-position:center center;</span><br />
<span style="background-color: white;">}</span><br />
<span style="background-color: white;"></style></span><br />
<code style="color: #333333; font-family: 'Courier New', monospace; margin: 0px; padding: 0px;"><span style="background-color: #ffd966;"><script src="http://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script></span></code><span style="background-color: white;"><script type='text/javascript'></span><br />
<span style="background-color: white;">$(function () {</span><br />
<span style="background-color: white;">    $('#social a').stop().animate({</span><br />
<span style="background-color: white;">        'marginLeft': '-85px'</span><br />
<span style="background-color: white;">    }, 1000);</span><br />
<span style="background-color: white;">    $('#social > li').hover(</span><br />
<span style="background-color: white;">        function () {</span><br />
<span style="background-color: white;">            $('a', $(this)).stop().animate({</span><br />
<span style="background-color: white;">                'marginLeft': '-2px'</span><br />
<span style="background-color: white;">            }, 200);</span><br />
<span style="background-color: white;">        },</span><br />
<span style="background-color: white;">        function () {</span><br />
<span style="background-color: white;">            $('a', $(this)).stop().animate({</span><br />
<span style="background-color: white;">                'marginLeft': '-85px'</span><br />
<span style="background-color: white;">            }, 200);</span><br />
<span style="background-color: white;">        }</span><br />
<span style="background-color: white;">    );</span><br />
<span style="background-color: white;">});</span><br />
<span style="background-color: white;"></script></span><br />
<span style="background-color: white;"><ul id='social'></span><br />
<span style="background-color: white;"> <li class='twitter'><a href='</span><span style="background-color: #e1704b; margin: 0px; padding: 0px;">#</span><span style="background-color: white;">' title='Twitter'></a></li></span><br />
<span style="background-color: white;"> <li class='googleplus'><a href='</span><span style="background-color: #e1704b; margin: 0px; padding: 0px;">#</span><span style="background-color: white;">' title='Google Plus'></a></li></span><br />
<span style="background-color: white;"> <li class='facebook'><a href='</span><span style="background-color: #e1704b; margin: 0px; padding: 0px;">#</span><span style="background-color: white;">' title='Facebook'></a></li></span><br />
<span style="background-color: white;"> <li class='rss'><a href='</span><span style="background-color: #e1704b; margin: 0px; padding: 0px;">#</span><span style="background-color: white;">' title='Rss'></a></li></span><br />
<span style="background-color: white;"> <li class='pinterest'><a href='</span><span style="background-color: #e1704b; margin: 0px; padding: 0px;">#</span><span style="background-color: white;">' title='Pinterest'></a></li></span><br />
<span style="background-color: white;"></ul></span></blockquote>
</blockquote>
<div style="background-color: white; font-size: 13px; line-height: 18px;">
<br /></div>
<div style="font-size: 13px; line-height: 18px;">
<span style="background-color: white;">Now you are almost done, just replace the Highlighted  </span><span style="background-color: #e1704b;">#</span><span style="background-color: white;">  with your social handles. Also if you have jquery plugin already in your blog template, delete the code highlighted in yellow (</span><span style="background-color: #ffd966; color: #333333; font-family: 'Courier New', monospace;"><script src="http://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script></span><span style="background-color: white;">) . </span></div>
<div style="font-size: 13px; line-height: 18px;">
<span style="background-color: white;"><br /></span></div>
You are done. Now Just Save Your changes.</div>
<div>
<br /></div>
<div>
<i>Having problems? Feel free to ask to me through comments section.</i></div>
</div>
</div>
</div>
</div>

How To Add Cool Social Sharing Widget with hover Effect?

Today I am going to show you how to add a cool Social sharing widget with a nice hover effect (See the figure at the right) in your bl...

All in one subscription widget for bloggers

Kaushal Srivastava 2 Best Gadgets, Blog Gadgets, Blog Widgets, PreToPro Blogger, Social Buttons 23:13

<div dir="ltr" style="text-align: left;" trbidi="on">
<div class="separator" style="clear: both; text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEggzcAXWUg4tEjXyJyUgQ9MX8ZmRUh4kkpO-bRm0tQruBqY-7TyGH6TRhQqrUpH6SevZJ7HTmdL0XGKa3f_kmE_obDPSpZ8yKsc9oGvOYzVaB43o6ErypQs06lJrv0pTfKOTD1tCzrir3vI/s1600/all-in-one-subscription-box-for-blogger.png" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" height="320" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEggzcAXWUg4tEjXyJyUgQ9MX8ZmRUh4kkpO-bRm0tQruBqY-7TyGH6TRhQqrUpH6SevZJ7HTmdL0XGKa3f_kmE_obDPSpZ8yKsc9oGvOYzVaB43o6ErypQs06lJrv0pTfKOTD1tCzrir3vI/s320/all-in-one-subscription-box-for-blogger.png" width="305" /></a></div>
<i><br /></i>
<i>Hey guys today I going to share all in one subscription box for blogger. I myself have added it in this blog. Every blogger knows that a subscription box is important as helps the visitors to stay connected to your blog. If you create a new post on your blog the visitor who have subscribed will get an email that your blog has new content and then the visitor will visit if he/she is interested. Thus it also increases your visits and makes your visitor a<a href="http://pretoproblogger.blogspot.in/2013/07/increasing-your-blog-readers.html" target="_blank"> reader of your blog.</a> And so blogger must add convincing content and subscription box so that visitors might end up subscribing your blog. And if the subscription box will have a little bit social touch it will be much better. Rather than adding social buttons and subscription box as different widgets we can add a Hybrid subscription box. Here is a good subscription box by <a href="http://windroidclub.com/" rel="nofollow" target="_blank">windroid club</a>:</i><br />
<br />
<div class="separator" style="clear: both; text-align: center;">
<br /></div>
<div class="separator" style="clear: both; text-align: center;">
<br /></div>
<h3 style="text-align: left;">
Steps to add this widget:</h3>
<div>
<br /></div>
<div>
<ul style="background-color: white; box-sizing: border-box; color: #333333; line-height: 1.4; margin: 0.5em 0px; padding: 0px 2.5em;">
<li style="box-sizing: border-box; margin: 0px 0px 0.25em; padding: 0px;"><span style="box-sizing: border-box;"><span style="font-family: inherit;">Go to your <b style="box-sizing: border-box;">blogger dashboard</b></span></span></li>
</ul>
<ul style="background-color: white; box-sizing: border-box; color: #333333; line-height: 1.4; margin: 0.5em 0px; padding: 0px 2.5em;">
<li style="box-sizing: border-box; margin: 0px 0px 0.25em; padding: 0px;"><span style="box-sizing: border-box;">Select your blogger blog</span></li>
</ul>
<ul style="background-color: white; box-sizing: border-box; color: #333333; line-height: 1.4; margin: 0.5em 0px; padding: 0px 2.5em;">
<li style="box-sizing: border-box; margin: 0px 0px 0.25em; padding: 0px;"><span style="box-sizing: border-box;">Click on <b style="box-sizing: border-box;">Layout </b>from Drop Down menu (<b>shown in picture</b>)</span></li>
</ul>
<div>
<br /></div>
<div style="-webkit-transition: all 0.4s ease-in-out; box-sizing: border-box; color: #6a6a6a; margin-left: 1em; margin-right: 1em; text-align: center; text-decoration: none; transition: all 0.4s ease-in-out;">
<div style="text-align: center;">
<a class="pirobox" data-pirobox="gallery" href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhhFC00yUiEneD6AjI38US0XzgRdNNkTHwtoqTm9JAIePU5WoBPQ15Tbz9E1zq7eJgaqmu9nmXkP5hZ-elIzdQu-_aArare_n3GyD-Zb0rm7bk-L5MzwqzO_sXvn1rJIxJZDQ3IOQGf0QE/s900/1.jpg" imageanchor="1" style="-webkit-transition: all 0.4s ease-in-out; box-sizing: border-box; color: #6a6a6a; margin-left: 1em; margin-right: 1em; text-decoration: none; transition: all 0.4s ease-in-out;"><span style="box-sizing: border-box;"><img border="1" height="221" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhhFC00yUiEneD6AjI38US0XzgRdNNkTHwtoqTm9JAIePU5WoBPQ15Tbz9E1zq7eJgaqmu9nmXkP5hZ-elIzdQu-_aArare_n3GyD-Zb0rm7bk-L5MzwqzO_sXvn1rJIxJZDQ3IOQGf0QE/s900/1.jpg" style="-webkit-box-shadow: rgba(0, 0, 0, 0.0980392) 1px 1px 5px; -webkit-transition: all 0.4s ease-in-out; border: 1px solid rgb(230, 230, 230); box-shadow: rgba(0, 0, 0, 0.0980392) 1px 1px 5px; box-sizing: border-box; height: auto; max-width: 100%; padding: 1px; position: relative; transition: all 0.4s ease-in-out;" width="400" /></span></a></div>
</div>
<span style="font-family: inherit;"><br style="box-sizing: border-box;" /></span>
<ul style="box-sizing: border-box; line-height: 1.4; margin: 0.5em 0px; padding: 0px 2.5em;">
<li style="box-sizing: border-box; margin: 0px 0px 0.25em; padding: 0px;"><span style="box-sizing: border-box;">A new Window appear</span></li>
</ul>
<ul style="box-sizing: border-box; line-height: 1.4; margin: 0.5em 0px; padding: 0px 2.5em;">
<li style="box-sizing: border-box; margin: 0px 0px 0.25em; padding: 0px;"><span style="box-sizing: border-box;"><span style="font-family: inherit;">Click on <b style="box-sizing: border-box;">Add gadget</b></span></span></li>
</ul>
<ul style="box-sizing: border-box; line-height: 1.4; margin: 0.5em 0px; padding: 0px 2.5em;">
<li style="box-sizing: border-box; margin: 0px 0px 0.25em; padding: 0px;"><span style="box-sizing: border-box;"><span style="font-family: inherit;">And select <b style="box-sizing: border-box;">HTML/JavaScript</b></span></span></li>
</ul>
<ul style="box-sizing: border-box; line-height: 1.4; margin: 0.5em 0px; padding: 0px 2.5em;">
<li style="box-sizing: border-box; margin: 0px 0px 0.25em; padding: 0px;"><span style="box-sizing: border-box;"><span style="font-family: inherit;">Next Box of HTML/JavaScript will appear <b style="box-sizing: border-box;">(shown in picture)</b></span></span></li>
</ul>
<span style="font-family: inherit;"><span style="box-sizing: border-box;"><b style="box-sizing: border-box; line-height: 18px;">   </b></span></span><br />
<div style="text-align: center;">
<span style="font-family: inherit;"><span style="box-sizing: border-box;"><b style="box-sizing: border-box; line-height: 18px;"><b style="box-sizing: border-box;"><a class="pirobox" data-pirobox="gallery" href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhGAMOxnn2e2idyVYMtV5VFR0V8y4gRM4WvXfjh-Uj4RTeahMfv0NZ4KMtnTL0hgUsBSHtjW0v96bm52gxxVuAlZLOH4mSyV4liN99iqDL0EEBjA-ISYSmmMoHMEa9y-xUOmQ5ADyld1wk/s900/2.png" imageanchor="1" style="-webkit-transition: all 0.4s ease-in-out; box-sizing: border-box; color: #6a6a6a; margin-left: 1em; margin-right: 1em; text-decoration: none; transition: all 0.4s ease-in-out;"><span style="box-sizing: border-box;"><img alt="http://pretoproblogger.blogspot.com" border="1" height="221" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhGAMOxnn2e2idyVYMtV5VFR0V8y4gRM4WvXfjh-Uj4RTeahMfv0NZ4KMtnTL0hgUsBSHtjW0v96bm52gxxVuAlZLOH4mSyV4liN99iqDL0EEBjA-ISYSmmMoHMEa9y-xUOmQ5ADyld1wk/s900/2.png" style="-webkit-box-shadow: rgba(0, 0, 0, 0.0980392) 1px 1px 5px; -webkit-transition: all 0.4s ease-in-out; border: 1px solid rgb(230, 230, 230); box-shadow: rgba(0, 0, 0, 0.0980392) 1px 1px 5px; box-sizing: border-box; height: auto; max-width: 100%; padding: 1px; position: relative; transition: all 0.4s ease-in-out;" title="http://pretoproblogger.blogspot.com" width="400" /></span></a></b></b></span></span></div>
<span style="font-family: inherit;"><b style="box-sizing: border-box; line-height: 18px;"></b></span><span style="font-family: inherit;"><br style="box-sizing: border-box;" /></span>
<ul style="box-sizing: border-box; line-height: 1.4; margin: 0.5em 0px; padding: 0px 2.5em;">
<li style="box-sizing: border-box; margin: 0px 0px 0.25em; padding: 0px;"><span style="box-sizing: border-box;">Now the box of HTML/JavaScript will appear when you click on the box.</span></li>
</ul>
<div>
<br /></div>
<div style="-webkit-transition: all 0.4s ease-in-out; box-sizing: border-box; color: #6a6a6a; margin-left: 1em; margin-right: 1em; text-align: center; text-decoration: none; transition: all 0.4s ease-in-out;">
<div style="text-align: center;">
<a class="pirobox" data-pirobox="gallery" href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjuUdV6YIWJL_6zaX7XjWBObPleQyH90jbXnEyWlI1cx-p71AHEPFFTP_HHljNXTZsdowc_jZVihijglqjUzCgfqwCt7ENToRb94VpaD7pBmHPYYdY1epu_Cw5TmOh7S2SVcGqujzXNRB0/s900/5.png" imageanchor="1" style="-webkit-transition: all 0.4s ease-in-out; box-sizing: border-box; color: #6a6a6a; margin-left: 1em; margin-right: 1em; text-decoration: none; transition: all 0.4s ease-in-out;"><span style="box-sizing: border-box;"><img alt="http://pretoproblogger.blogspot.com" border="1" height="221" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjuUdV6YIWJL_6zaX7XjWBObPleQyH90jbXnEyWlI1cx-p71AHEPFFTP_HHljNXTZsdowc_jZVihijglqjUzCgfqwCt7ENToRb94VpaD7pBmHPYYdY1epu_Cw5TmOh7S2SVcGqujzXNRB0/s900/5.png" style="-webkit-box-shadow: rgba(0, 0, 0, 0.0980392) 1px 1px 5px; -webkit-transition: all 0.4s ease-in-out; border: 1px solid rgb(230, 230, 230); box-shadow: rgba(0, 0, 0, 0.0980392) 1px 1px 5px; box-sizing: border-box; height: auto; max-width: 100%; padding: 1px; position: relative; transition: all 0.4s ease-in-out;" title="http://pretoproblogger.blogspot.com" width="400" /></span></a></div>
</div>
<ul style="box-sizing: border-box; line-height: 1.4; margin: 0.5em 0px; padding: 0px 2.5em;">
<li style="box-sizing: border-box; margin: 0px 0px 0.25em; padding: 0px;"><span style="box-sizing: border-box;">Now <b style="box-sizing: border-box;">paste the following code to add the All in one subscription widget</b> on your blog.</span></li>
</ul>
<blockquote class="tr_bq">
<style type="text/css"><br /> #wcsub-box<br />{<br />box-shadow:1px 1px 4px  #dcdcdc;<br />-moz-box-box-shadow:1px 1px 4px  #dcdcdc;<br />-web-kit-box-shadow:1px 1px 4px  #dcdcdc;<br />-goog-ms-box-shadow:1px 1px 4px  #dcdcdc;<br />margin-bottom:70px;<br />height:264px;<br />}<br />#wc-socico<br />{<br />height:33px;<br />border-bottom:1px solid #dcdcdc;<br />border-left:1px solid #dcdcdc;<br />border-right:1px solid #dcdcdc;<br />padding:2px;<br />background:#ffffff;<br />}<br />#wc-socicoimg<br />{<br />height:28px;<br />width:28px;<br />}<br />#wc-socico table<br />{<br />border:none;<br />}<br />#wc-rscount<br />{<br />margin-top:2px;<br />margin-right:-25px;<br />}<br /><br />#wcsub-box .wcsub-fblike { border-bottom: 1px solid #dcdcdc; border-left: 1px solid #dcdcdc; border-right: 1px solid #dcdcdc; padding: 5px; background:#fff;}<br />    #wcsub-box .wcsub-email {border: 1px solid #dcdcdc; background: #f8f8f8; padding:11px;}<br />        #wcsub-box .wcsub-email h4{color: #444;font-family: Arial;font-size: 12px; margin: 0 0 10px;}<br />        #wcsub-box .wcsub-email .txt,#wcsub-box .wcsub-email .txt:focus{background:#fff; float:left; color:#777777; border:1px solid #dcdcdc; border-radius: 3px; padding: 7px 10px 8px; width: 140px;}<br />        #wcsub-box .wcsub-email .wcsub-button,#wcsub-box .wcsub-email .wcsub-button:focus{background:#222222; border:1px solid #222222; color:#fff; border-radius: 3px; float: right; font-size: 12px; font-weight: bold; padding:7px 3px; }<br />            #wcsub-box .wcsub-email<br /> input, textarea {<br />font-family: Georgia, "Times New Roman", Times; font-size: 1em;}<br /></style><br /><br /><div id="wcsub-box"><br /><div class="wcsub-email"><br /><h4>Get FREE updates on your <a href="http://feedburner.google.com/fb/a/mailverify?uri=<span style="color: red;">pretoproblogger</span>" target="_blank" style="color:#3b5998;">Email</a> | <a href="http://feeds.feedburner.com/<span style="color: red;">pretoproblogger</span>" target="_blank" style="color:orange;">RSS</a></h4><br /><form onsubmit="window.open('http://feedburner.google.com/fb/a/mailverify?uri=<span style="color: red;">pretoproblogger</span>', 'popupwindow',<br /> 'scrollbars=yes,width=700px,height=700px');return true" target="popupwindow" method="post" action="http://feedburner.google.com/fb/a/mailverify"><br /><input name="email" onblur="if (this.value == '') {this.value = 'Enter your email address';}" onfocus="if (this.value == 'Enter your email address')<br />{this.value = '';}" value="Enter your email address" class="txt" /><br /><input type="hidden" name="uri" value="<span style="color: red;">Pretoproblogger</span>" /><br /><input type="hidden" value="en_US" name="loc" /><br /><input type="submit" value="Subscribe" class="wcsub-button" /><br /><div style="clear:both;"></div><br /></form><br />    </div><br /><br /><br /><br /><div id="wc-socico"><br /><table border="0" cellspacing="0" cellpadding="0" width="298"><br /><tbody><br /><tr><br /><td valign="top" ><a href='http://feeds.feedburner.com/<span style="color: red;">pretoproblogger</span>' target='_blank' rel=nofollow' ><img id="wc-socicoimg" src="http://3.bp.blogspot.com/-KjMedajdI2w/UTtUCEg5_zI/AAAAAAAABcQ/K3qUhvOTNrA/s1600/feed.png" alt="Subcribe to our RSS feeds" /></a></td><br /><br /><td valign="top" ><a href='http://www.facebook.com/<span style="color: red;">Pretoproblogger</span>' target='_blank' rel='nofollow'><img id="wc-socicoimg" src="http://2.bp.blogspot.com/-7_3aMhrvLq4/UTtUB9H5ZyI/AAAAAAAABcM/JjZGcP7r3_I/s1600/fbb.png" alt="Join Us on Facebook" /></a></td><br /><br /><td valign="top" ><a href='<span style="color: red;">https://plus.google.com/102731179322289098765</span>' target='_blank' rel='nofollow'><img src="http://4.bp.blogspot.com/-vnYX9pKHZCU/UTtUCWa3-HI/AAAAAAAABcU/Xi7l4YF136U/s1600/gpp.png" alt="Add to Circles" id="wc-socicoimg" /></a></td><br /><br /><td valign="top" ><a href='https://twitter.com/<span style="color: red;">pretoproblogger</span>' target='_blank' rel='nofollow'><img id="wc-socicoimg" src="http://2.bp.blogspot.com/-VXfOkCT43uI/UTtUEItlzyI/AAAAAAAABck/cvROEjW1Vx8/s1600/tww.png" alt="Follow us on Twitter" /></a></td><br /><br /><td valign="top" ><p id="wc-rscount"><a href="http://feeds.feedburner.com/<span style="color: red;">PretoproBlogger</span>"><img src="http://feeds.feedburner.com/~fc/<span style="color: red;">PretoproBlogger</span>?bg=000000&amp;fg=ffffff&amp;anim=1" height="26" width="88" style="border:0" alt="" /></a></p></td><br /></tr></tbody></table><br /></div><br /><br /><br /><br /><div class="wcsub-fblike"><br /><iframe src="//www.facebook.com/plugins/like.php? href=https://www.facebook.com/<span style="color: red;">Pretoproblogger</span>?fref=ts &send=false&layout=button_count&width=80&show_faces=false&action=like&colorscheme=light&font&height=21" scrolling="no" frameborder="0" style="border:none; overflow:hidden; width:80px; height:21px;" allowtransparency="true"></iframe><a href=" https://www.facebook.com/<span style="color: red;">Pretoproblogger</span>" target="_blank" rel="nofollow" style="color: #3B5998; font-family: arial; font-size: 16px; font-weight: bold; line-height: 20px;"> Like us on Facebook </a><div class="clear"></div><br />    </div><br /><br /><br /><br /> <a href="https://twitter.com/<span style="color: red;">pretoproblogger</span>" class="twitter-follow-button" data-show-count="true" data-lang="en-gb">Follow <span style="color: red;">@PreToProBlogger</span></a><br /><script>!function(d,s,id){var js,fjs=d.getElementsByTagName(s)[0],p=/^http:/.test(d.location)?'http':'https';if(!d.getElementById(id)){js=d.createElement(s);js.id=id;js.src=p+'://platform.twitter.com/widgets.js';fjs.parentNode.insertBefore(js,fjs);}}(document, 'script', 'twitter-wjs');</script><br /><br /><br /><br /><div class="wcgplus"><br />    <div class="g-plus" data-href="<span style="color: red;">https://plus.google.com/102731179322289098765</span>" data-width="290" data-height="131" data-theme="light"></div><br /></div><br />    </div></blockquote>
<div>
</div>
</div>
<div class="separator" style="clear: both; text-align: left;">
<br /></div>
<div>
<ul>
<li>Change all the social ids/addresses highlighted in red with your social ids/addresses</li>
</ul>
<ul>
<li>Leave the widget title blank.</li>
</ul>
<ul>
<li>Click <b>save</b></li>
</ul>
</div>
<div>
<span style="line-height: 22px;"><i>You are done now.</i></span><br />
<span style="line-height: 22px;"><i><br /></i></span>
<blockquote class="tr_bq">
<span style="line-height: 22px;"><i>Comment if you liked the subscription box...</i></span></blockquote>
</div>
</div>

All in one subscription widget for bloggers

Hey guys today I going to share all in one subscription box for blogger. I myself have added it in this blog. Every blogger knows that a...

How To Add a facebook like button in your blog

Kaushal Srivastava 0 Blog Gadgets, Facebook, PreToPro Blogger, Social Buttons 10:18

How To Add a facebook like button in your blog

If you want your blog to be more active socially on facebook your blog must have a facebook follow button in your blog. It is very much...

How to add the best floating social media buttons gadget in blogger (3 Designs To Choose)

Kaushal Srivastava 206 Blog Gadgets, Blog Widgets, Floating Gadget, PreToPro Blogger, Social Buttons 07:41

<div dir="ltr" style="text-align: left;" trbidi="on">
<div dir="ltr" style="text-align: left;" trbidi="on">
<div class="separator" style="clear: both; text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEh6xh-p7uS_J_syubNud57za-RiR4oxXji2qZ3xGs4D4CtxpU7w04K0vu7sqz8vjV_lefnhsWaGcdsad3DgOJfk43Mq_juSXNiGFfimzXnkaUT_RfS0HBdB6u5eQbT2j7fXJX6uAQuKNDbj/s1600/social.jpg" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><span style="font-family: inherit;"><img border="0" height="386" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEh6xh-p7uS_J_syubNud57za-RiR4oxXji2qZ3xGs4D4CtxpU7w04K0vu7sqz8vjV_lefnhsWaGcdsad3DgOJfk43Mq_juSXNiGFfimzXnkaUT_RfS0HBdB6u5eQbT2j7fXJX6uAQuKNDbj/s400/social.jpg" width="400" /></span></a></div>
<div>
<span style="font-family: inherit;"><br /></span></div>
<i><span style="font-family: inherit;">Here is the best (for me) floating social media buttons gadget that have a clean and simple design. Many Professional blogger too use this gadget..</span></i><br />
<div>
<span style="font-family: inherit;"><br /></span></div>
<h2 style="text-align: left;">
<i><span style="font-family: inherit;">Design 1: </span></i></h2>
<div>
<span style="font-family: inherit;"><br /></span></div>
<div>
<span style="font-family: inherit;"><br /></span></div>
<div>
<span style="font-family: inherit;"><br /></span></div>
<table align="center" cellpadding="0" cellspacing="0" class="tr-caption-container" style="margin-left: auto; margin-right: auto; text-align: center;"><tbody>
<tr><td style="text-align: center;"><a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjsV8rOsW_3X6I-qrwUR6JSAs_jnqEKXGYFmtho4Ne_Mm0txCajni8AoyvSy7DbtA-RTHrXR2Dyjyknjw7L8AffhZ2nAuk3PQq4bp_pDQs8_8Ahm8PGddhyphenhyphenqLsTrA-U5Dt_KqYcBvK26Isg/s1600/social+gadget+design+1.jpg" imageanchor="1" style="margin-left: auto; margin-right: auto;"><span style="font-family: inherit;"><img border="0" height="200" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjsV8rOsW_3X6I-qrwUR6JSAs_jnqEKXGYFmtho4Ne_Mm0txCajni8AoyvSy7DbtA-RTHrXR2Dyjyknjw7L8AffhZ2nAuk3PQq4bp_pDQs8_8Ahm8PGddhyphenhyphenqLsTrA-U5Dt_KqYcBvK26Isg/s200/social+gadget+design+1.jpg" width="63" /></span></a></td></tr>
<tr><td class="tr-caption" style="text-align: center;"><span style="font-family: inherit;">Click to Enlarge</span></td></tr>
</tbody></table>
<span style="font-family: inherit;"><br /></span>
<br />
<div>
<h3 style="text-align: left;">
<span style="font-family: inherit;">How To Add It:</span></h3>
</div>
<div>
<span style="font-family: inherit;"><br /></span></div>
<div>
<ul style="line-height: 1.4; margin: 0.5em 0px; padding: 0px 2.5em;">
<li style="margin: 0px 0px 0.25em; padding: 0px;"><span style="font-family: inherit;">Go to your <b>blogger dashboard</b></span></li>
<li style="margin: 0px 0px 0.25em; padding: 0px;"><span style="font-family: inherit;">Select your blogger blog</span></li>
<li style="margin: 0px 0px 0.25em; padding: 0px;"><span style="font-family: inherit;">Click on <b>Layout </b>from Drop Down menu (shown in picture)</span></li>
</ul>
<div class="separator" style="clear: both; text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhhFC00yUiEneD6AjI38US0XzgRdNNkTHwtoqTm9JAIePU5WoBPQ15Tbz9E1zq7eJgaqmu9nmXkP5hZ-elIzdQu-_aArare_n3GyD-Zb0rm7bk-L5MzwqzO_sXvn1rJIxJZDQ3IOQGf0QE/s900/1.jpg" imageanchor="1" style="color: #6a6a6a; margin-left: 1em; margin-right: 1em; text-decoration: none;"><span style="font-family: inherit;"><img border="1" height="221" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhhFC00yUiEneD6AjI38US0XzgRdNNkTHwtoqTm9JAIePU5WoBPQ15Tbz9E1zq7eJgaqmu9nmXkP5hZ-elIzdQu-_aArare_n3GyD-Zb0rm7bk-L5MzwqzO_sXvn1rJIxJZDQ3IOQGf0QE/s900/1.jpg" style="-webkit-box-shadow: rgba(0, 0, 0, 0.0980392) 1px 1px 5px; background-color: white; background-position: initial initial; background-repeat: initial initial; border: 1px solid rgb(230, 230, 230); box-shadow: rgba(0, 0, 0, 0.0980392) 1px 1px 5px; padding: 1px; position: relative;" width="400" /></span></a></div>
<div class="separator" style="clear: both; text-align: center;">
</div>
<div>
<span style="font-family: inherit;"><br /></span>
<br />
<ul style="line-height: 1.4; margin: 0.5em 0px; padding: 0px 2.5em;">
<li style="margin: 0px 0px 0.25em; padding: 0px;"><span style="font-family: inherit;">A new Window appear</span></li>
<li style="margin: 0px 0px 0.25em; padding: 0px;"><span style="font-family: inherit;">Click on <b>Add gadget</b></span></li>
<li style="margin: 0px 0px 0.25em; padding: 0px;"><span style="font-family: inherit;">And select <b>HTML/JavaScript</b></span></li>
<li style="margin: 0px 0px 0.25em; padding: 0px;"><span style="font-family: inherit;">Next Box of HTML/JavaScript will appear <b>(shown in picture)</b></span></li>
</ul>
</div>
<div style="text-align: center;">
<span style="font-family: inherit;"><b style="background-color: white; font-size: 13px; line-height: 18px;">    </b></span><br />
<div class="separator" style="background-color: white; clear: both; font-size: 13px; line-height: 18px;">
<b><a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhGAMOxnn2e2idyVYMtV5VFR0V8y4gRM4WvXfjh-Uj4RTeahMfv0NZ4KMtnTL0hgUsBSHtjW0v96bm52gxxVuAlZLOH4mSyV4liN99iqDL0EEBjA-ISYSmmMoHMEa9y-xUOmQ5ADyld1wk/s900/2.png" imageanchor="1" style="color: #6a6a6a; margin-left: 1em; margin-right: 1em; text-decoration: none;"><span style="font-family: inherit;"><img border="1" height="221" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhGAMOxnn2e2idyVYMtV5VFR0V8y4gRM4WvXfjh-Uj4RTeahMfv0NZ4KMtnTL0hgUsBSHtjW0v96bm52gxxVuAlZLOH4mSyV4liN99iqDL0EEBjA-ISYSmmMoHMEa9y-xUOmQ5ADyld1wk/s900/2.png" style="-webkit-box-shadow: rgba(0, 0, 0, 0.0980392) 1px 1px 5px; border: 1px solid rgb(230, 230, 230); box-shadow: rgba(0, 0, 0, 0.0980392) 1px 1px 5px; padding: 1px; position: relative;" width="400" /></span></a></b></div>
<span style="font-family: inherit;"><b style="background-color: white; font-size: 13px; line-height: 18px;"></b><span style="background-color: white; font-size: 13px; line-height: 18px;"></span><br style="background-color: white; font-size: 13px; line-height: 18px;" /></span>
<br />
<div style="background-color: white; font-size: 13px; line-height: 18px; text-align: left;">
<ul style="line-height: 1.4; margin: 0.5em 0px; padding: 0px 2.5em;">
<li style="margin: 0px 0px 0.25em; padding: 0px;"><span style="font-family: inherit;">Now the box of HTML/JavaScript will appear when you click on the box.</span></li>
</ul>
</div>
<div class="separator" style="background-color: white; clear: both; font-size: 13px; line-height: 18px;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjuUdV6YIWJL_6zaX7XjWBObPleQyH90jbXnEyWlI1cx-p71AHEPFFTP_HHljNXTZsdowc_jZVihijglqjUzCgfqwCt7ENToRb94VpaD7pBmHPYYdY1epu_Cw5TmOh7S2SVcGqujzXNRB0/s900/5.png" imageanchor="1" style="color: #6a6a6a; margin-left: 1em; margin-right: 1em; text-decoration: none;"><span style="font-family: inherit;"><img border="1" height="221" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjuUdV6YIWJL_6zaX7XjWBObPleQyH90jbXnEyWlI1cx-p71AHEPFFTP_HHljNXTZsdowc_jZVihijglqjUzCgfqwCt7ENToRb94VpaD7pBmHPYYdY1epu_Cw5TmOh7S2SVcGqujzXNRB0/s900/5.png" style="-webkit-box-shadow: rgba(0, 0, 0, 0.0980392) 1px 1px 5px; border: 1px solid rgb(230, 230, 230); box-shadow: rgba(0, 0, 0, 0.0980392) 1px 1px 5px; padding: 1px; position: relative;" width="400" /></span></a></div>
<div style="background-color: white; text-align: left;">
<ul style="font-size: 13px; line-height: 1.4; margin: 0.5em 0px; padding: 0px 2.5em;">
<li style="margin: 0px 0px 0.25em; padding: 0px;"><span style="font-family: inherit;">Now <b>paste the following code to install the gadget</b> to your blog.</span></li>
</ul>
<div style="font-size: 13px; line-height: 18px;">
<span style="font-family: inherit;"><br /></span></div>
<div style="font-size: 13px; line-height: 18px;">
<h3 style="text-align: left;">
<span style="font-family: inherit;">Code For Design 1:</span></h3>
</div>
<div style="font-size: 13px; line-height: 18px;">
<span style="font-family: inherit;"><br /></span></div>
<div style="font-size: 13px; line-height: 18px;">
<blockquote class="tr_bq">
<span style="font-family: inherit;"><br /><div class="addthis_toolbox addthis_floating_style addthis_counter_style" style="left:50px;top:50px;"><br /><a class="addthis_button_facebook_like" fb:like:layout="box_count"></a><br /><a class="addthis_button_tweet" tw:count="vertical"></a><br /><a class="addthis_button_google_plusone" g:plusone:size="tall"></a><br /><a class="addthis_counter"></a><a href="</span>http://pretoproblogger.blogspot.com/2013/07/how-to-add-best-floating-social-media.html<span style="font-family: inherit;">">Widget</a><br /></div><br /><script type="text/javascript" src="//s7.addthis.com/js/300/addthis_widget.js#pubid=ra-508240f16db23831"></script><br /> </span></blockquote>
</div>
<div style="font-size: 13px; line-height: 18px;">
<span style="font-family: inherit;"><br /></span></div>
<h2 style="text-align: left;">
<i><span style="font-family: inherit;">Design 2:</span></i></h2>
<div style="font-size: 13px; line-height: 18px;">
<span style="font-family: inherit;"><br /></span></div>
<table align="center" cellpadding="0" cellspacing="0" class="tr-caption-container" style="font-size: 13px; line-height: 18px; margin-left: auto; margin-right: auto; text-align: center;"><tbody>
<tr><td style="text-align: center;"><a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEib3mzl_Luo12T0PWNPUyrY5ajCV-_dbE_SO-BalJ6_VFPdL6r4QHPM8pjngblT5xjMNQeY6V5jMU2mhGuzfopcAJs2Giw-HMtYt3drdKlph-DfHo9Z7EEcyMWSMz5e6MztKCWkkl03vv0T/s1600/social+gadget+design+2.jpg" imageanchor="1" style="margin-left: auto; margin-right: auto;"><span style="font-family: inherit;"><img border="0" height="200" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEib3mzl_Luo12T0PWNPUyrY5ajCV-_dbE_SO-BalJ6_VFPdL6r4QHPM8pjngblT5xjMNQeY6V5jMU2mhGuzfopcAJs2Giw-HMtYt3drdKlph-DfHo9Z7EEcyMWSMz5e6MztKCWkkl03vv0T/s200/social+gadget+design+2.jpg" width="63" /></span></a></td></tr>
<tr><td class="tr-caption" style="text-align: center;"><span style="font-family: inherit;">Click to Enlarge</span></td></tr>
</tbody></table>
<h3 style="text-align: left;">
<span style="font-family: inherit;"><br /></span><span style="font-family: inherit;">How To Add It:</span></h3>
<div>
<div style="font-size: medium; line-height: normal;">
<span style="font-family: inherit;"><br /></span></div>
<div>
<ul style="font-size: medium; line-height: 1.4; margin: 0.5em 0px; padding: 0px 2.5em;">
<li style="margin: 0px 0px 0.25em; padding: 0px;"><span style="font-family: inherit;">Go to your <b>blogger dashboard</b></span></li>
<li style="margin: 0px 0px 0.25em; padding: 0px;"><span style="font-family: inherit;">Select your blogger blog</span></li>
<li style="margin: 0px 0px 0.25em; padding: 0px;"><span style="font-family: inherit;">Click on <b>Layout </b>from Drop Down menu (shown in picture)</span></li>
</ul>
<div class="separator" style="clear: both; font-size: medium; line-height: normal; text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhhFC00yUiEneD6AjI38US0XzgRdNNkTHwtoqTm9JAIePU5WoBPQ15Tbz9E1zq7eJgaqmu9nmXkP5hZ-elIzdQu-_aArare_n3GyD-Zb0rm7bk-L5MzwqzO_sXvn1rJIxJZDQ3IOQGf0QE/s900/1.jpg" imageanchor="1" style="color: #6a6a6a; margin-left: 1em; margin-right: 1em; text-decoration: none;"><span style="font-family: inherit;"><img border="1" height="221" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhhFC00yUiEneD6AjI38US0XzgRdNNkTHwtoqTm9JAIePU5WoBPQ15Tbz9E1zq7eJgaqmu9nmXkP5hZ-elIzdQu-_aArare_n3GyD-Zb0rm7bk-L5MzwqzO_sXvn1rJIxJZDQ3IOQGf0QE/s900/1.jpg" style="-webkit-box-shadow: rgba(0, 0, 0, 0.0980392) 1px 1px 5px; border: 1px solid rgb(230, 230, 230); box-shadow: rgba(0, 0, 0, 0.0980392) 1px 1px 5px; padding: 1px; position: relative;" width="400" /></span></a></div>
<div class="separator" style="clear: both; font-size: medium; line-height: normal; text-align: center;">
</div>
<div style="font-size: medium; line-height: normal;">
<span style="font-family: inherit;"><br /></span>
<br />
<ul style="line-height: 1.4; margin: 0.5em 0px; padding: 0px 2.5em;">
<li style="margin: 0px 0px 0.25em; padding: 0px;"><span style="font-family: inherit;">A new Window appear</span></li>
<li style="margin: 0px 0px 0.25em; padding: 0px;"><span style="font-family: inherit;">Click on <b>Add gadget</b></span></li>
<li style="margin: 0px 0px 0.25em; padding: 0px;"><span style="font-family: inherit;">And select <b>HTML/JavaScript</b></span></li>
<li style="margin: 0px 0px 0.25em; padding: 0px;"><span style="font-family: inherit;">Next Box of HTML/JavaScript will appear <b>(shown in picture)</b></span></li>
</ul>
</div>
<div style="text-align: center;">
<span style="font-family: inherit;"><b style="font-size: 13px; line-height: 18px;">    </b></span><br />
<div class="separator" style="clear: both; font-size: 13px; line-height: 18px;">
<b><a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhGAMOxnn2e2idyVYMtV5VFR0V8y4gRM4WvXfjh-Uj4RTeahMfv0NZ4KMtnTL0hgUsBSHtjW0v96bm52gxxVuAlZLOH4mSyV4liN99iqDL0EEBjA-ISYSmmMoHMEa9y-xUOmQ5ADyld1wk/s900/2.png" imageanchor="1" style="color: #6a6a6a; margin-left: 1em; margin-right: 1em; text-decoration: none;"><span style="font-family: inherit;"><img border="1" height="221" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhGAMOxnn2e2idyVYMtV5VFR0V8y4gRM4WvXfjh-Uj4RTeahMfv0NZ4KMtnTL0hgUsBSHtjW0v96bm52gxxVuAlZLOH4mSyV4liN99iqDL0EEBjA-ISYSmmMoHMEa9y-xUOmQ5ADyld1wk/s900/2.png" style="-webkit-box-shadow: rgba(0, 0, 0, 0.0980392) 1px 1px 5px; border: 1px solid rgb(230, 230, 230); box-shadow: rgba(0, 0, 0, 0.0980392) 1px 1px 5px; padding: 1px; position: relative;" width="400" /></span></a></b></div>
<span style="font-family: inherit;"><b style="font-size: 13px; line-height: 18px;"></b><span style="font-size: 13px; line-height: 18px;"></span><br style="font-size: 13px; line-height: 18px;" /></span>
<br />
<div style="font-size: 13px; line-height: 18px; text-align: left;">
<ul style="line-height: 1.4; margin: 0.5em 0px; padding: 0px 2.5em;">
<li style="margin: 0px 0px 0.25em; padding: 0px;"><span style="font-family: inherit;">Now the box of HTML/JavaScript will appear when you click on the box.</span></li>
</ul>
</div>
<div class="separator" style="clear: both; font-size: 13px; line-height: 18px;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjuUdV6YIWJL_6zaX7XjWBObPleQyH90jbXnEyWlI1cx-p71AHEPFFTP_HHljNXTZsdowc_jZVihijglqjUzCgfqwCt7ENToRb94VpaD7pBmHPYYdY1epu_Cw5TmOh7S2SVcGqujzXNRB0/s900/5.png" imageanchor="1" style="color: #6a6a6a; margin-left: 1em; margin-right: 1em; text-decoration: none;"><span style="font-family: inherit;"><img border="1" height="221" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjuUdV6YIWJL_6zaX7XjWBObPleQyH90jbXnEyWlI1cx-p71AHEPFFTP_HHljNXTZsdowc_jZVihijglqjUzCgfqwCt7ENToRb94VpaD7pBmHPYYdY1epu_Cw5TmOh7S2SVcGqujzXNRB0/s900/5.png" style="-webkit-box-shadow: rgba(0, 0, 0, 0.0980392) 1px 1px 5px; border: 1px solid rgb(230, 230, 230); box-shadow: rgba(0, 0, 0, 0.0980392) 1px 1px 5px; padding: 1px; position: relative;" width="400" /></span></a></div>
<div style="text-align: left;">
<ul style="font-size: 13px; line-height: 1.4; margin: 0.5em 0px; padding: 0px 2.5em;">
<li style="margin: 0px 0px 0.25em; padding: 0px;"><span style="font-family: inherit;">Now <b>paste the following code to install the gadget</b> to your blog.</span></li>
</ul>
<div>
<span style="font-family: inherit; font-size: x-small;"><span style="line-height: 18px;"><br /></span></span></div>
<div>
<h3 style="text-align: left;">
<span style="font-family: inherit; font-size: x-small;"><span style="line-height: 18px;">Code For Design 2:</span></span></h3>
</div>
<div>
<span style="font-family: inherit; font-size: x-small;"><span style="line-height: 18px;"><br /></span></span></div>
<div>
<span style="font-family: inherit; font-size: x-small;"><span style="line-height: 18px;"></span></span><br />
<blockquote class="tr_bq">
<span style="font-family: inherit; font-size: x-small;"><span style="line-height: 18px;"></span></span><br />
<span style="font-family: inherit; font-size: x-small;"><span style="line-height: 18px;"><div class="addthis_toolbox addthis_floating_style addthis_32x32_style" style="left:50px;top:50px;"></span></span><br />
<span style="font-family: inherit; font-size: x-small;"><span style="line-height: 18px;"><a class="addthis_button_facebook"></a></span></span><br />
<span style="font-family: inherit; font-size: x-small;"><span style="line-height: 18px;"><a class="addthis_button_twitter"></a></span></span><br />
<span style="font-family: inherit; font-size: x-small;"><span style="line-height: 18px;"><a class="addthis_button_delicious"></a></span></span><br />
<span style="font-family: inherit; font-size: x-small;"><span style="line-height: 18px;"><a class="addthis_button_pinterest_share"></a></span></span><br />
<span style="font-family: inherit; font-size: x-small;"><span style="line-height: 18px;"><a class="addthis_button_digg"></a></span></span><br />
<span style="font-family: inherit; font-size: x-small;"><span style="line-height: 18px;"><a class="addthis_button_orkut"></a></span></span><br />
<span style="font-family: inherit; font-size: x-small;"><span style="line-height: 18px;"><a class="addthis_button_google_plusone_share"></a></span></span><br />
<span style="font-family: inherit; font-size: x-small;"><span style="line-height: 18px;"><a class="addthis_button_myspace"></a></span></span><br />
<span style="font-family: inherit; font-size: x-small;"><span style="line-height: 18px;"><a class="addthis_button_compact"></a><h6></span></span><br />
<span style="font-family: inherit; font-size: x-small;"><span style="line-height: 18px;"><a href="http://</span></span><span style="font-size: 13px; line-height: 18px;">http://pretoproblogger.blogspot.com/2013/07/how-to-add-best-floating-social-media.html</span><span style="font-family: inherit; font-size: x-small;"><span style="line-height: 18px;">">Widget</a></h6></span></span><br />
<span style="font-family: inherit; font-size: x-small;"><span style="line-height: 18px;"></div></span></span><br />
<span style="font-family: inherit; font-size: x-small;"><span style="line-height: 18px;"><script type="text/javascript" src="//s7.addthis.com/js/300/addthis_widget.js#pubid=ra-508240f16db23831"></script></span></span><br />
<span style="font-family: inherit; font-size: x-small;"><span style="line-height: 18px;"> </span></span></blockquote>
<span style="font-family: inherit; font-size: x-small;"><span style="line-height: 18px;">
</span></span></div>
<div>
<span style="font-family: inherit; font-size: x-small;"><span style="line-height: 18px;"><br /></span></span></div>
<h2 style="text-align: left;">
<span style="font-family: inherit; font-size: large;"><span style="line-height: 18px;"><i>Design 3 :</i></span></span></h2>
<div>
<span style="font-family: inherit; font-size: x-small;"><span style="line-height: 18px;"><br /></span></span></div>
<table align="center" cellpadding="0" cellspacing="0" class="tr-caption-container" style="margin-left: auto; margin-right: auto; text-align: center;"><tbody>
<tr><td style="text-align: center;"><a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiy8usf48TJsRv2xWOXNmmTpo5_gPAunZm8vdl-WuNTwMlYysL_i4oaBR64A1YwGDbsPuZrbeU8HAPxqXT9uV1jWLnwfLdp7amJsGD6dWji-aEotPk-HcMuILXSsT8xxeCfty4daLUZrxll/s1600/social+gadget+design+3.jpg" imageanchor="1" style="margin-left: auto; margin-right: auto;"><span style="font-family: inherit;"><img border="0" height="200" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiy8usf48TJsRv2xWOXNmmTpo5_gPAunZm8vdl-WuNTwMlYysL_i4oaBR64A1YwGDbsPuZrbeU8HAPxqXT9uV1jWLnwfLdp7amJsGD6dWji-aEotPk-HcMuILXSsT8xxeCfty4daLUZrxll/s200/social+gadget+design+3.jpg" width="63" /></span></a></td></tr>
<tr><td class="tr-caption" style="text-align: center;"><span style="font-family: inherit;">Click to Enlarge</span></td></tr>
</tbody></table>
<span style="font-family: inherit;"><br /></span>
<br />
<div>
<div>
<h3 style="text-align: left;">
<span style="font-family: inherit;">How To Add It:</span></h3>
</div>
<div>
<span style="font-family: inherit;"><br /></span></div>
<div>
<ul style="line-height: 1.4; margin: 0.5em 0px; padding: 0px 2.5em;">
<li style="margin: 0px 0px 0.25em; padding: 0px;"><span style="font-family: inherit;">Go to your <b>blogger dashboard</b></span></li>
<li style="margin: 0px 0px 0.25em; padding: 0px;"><span style="font-family: inherit;">Select your blogger blog</span></li>
<li style="margin: 0px 0px 0.25em; padding: 0px;"><span style="font-family: inherit;">Click on <b>Layout </b>from Drop Down menu (shown in picture)</span></li>
</ul>
<div class="separator" style="clear: both; text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhhFC00yUiEneD6AjI38US0XzgRdNNkTHwtoqTm9JAIePU5WoBPQ15Tbz9E1zq7eJgaqmu9nmXkP5hZ-elIzdQu-_aArare_n3GyD-Zb0rm7bk-L5MzwqzO_sXvn1rJIxJZDQ3IOQGf0QE/s900/1.jpg" imageanchor="1" style="color: #6a6a6a; margin-left: 1em; margin-right: 1em; text-decoration: none;"><span style="font-family: inherit;"><img border="1" height="221" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhhFC00yUiEneD6AjI38US0XzgRdNNkTHwtoqTm9JAIePU5WoBPQ15Tbz9E1zq7eJgaqmu9nmXkP5hZ-elIzdQu-_aArare_n3GyD-Zb0rm7bk-L5MzwqzO_sXvn1rJIxJZDQ3IOQGf0QE/s900/1.jpg" style="-webkit-box-shadow: rgba(0, 0, 0, 0.0980392) 1px 1px 5px; border: 1px solid rgb(230, 230, 230); box-shadow: rgba(0, 0, 0, 0.0980392) 1px 1px 5px; padding: 1px; position: relative;" width="400" /></span></a></div>
<div class="separator" style="clear: both; text-align: center;">
</div>
<div>
<span style="font-family: inherit;"><br /></span>
<br />
<ul style="line-height: 1.4; margin: 0.5em 0px; padding: 0px 2.5em;">
<li style="margin: 0px 0px 0.25em; padding: 0px;"><span style="font-family: inherit;">A new Window appear</span></li>
<li style="margin: 0px 0px 0.25em; padding: 0px;"><span style="font-family: inherit;">Click on <b>Add gadget</b></span></li>
<li style="margin: 0px 0px 0.25em; padding: 0px;"><span style="font-family: inherit;">And select <b>HTML/JavaScript</b></span></li>
<li style="margin: 0px 0px 0.25em; padding: 0px;"><span style="font-family: inherit;">Next Box of HTML/JavaScript will appear <b>(shown in picture)</b></span></li>
</ul>
</div>
<div style="text-align: center;">
<span style="font-family: inherit;"><b style="font-size: 13px; line-height: 18px;">    </b></span><br />
<div class="separator" style="clear: both; font-size: 13px; line-height: 18px;">
<b><a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhGAMOxnn2e2idyVYMtV5VFR0V8y4gRM4WvXfjh-Uj4RTeahMfv0NZ4KMtnTL0hgUsBSHtjW0v96bm52gxxVuAlZLOH4mSyV4liN99iqDL0EEBjA-ISYSmmMoHMEa9y-xUOmQ5ADyld1wk/s900/2.png" imageanchor="1" style="color: #6a6a6a; margin-left: 1em; margin-right: 1em; text-decoration: none;"><span style="font-family: inherit;"><img border="1" height="221" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhGAMOxnn2e2idyVYMtV5VFR0V8y4gRM4WvXfjh-Uj4RTeahMfv0NZ4KMtnTL0hgUsBSHtjW0v96bm52gxxVuAlZLOH4mSyV4liN99iqDL0EEBjA-ISYSmmMoHMEa9y-xUOmQ5ADyld1wk/s900/2.png" style="-webkit-box-shadow: rgba(0, 0, 0, 0.0980392) 1px 1px 5px; border: 1px solid rgb(230, 230, 230); box-shadow: rgba(0, 0, 0, 0.0980392) 1px 1px 5px; padding: 1px; position: relative;" width="400" /></span></a></b></div>
<span style="font-family: inherit;"><b style="font-size: 13px; line-height: 18px;"></b><span style="font-size: 13px; line-height: 18px;"></span><br style="font-size: 13px; line-height: 18px;" /></span>
<br />
<div style="font-size: 13px; line-height: 18px; text-align: left;">
<ul style="line-height: 1.4; margin: 0.5em 0px; padding: 0px 2.5em;">
<li style="margin: 0px 0px 0.25em; padding: 0px;"><span style="font-family: inherit;">Now the box of HTML/JavaScript will appear when you click on the box.</span></li>
</ul>
</div>
<div class="separator" style="clear: both; font-size: 13px; line-height: 18px;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjuUdV6YIWJL_6zaX7XjWBObPleQyH90jbXnEyWlI1cx-p71AHEPFFTP_HHljNXTZsdowc_jZVihijglqjUzCgfqwCt7ENToRb94VpaD7pBmHPYYdY1epu_Cw5TmOh7S2SVcGqujzXNRB0/s900/5.png" imageanchor="1" style="color: #6a6a6a; margin-left: 1em; margin-right: 1em; text-decoration: none;"><span style="font-family: inherit;"><img border="1" height="221" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjuUdV6YIWJL_6zaX7XjWBObPleQyH90jbXnEyWlI1cx-p71AHEPFFTP_HHljNXTZsdowc_jZVihijglqjUzCgfqwCt7ENToRb94VpaD7pBmHPYYdY1epu_Cw5TmOh7S2SVcGqujzXNRB0/s900/5.png" style="-webkit-box-shadow: rgba(0, 0, 0, 0.0980392) 1px 1px 5px; border: 1px solid rgb(230, 230, 230); box-shadow: rgba(0, 0, 0, 0.0980392) 1px 1px 5px; padding: 1px; position: relative;" width="400" /></span></a></div>
<div style="text-align: left;">
<ul style="font-size: 13px; line-height: 1.4; margin: 0.5em 0px; padding: 0px 2.5em;">
<li style="margin: 0px 0px 0.25em; padding: 0px;"><span style="font-family: inherit;">Now <b>paste the following code to install the gadget</b> to your blog.</span></li>
</ul>
<div style="font-size: 13px; line-height: 18px;">
<span style="font-family: inherit;"><br /></span></div>
<div style="font-size: 13px; line-height: 18px;">
<h3 style="text-align: left;">
<span style="font-family: inherit;">Code for Design 3:</span></h3>
</div>
<div>
<span style="font-family: inherit;"><br /></span></div>
<div>
<blockquote class="tr_bq">
<span style="font-size: x-small;"><span style="font-family: inherit;"><br /><div class="addthis_toolbox addthis_floating_style addthis_16x16_style" style="left:50px;top:50px;"><br /><a class="addthis_button_facebook"></a><br /><a class="addthis_button_twitter"></a><br /><a class="addthis_button_delicious"></a><br /><a class="addthis_button_pinterest_share"></a><br /><a class="addthis_button_digg"></a><br /><a class="addthis_button_orkut"></a><br /><a class="addthis_button_google_plusone_share"></a><br /><a class="addthis_button_myspace"></a><br /><a class="addthis_button_compact"></a><h6><br /><a href="</span><span style="line-height: 18px;">http://pretoproblogger.blogspot.com/2013/07/how-to-add-best-floating-social-media.html</span><span style="font-family: inherit;">">Widget</a></h6><br /></div><br /><script type="text/javascript" src="//s7.addthis.com/js/300/addthis_widget.js#pubid=ra-508240f16db23831"></script><br /> </span></span></blockquote>
</div>
</div>
</div>
</div>
</div>
<div>
<span style="font-family: inherit; font-size: x-small;"><span style="line-height: 18px;"><br /></span></span></div>
</div>
</div>
</div>
</div>
<div style="font-size: 13px; line-height: 18px;">
<span style="font-family: inherit;"><br /></span></div>
<div style="font-size: 13px; line-height: 18px;">
<span style="font-family: inherit;"><br /></span></div>
<div style="font-family: Arial, Tahoma, Helvetica, FreeSans, sans-serif; font-size: 13px; line-height: 18px;">
<br /></div>
</div>
</div>
</div>
</div>
<br />
<script type="text/javascript">
ch_fluidH = 1;
ch_nump = "3";
ch_client = "pretoproblogger";
ch_width = 600;
ch_height = "auto";
ch_type = "mpu";
ch_sid = "Chitika Default";
ch_color_site_link = "000000";
ch_color_title = "000000";
ch_color_border = "FFFFFF";
ch_color_text = "000000";
ch_color_bg = "FFFFFF";
</script>
<script src="http://scripts.chitika.net/eminimalls/amm.js" type="text/javascript">
</script></div>

How to add the best floating social media buttons gadget in blogger (3 Designs To Choose)

Here is the best (for me) floating social media buttons gadget that have a clean and simple design. Many Professional blogger too use ...

Advertise Here

How To Add Cool Social Sharing Widget with hover Effect?

All in one subscription widget for bloggers

How To Add a facebook like button in your blog

How to add the best floating social media buttons gadget in blogger (3 Designs To Choose)

Get FREE updates on your Email | RSS

Popular Posts

Comments

Blog Archive