Brain Interactive

HOW TO ADD AUTHOR WIDGET TO YOUR BLOG

<div dir="ltr" style="text-align: left;" trbidi="on">
<div dir="ltr" style="background-color: white;" trbidi="on">
<span style="background-color: transparent;"><span style="color: #111111; font-family: Trebuchet MS, sans-serif; font-size: x-small;">OK</span></span><span style="color: #111111; font-family: 'Trebuchet MS', sans-serif; font-size: x-small;"> everything seems to fine up to now. But When I have been reading many articles on my friends blogs and much more. I came to know they are keeping their widget regarding About the Author as your are seeing below this post. Ok after an study regarding my template then I came to know how to insert the code into my html and make my “About The Author “ visible under my posts. You need not worry about your knowledge regarding html. Ok before getting into tutorial. I would like you to stay connected with me in my </span><a href="http://facebook.com/BIAConstruct" style="color: #1950ab; font-family: 'Trebuchet MS', sans-serif; font-size: 14px; text-decoration: none;" target="_blank"><span style="font-size: x-small;">Facebook</span></a><span style="color: #111111; font-family: 'Trebuchet MS', sans-serif; font-size: x-small;"> , </span><a href="https://twitter.com/BIAConstruct" style="color: #1950ab; font-family: 'Trebuchet MS', sans-serif; font-size: 14px; text-decoration: none;" target="_blank"><span style="font-size: x-small;">Twitter</span></a><span style="color: #111111; font-family: 'Trebuchet MS', sans-serif; font-size: x-small;"> and also </span><a href="https://plus.google.com/110776907604424001338" style="color: #1950ab; font-family: 'Trebuchet MS', sans-serif; font-size: 14px; text-decoration: none;" target="_blank"><span style="font-size: x-small;">Google+</span></a><span style="color: #111111; font-family: 'Trebuchet MS', sans-serif; font-size: x-small;"> .<br /><br />Ok. Getting into tutorial….<br />First opend your template. Inorder to do this . Just goto </span><a href="http://www.blogger.com/" style="color: #1950ab; font-family: 'Trebuchet MS', sans-serif; font-size: 14px; text-decoration: none;"><span style="font-size: x-small;">www.blogger.com</span></a><span style="color: #111111; font-family: 'Trebuchet MS', sans-serif; font-size: x-small;"> sign in. Then click you site if you have more than one. Then left click Template based on new blogger version. Then click on edit template. Make sure you always back up your data. If anything wrong happens you can get back your old one safely.<br />Quick link :    Template –> Edit HTML –>  Make sure you ticked  Expand Widget Template.<br />Then you need find the below shown text.</span><span style="color: #111111; font-family: Trebuchet MS, sans-serif;"><span style="font-size: 14px;"> </span></span><br /><div class="code" style="background-image: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiMyDT385aJnwBG2WHUcWVmAofam9bOroy5UkMFYjyy9v49nnTbvPMDAfkpGYNsKmXRww55zGGLrppiy8FqFvYh4f7a7fCuIE980kbhyphenhyphenIq0eiiLIva4BA6vq2lOSmtj-kgU0g1nD68Pvu4/s1600/wood-note-book-page.jpg); background-position: 0% 0%; border: 2px solid rgb(204, 204, 204); color: #666666; font-family: 'Courier New', fixed, monospace; font-size: 11px; line-height: 15px; margin: 1em 0px; overflow: auto; padding: 0px 20px 0px 64px;">
<br />]]></b:skin></div>
<span style="color: #111111; font-family: 'Trebuchet MS', sans-serif; font-size: x-small;">Hope you got it. Then copy the below code and paste In the above <span style="color: red;">“ <b>]]></b:skin></b> “</span></span><span style="color: #111111; font-family: Trebuchet MS, sans-serif;"><span style="font-size: 14px;"> </span></span><br /><div class="code" style="background-image: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiMyDT385aJnwBG2WHUcWVmAofam9bOroy5UkMFYjyy9v49nnTbvPMDAfkpGYNsKmXRww55zGGLrppiy8FqFvYh4f7a7fCuIE980kbhyphenhyphenIq0eiiLIva4BA6vq2lOSmtj-kgU0g1nD68Pvu4/s1600/wood-note-book-page.jpg); background-position: 0% 0%; border: 2px solid rgb(204, 204, 204); color: #666666; font-family: 'Courier New', fixed, monospace; font-size: 11px; height: 450px; line-height: 15px; margin: 1em 0px; overflow: auto; padding: 0px 20px 0px 64px; width: 542px;">
.dc-about-author-containter h3, .dc-about-author-containter p{<br />margin:0 0 10px 0;<br />padding:0;<br />}<br />.dc-about-author-containter{<br />background: #f2f7fc;<br />border: 1px solid #000;<br />clear: both;<br />margin: 20px 0;<br />overflow: hidden;<br />padding: 20px;<br />}<br />.dc-about-author-pic{<br />background: #fff;<br />border: 1px solid #e7e7e7;<br />float: left;<br />height: 100px;<br />width: 100px;<br />margin: 0 -122px 0 0;<br />padding: 10px;<br />}<br />.dc-about-author-pic img{<br />width: 100px;<br />}<br />.dc-about-author-text{<br />float: left;<br />margin: 0 0 0 140px;<br />}</div>
<span style="color: #111111; font-family: 'Trebuchet MS', sans-serif; font-size: x-small;">After this. You have one more step and the code is just below.</span><span style="color: #111111; font-family: Trebuchet MS, sans-serif;"><span style="font-size: 14px;"> </span></span><br /><br /><div class="code" style="background-image: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiMyDT385aJnwBG2WHUcWVmAofam9bOroy5UkMFYjyy9v49nnTbvPMDAfkpGYNsKmXRww55zGGLrppiy8FqFvYh4f7a7fCuIE980kbhyphenhyphenIq0eiiLIva4BA6vq2lOSmtj-kgU0g1nD68Pvu4/s1600/wood-note-book-page.jpg); background-position: 0% 0%; border: 2px solid rgb(204, 204, 204); color: #666666; font-family: 'Courier New', fixed, monospace; font-size: 11px; line-height: 15px; margin: 1em 0px; overflow: auto; padding: 0px 20px 0px 64px;">
<br /><br /><b:if cond='data:blog.pageType == &quot;item&quot;'><br /><b:if cond='data:post.author == &quot;<span style="color: red;"><b>TYPE YOUR NAME HERE</b></span>&quot;'><br /><div class='dc-about-author-containter' style='background-color: #ffffff;'><div class='dc-about-author-pic'><img alt='' class='avatar avatar-100 photo' height='100' src=<span style="color: red;"><span style="color: #666666;">'</span><b>YOUR-PHOTO-URL</b></span>' width='100'/></div><div class='dc-about-author-text'><h3>About the Author</h3><br /><p><b><span style="color: red;">ABOUTH THE AUTHOR YOUR DETAIL TYPE HERE</span></b></p><br /><div align='right'><br/><br/><br /><a href='http://wehelpalways.blogspot.com/2013/03/How-To-Add-Author-Widget-To-Your-Blog.html';#; target='blank' style='text-decoration:none;font-size:70%;'>[Add this]<br /></a></div></div></div><br /></b:if><br /></b:if><br /><br /></div>
</div>
<span style="background-color: white; color: #111111; font-family: 'Trebuchet MS', sans-serif; font-size: x-small;">Hope your are done then before saving your template you need to change the below mentioned items :</span><span style="background-color: white; color: #111111; font-family: 'Trebuchet MS', sans-serif; font-size: 14px;"> </span><br style="background-color: white; color: #111111; font-family: 'Trebuchet MS', sans-serif; font-size: 14px;" /><ol style="background-color: white; color: #111111; font-family: 'Trebuchet MS', sans-serif; font-size: 14px;">
<li><span style="color: red;"><b><span style="font-size: x-small;">TYPE YOUR NAME HERE    :  <span style="color: #ffc000;">REPLACE THIS WITH YOUR NAME</span></span></b></span></li>
<li><b><span style="font-size: x-small;"><span style="color: red;">YOUR-PHOTO-URL              : </span><span style="color: #ffc000;">ENTER THE URL OF PHOTO</span></span></b></li>
<li><b><span style="font-size: x-small;"><span style="color: red;">ABOUTH THE AUTHOR YOUR DETAIL TYPE HERE : </span><span style="color: #ffc000;">ENTER THE TEXT YOU WANT TO DISPLAY BESIDE YOU PIC.</span></span></b></li>
</ol>
<span style="background-color: white; color: #666666; font-family: 'Trebuchet MS', sans-serif; font-size: x-small;">The below is the widget it is the sample to this tutorial. </span><span style="background-color: white; color: #111111; font-family: 'Trebuchet MS', sans-serif; font-size: 14px;"></span><br style="background-color: white; color: #111111; font-family: 'Trebuchet MS', sans-serif; font-size: 14px;" /><br style="background-color: white; color: #111111; font-family: 'Trebuchet MS', sans-serif; font-size: 14px;" /><b style="background-color: white; color: #111111; font-family: 'Trebuchet MS', sans-serif; font-size: 14px;"><span style="color: red; font-size: x-small;">NOTE : THE WIDGET IS SOMEWHAT DIFFERENT WHEN COMPARED TO THE TUTORAIL IT IS BECAUSE I  EDITED THE COLOUR AND MORE. YOU CAN DO IT ON YOU OWN.</span></b><span style="background-color: white; color: #111111; font-family: 'Trebuchet MS', sans-serif; font-size: 14px;"> </span><br style="background-color: white; color: #111111; font-family: 'Trebuchet MS', sans-serif; font-size: 14px;" /><br style="background-color: white; color: #111111; font-family: 'Trebuchet MS', sans-serif; font-size: 14px;" /><span style="background-color: white; color: #666666; font-family: 'Trebuchet MS', sans-serif; font-size: x-small;">Let me know whether this helped you or not..</span><span style="background-color: white; color: #111111; font-family: 'Trebuchet MS', sans-serif; font-size: 14px;"> </span><br style="background-color: white; color: #111111; font-family: 'Trebuchet MS', sans-serif; font-size: 14px;" /><span style="background-color: white; color: #666666; font-family: 'Trebuchet MS', sans-serif; font-size: x-small;">Comment below.</span><span style="background-color: white; color: #111111; font-family: 'Trebuchet MS', sans-serif; font-size: 14px;"> </span><br /></div>

HOW TO ADD AUTHOR WIDGET TO YOUR BLOG

OK everything seems to fine up to now. But When I have been reading many articles on my friends blogs and much more. I came to know they ...

Follow By Email Gadget for Blogger

<div dir="ltr" style="text-align: left;" trbidi="on">
<br />
<div class="headline_area" style="background-color: white; border: 0px; color: #333333; font-family: 'Open Sans', Arial, sans-serif; font-size: 14px; line-height: 25px; margin: 0px; overflow: hidden; padding: 0px; vertical-align: baseline;">
<h2 class="entry-title" itemprop="name" style="border: 0px; color: #494949; font-family: BreeSerifRegular, Arial, sans-serif; font-size: 35px; font-style: inherit; font-variant: inherit; font-weight: normal; line-height: 50px; margin: 0px 0px 10px; padding: 0px; vertical-align: baseline;">
Follow By Email Gadget for Blogger</h2>
</div>
<div class="format_text entry-content" id="post-body-6930357835244625223" itemprop="articleBody" style="background-color: white; border: 0px; color: #333333; font-family: 'Open Sans', Arial, sans-serif; font-size: 14px; line-height: 25px; margin: 0px; padding: 0px; vertical-align: baseline;">
<div style="border: 0px; font-family: inherit; font-size: inherit; font-style: inherit; font-variant: inherit; line-height: inherit; margin-bottom: 1em; padding: 0px; vertical-align: baseline;">
<img align="left" alt="image" border="0" class="postthumb" height="250" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhFptmAbsxQGx44I4h2finLK6YC6JDWn2YF5c0t-u3IwIqKHdG8wPROwsKI5E1iYSQS8CeYTkSBvM3MdaKDtNkDW7fclRDG-fbIcsLY1OYBMk3387jT7jk18ZykVfkYBJeh0zmN3tBnqA/s250/image%5B26%5D.png" style="border-bottom-left-radius: 4px; border-bottom-right-radius: 4px; border-top-left-radius: 4px; border-top-right-radius: 4px; border: 1px solid rgb(211, 211, 211); font-family: inherit; font-size: inherit; font-style: inherit; font-variant: inherit; height: auto; line-height: inherit; margin: 0px; max-width: 98%; padding: 5px; vertical-align: baseline;" title="Follow By Email Gadget for Blogger" width="250" />Some of you might have already noticed the new “Follow by Email” Gadget on your “Add a Gadget Page”. The gadget is pretty simple and easy to install.</div>
<div style="border: 0px; font-family: inherit; font-size: inherit; font-style: inherit; font-variant: inherit; line-height: inherit; margin-bottom: 1em; padding: 0px; vertical-align: baseline;">
<br /></div>
<div style="border: 0px; font-family: inherit; font-size: inherit; font-style: inherit; font-variant: inherit; line-height: inherit; margin-bottom: 1em; padding: 0px; vertical-align: baseline;">
To add this Gadget, Follow these simple steps</div>
<a href="" name="more" style="-webkit-transition: background-color, color 0.2s linear; border: 0px; color: #41b7d8; font-family: inherit; font-size: inherit; font-style: inherit; font-variant: inherit; line-height: inherit; margin: 0px; padding: 0px; vertical-align: baseline;"></a><div style="border: 0px; font-family: inherit; font-size: inherit; font-style: inherit; font-variant: inherit; line-height: inherit; margin-bottom: 1em; padding: 0px; vertical-align: baseline;">
1. Login to your Blogger Dashboard, Navigate to<strong style="border: 0px; font-family: inherit; font-size: inherit; font-style: inherit; font-variant: inherit; line-height: inherit; margin: 0px; padding: 0px; vertical-align: baseline;"> Design</strong>> <strong style="border: 0px; font-family: inherit; font-size: inherit; font-style: inherit; font-variant: inherit; line-height: inherit; margin: 0px; padding: 0px; vertical-align: baseline;">Page Elements</strong> tab and click on the “Add a Gadget” Link</div>
<div style="border: 0px; font-family: inherit; font-size: inherit; font-style: inherit; font-variant: inherit; line-height: inherit; margin-bottom: 1em; padding: 0px; vertical-align: baseline;">
2.On the next window click on the plus sign, and you will be taken to the gadget options page.<img alt="image" border="0" height="342" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEj_xChMcgnyW4XrPD3f-ht44iR-FWDBEf0ayyFk__b0pzn1U6XVv7ETElrVyDFXqA7WSOxWroWErgdfLhLci9gGbF-cJLOHLrV-W9_0DjgnRACJRME8aOZbnI2FeCxsatYtb8oJhrhpX1Q/?imgmax=800" style="background-image: none; border-bottom-left-radius: 4px; border-bottom-right-radius: 4px; border-top-left-radius: 4px; border-top-right-radius: 4px; border: 0px solid rgb(211, 211, 211); display: inline; font-family: inherit; font-size: inherit; font-style: inherit; font-variant: inherit; height: auto; line-height: inherit; margin: 0px; max-width: 98%; padding: 0px 0px 5px; vertical-align: baseline;" title="image" width="590" /></div>
<div style="border: 0px; font-family: inherit; font-size: inherit; font-style: inherit; font-variant: inherit; line-height: inherit; margin-bottom: 1em; padding: 0px; vertical-align: baseline;">
3. Click the save Button and you are done.</div>
<div style="border: 0px; font-family: inherit; font-size: inherit; font-style: inherit; font-variant: inherit; line-height: inherit; margin-bottom: 1em; padding: 0px; vertical-align: baseline;">
<img alt="image" border="0" height="332" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiVCjrxUf39Fx3T8THkmgiF79vdwK5UNjcpC3zVj7ZGdI-SP05BykauFlUHxel52Y89pdamhaXIjLX3bc-bRlMzG8ePPb2NMDTDURoMEVSpqSkw3br5qSsP2rWFNYZAbxYX2TxVY21DxnM/?imgmax=800" style="background-image: none; border-bottom-left-radius: 4px; border-bottom-right-radius: 4px; border-top-left-radius: 4px; border-top-right-radius: 4px; border: 0px solid rgb(211, 211, 211); display: inline; font-family: inherit; font-size: inherit; font-style: inherit; font-variant: inherit; height: auto; line-height: inherit; margin: 0px; max-width: 98%; padding: 0px 0px 5px; vertical-align: baseline;" title="image" width="557" /></div>
<div style="border: 0px; font-family: inherit; font-size: inherit; font-style: inherit; font-variant: inherit; line-height: inherit; margin-bottom: 1em; padding: 0px; vertical-align: baseline;">
You are done now!! :) Wasn’t that simple?</div>
<h3 style="border: 0px; font-family: BreeSerifRegular, Arial, sans-serif; font-size: 32px; font-style: inherit; font-variant: inherit; font-weight: inherit; line-height: 40px; margin: 10px 0px; padding: 0px; vertical-align: baseline;">
Some  Insight!!</h3>
<div style="border: 0px; font-family: inherit; font-size: inherit; font-style: inherit; font-variant: inherit; line-height: inherit; margin-bottom: 1em; padding: 0px; vertical-align: baseline;">
You can track your subscription information from your FeedBurner Panel.</div>
<div style="border: 0px; font-family: inherit; font-size: inherit; font-style: inherit; font-variant: inherit; line-height: inherit; margin-bottom: 1em; padding: 0px; vertical-align: baseline;">
Though this gadget has got a simple easy to use interface, the gadget is really intelligent, and does  lot of background work and synchronization. It checks if you have already burnt your blogger feed, and if you have, then it retrieves  your Feed burner URL automatically. If you have burnt  the feed but  hadn’t enabled the Email Subscription option for your Feed, then it automatically enables the same.</div>
<div style="border: 0px; font-family: inherit; font-size: inherit; font-style: inherit; font-variant: inherit; line-height: inherit; margin-bottom: 1em; padding: 0px; vertical-align: baseline;">
If you haven’t even used FeedBurner before, then it automatically burns your blogger feed, and retrieves the new FeedBurner url of the new feed that was generated.</div>
<h3 style="border: 0px; font-family: BreeSerifRegular, Arial, sans-serif; font-size: 32px; font-style: inherit; font-variant: inherit; font-weight: inherit; line-height: 40px; margin: 10px 0px; padding: 0px; vertical-align: baseline;">
Oh!! I hate the url that FeedBurner gave me.</h3>
<div style="border: 0px; font-family: inherit; font-size: inherit; font-style: inherit; font-variant: inherit; line-height: inherit; margin-bottom: 1em; padding: 0px; vertical-align: baseline;">
If your blog has a very common name, then there is every possibility that you will end up with a  non-pretty FeedBurner url like <a href="http://feeds.feedburner.com/blogspot/qOAyP" style="-webkit-transition: background-color, color 0.2s linear; border: 0px; color: #41b7d8; font-family: inherit; font-size: inherit; font-style: inherit; font-variant: inherit; line-height: inherit; margin: 0px; padding: 0px; text-decoration: none; vertical-align: baseline;">http://feeds.feedburner.com/blogspot/qOAyP</a> . Most of  you might not give a damn about this url. But if you really want to change it, then you can easily do that as well.Follow these Steps</div>
<div style="border: 0px; font-family: inherit; font-size: inherit; font-style: inherit; font-variant: inherit; line-height: inherit; margin-bottom: 1em; padding: 0px; vertical-align: baseline;">
1. Login to <a href="http://feedburner.com/" rel="nofollow" style="-webkit-transition: background-color, color 0.2s linear; border: 0px; color: #41b7d8; font-family: inherit; font-size: inherit; font-style: inherit; font-variant: inherit; line-height: inherit; margin: 0px; padding: 0px; text-decoration: none; vertical-align: baseline;" target="_blank">http://feedburner.com</a> and Click on the Feed For your Blog</div>
<div style="border: 0px; font-family: inherit; font-size: inherit; font-style: inherit; font-variant: inherit; line-height: inherit; margin-bottom: 1em; padding: 0px; vertical-align: baseline;">
<img alt="image" border="0" height="184" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgalJ1AwXSEb8NhMiop3Ofm1-M49-yl_YpuGF0TvbGwP-9K7sunNQgpj34OFgGtN5Pe6L790fG0RYn9NZudDEkSdXCBOuQxb4zKlhVSKIjMXOfTSFncMxYOS6V6I7D9EyxC9rNo2UPlpg/?imgmax=800" style="background-image: none; border-bottom-left-radius: 4px; border-bottom-right-radius: 4px; border-top-left-radius: 4px; border-top-right-radius: 4px; border: 0px solid rgb(211, 211, 211); display: inline; font-family: inherit; font-size: inherit; font-style: inherit; font-variant: inherit; height: auto; line-height: inherit; margin: 0px; max-width: 98%; padding: 0px 0px 5px; vertical-align: baseline;" title="image" width="495" /></div>
<div style="border: 0px; font-family: inherit; font-size: inherit; font-style: inherit; font-variant: inherit; line-height: inherit; margin-bottom: 1em; padding: 0px; vertical-align: baseline;">
2. Click on Edit Feed Details</div>
<div style="border: 0px; font-family: inherit; font-size: inherit; font-style: inherit; font-variant: inherit; line-height: inherit; margin-bottom: 1em; padding: 0px; vertical-align: baseline;">
<img alt="image" border="0" height="119" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhi41orAoF4rcSMLZx3NQZhkKweShASRksLT2CUVlzWIxUXbnV8A8BtZ1ZldyBoL_xpnnkpm6dRnPCZg2YgWdOQrMNUQcVuBpyx7z82aqenDp_FeoLjKmE-QD0M-VcMzqEIM7OYlDx3LaI/?imgmax=800" style="background-image: none; border-bottom-left-radius: 4px; border-bottom-right-radius: 4px; border-top-left-radius: 4px; border-top-right-radius: 4px; border: 0px solid rgb(211, 211, 211); display: inline; font-family: inherit; font-size: inherit; font-style: inherit; font-variant: inherit; height: auto; line-height: inherit; margin: 0px; max-width: 98%; padding: 0px 0px 5px; vertical-align: baseline;" title="image" width="508" /></div>
<div style="border: 0px; font-family: inherit; font-size: inherit; font-style: inherit; font-variant: inherit; line-height: inherit; margin-bottom: 1em; padding: 0px; vertical-align: baseline;">
3. Change the Feed Address to something pretty!</div>
<div style="border: 0px; font-family: inherit; font-size: inherit; font-style: inherit; font-variant: inherit; line-height: inherit; margin-bottom: 1em; padding: 0px; vertical-align: baseline;">
4. Click on <strong style="border: 0px; font-family: inherit; font-size: inherit; font-style: inherit; font-variant: inherit; line-height: inherit; margin: 0px; padding: 0px; vertical-align: baseline;"><em style="border: 0px; font-family: inherit; font-size: inherit; font-variant: inherit; font-weight: inherit; line-height: inherit; margin: 0px; padding: 0px; vertical-align: baseline;">Save Feed Details</em></strong> button</div>
<div style="border: 0px; font-family: inherit; font-size: inherit; font-style: inherit; font-variant: inherit; line-height: inherit; margin-bottom: 1em; padding: 0px; vertical-align: baseline;">
<img alt="image" border="0" height="428" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgdP1VSu62VdwvF2Lo_fk9Heaa5cvG_2m4vUzWX52eVP4gGlAWxalpWmrzkjcnSuasnNRVRHawg1mcNC344hDhU7KwZo0mtpuWi24YfFdTeuZUVknYOS_Vm12JBX7JlJh8f89EhLv074Mk/?imgmax=800" style="background-color: #d8d9da; background-image: none; border-bottom-left-radius: 4px; border-bottom-right-radius: 4px; border-top-left-radius: 4px; border-top-right-radius: 4px; border: 0px solid rgb(188, 188, 188); display: inline; font-family: inherit; font-size: inherit; font-style: inherit; font-variant: inherit; height: auto; line-height: inherit; margin: 0px; max-width: 98%; padding: 0px 0px 5px; vertical-align: baseline;" title="image" width="590" /></div>
</div>
</div>

Follow By Email Gadget for Blogger

Follow By Email Gadget for Blogger Some of you might have already noticed the new “Follow by Email” Gadget on your “Add a Gadget Pag...

10 + Beautiful Back/Scroll To Top Buttons Widget For Blogger/Blogspot

<div dir="ltr" style="text-align: left;" trbidi="on">
<span class="Apple-style-span" style="color: #333333; font-family: Arial, Tahoma, Helvetica, FreeSans, sans-serif; font-size: 15px; line-height: 20px;"></span><br />
<div class="separator" style="clear: both; text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhVgar2ErqZDnBufoCPkm_L6j90QGsD3_X3zXTYLB_DWKZwykilVIOkwEgX0xFA4TtaDTTOGIv69XaRJ0VrnNn3EFbrAKNpsP2M0wDkvrUAfEdK0JkYiky-m3-aAe-Lv9DnKs8rbnKRKTNu/s1600/Back+to+top.jpg" imageanchor="1" style="clear: left; color: #992211; float: left; margin-bottom: 1em; margin-right: 1em; position: relative; text-decoration: none;"><img border="0" height="200" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhVgar2ErqZDnBufoCPkm_L6j90QGsD3_X3zXTYLB_DWKZwykilVIOkwEgX0xFA4TtaDTTOGIv69XaRJ0VrnNn3EFbrAKNpsP2M0wDkvrUAfEdK0JkYiky-m3-aAe-Lv9DnKs8rbnKRKTNu/s200/Back+to+top.jpg" style="border-bottom-style: none; border-color: initial; border-left-style: none; border-right-style: none; border-top-style: none; border-width: initial; position: relative;" width="200" /></a></div>
<span class="Apple-style-span" style="color: #333333; font-family: Arial, Tahoma, Helvetica, FreeSans, sans-serif; font-size: 14px; line-height: 18px;"></span><br />
<h2 class="post-title entry-title" itemprop="name" style="color: #666666; font: normal normal normal 20px/normal Arial; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; position: relative;">
<span class="Apple-style-span" style="color: #333333; font-family: Arial, Tahoma, Helvetica, FreeSans, sans-serif; font-size: 14px; line-height: 18px;">
10 + Beautiful  Back/Scroll To Top Buttons Widget For Blogger/Blogspot</span></h2>
<span class="Apple-style-span" style="color: #333333; font-family: Arial, Tahoma, Helvetica, FreeSans, sans-serif; font-size: 14px; line-height: 18px;">
</span><span class="Apple-style-span" style="color: #333333; font-family: Arial, Tahoma, Helvetica, FreeSans, sans-serif; font-size: 15px; line-height: 20px;"><br />
<span class="Apple-style-span" style="color: #333333; font-family: Arial, Tahoma, Helvetica, FreeSans, sans-serif; font-size: 15px; line-height: 20px;"><br /></span>
<span class="Apple-style-span" style="color: #333333; font-family: Arial, Tahoma, Helvetica, FreeSans, sans-serif; font-size: 15px; line-height: 20px;"><br /></span>
Today am sharing with you, how to add a back to top button with smooth jQuery effect, this widget will allow your readers/visitors to move back to the top of your blog with just a single click and it appears when readers scroll downward.<br />I have created this button in different style, what you just need to do is to choose from the varieties of the buttons that best suit your blog.<br /><br /><div style="color: #cc0000;">
<span style="font-size: medium;"><b>How To Add The Back To Top Button</b></span></div>
<ul style="line-height: 1.4; list-style-image: initial; list-style-position: initial; list-style-type: disc; margin-bottom: 0.5em; margin-left: 0px; margin-right: 0px; margin-top: 0.5em; padding-bottom: 0px; padding-left: 2.5em; padding-right: 2.5em; padding-top: 0px;">
<li style="border-bottom-style: none; border-color: initial; border-left-style: none; border-right-style: none; border-top-color: initial; border-top-style: none; border-top-width: initial; border-width: initial; margin-bottom: 0.25em; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; text-indent: 0px;">Go to your blogger dashboard</li>
<li style="border-bottom-style: none; border-color: initial; border-left-style: none; border-right-style: none; border-top-color: rgba(128, 128, 128, 0.496094); border-top-style: none; border-top-width: 1px; border-width: initial; margin-bottom: 0.25em; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; text-indent: 0px;">Click on "<b>Design</b>" > "<b>Page Elements</b>" > "<b>Add a Gadget</b>"</li>
<li style="border-bottom-style: none; border-color: initial; border-left-style: none; border-right-style: none; border-top-color: rgba(128, 128, 128, 0.496094); border-top-style: none; border-top-width: 1px; border-width: initial; margin-bottom: 0.25em; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; text-indent: 0px;">Choose "<b>HTML/JavaScript</b>" from the list of the gadgets</li>
<li style="border-bottom-style: none; border-color: initial; border-left-style: none; border-right-style: none; border-top-color: rgba(128, 128, 128, 0.496094); border-top-style: none; border-top-width: 1px; border-width: initial; margin-bottom: 0.25em; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; text-indent: 0px;">Copy and paste the code below in the content box and click "<b>Save</b>"</li>
</ul>
<div style="border-bottom-style: ridge; border-left-style: ridge; border-right-style: ridge; border-top-style: ridge;">
<span style="font-family: 'Courier New', Courier, monospace;"><script src='http://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js' type='text/javascript'></script><script type='text/javascript'>$(function(){$(window).scroll(function(){if($(this).scrollTop()!=0){$("#rb-top").fadeIn()}else{$("#rb-top").fadeOut()}});$("#rb-top").click(function(){$("body,html").animate({scrollTop:0},800);return false})});</script><a href="http://realcombiz.com"></a><a id='rb-top' style='display: none; position: fixed; bottom: 1px; <b style="background-color: cyan;">right</b>:0%; cursor:pointer;font:12px arial;'><img src='<b style="background-color: cyan;">BUTTON URL</b>' <b>width="<span style="background-color: cyan;">50</span>px"</b><b style="background-color: white;">height="<span style="background-color: cyan;">50</span>px</b>"/></a></span></div>
<ul style="line-height: 1.4; list-style-image: initial; list-style-position: initial; list-style-type: disc; margin-bottom: 0.5em; margin-left: 0px; margin-right: 0px; margin-top: 0.5em; padding-bottom: 0px; padding-left: 2.5em; padding-right: 2.5em; padding-top: 0px;">
<li style="border-bottom-style: none; border-color: initial; border-left-style: none; border-right-style: none; border-top-color: initial; border-top-style: none; border-top-width: initial; border-width: initial; margin-bottom: 0.25em; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; text-indent: 0px;">Choose from the list of buttons below and replace <b style="background-color: cyan;">BUTTON URL</b> with the url of the button you decide to choose.</li>
<li style="border-bottom-style: none; border-color: initial; border-left-style: none; border-right-style: none; border-top-color: rgba(128, 128, 128, 0.496094); border-top-style: none; border-top-width: 1px; border-width: initial; margin-bottom: 0.25em; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; text-indent: 0px;">To change the position of the button, edit <b style="background-color: cyan;">right</b> and replace it with <b style="background-color: cyan;">left</b> if you decide to position it in left direction.</li>
<li style="border-bottom-style: none; border-color: initial; border-left-style: none; border-right-style: none; border-top-color: rgba(128, 128, 128, 0.496094); border-top-style: none; border-top-width: 1px; border-width: initial; margin-bottom: 0.25em; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; text-indent: 0px;">To change the size of the button, simply edit <b>width="<span style="background-color: cyan;">50</span>px"</b> and <b>height="<span style="background-color: cyan;">50</span>px"</b></li>
</ul>
<div style="color: #cc0000;">
<br />
<span style="font-size: medium;"><b>List Of Back To Top Buttons And Their Url</b></span></div>
<br /><u><b>BUTTON 1:</b></u><br /><br /><div class="separator" style="clear: both; text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgkeLlHfNQvpJGCRSi5aBIFGB_27_GRQlESOQUlG_skB4QZEIR9CPnwfc6zkF9AOEk9ryoACqJMfziAA9Z9MPEqWne5rak6vD8y1UaHOmhpry4b8YvOGZU5AisAG5wWQ27B6fMWyVsWqHTq/s1600/rb+back+to+top+1.png" imageanchor="1" style="color: #992211; margin-left: 1em; margin-right: 1em; position: relative; text-decoration: none;"><img border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgkeLlHfNQvpJGCRSi5aBIFGB_27_GRQlESOQUlG_skB4QZEIR9CPnwfc6zkF9AOEk9ryoACqJMfziAA9Z9MPEqWne5rak6vD8y1UaHOmhpry4b8YvOGZU5AisAG5wWQ27B6fMWyVsWqHTq/s1600/rb+back+to+top+1.png" style="border-bottom-style: none; border-color: initial; border-left-style: none; border-right-style: none; border-top-style: none; border-width: initial; position: relative;" /></a></div>
<br /><b>BUTTON 1 URL</b><br /><div style="border-bottom-style: ridge; border-left-style: ridge; border-right-style: ridge; border-top-style: ridge;">
<span style="font-family: 'Courier New', Courier, monospace;">https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgkeLlHfNQvpJGCRSi5aBIFGB_27_GRQlESOQUlG_skB4QZEIR9CPnwfc6zkF9AOEk9ryoACqJMfziAA9Z9MPEqWne5rak6vD8y1UaHOmhpry4b8YvOGZU5AisAG5wWQ27B6fMWyVsWqHTq/s1600/rb+back+to+top+1.png</span></div>
<br /><br /><u><b>BUTTON 2:</b></u><br /><br /><div class="separator" style="clear: both; text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiCsxWayusWec-WNryhT-qJolBqa-n-8KEh7xwUzGbj8gSv6SjH2uPuIPBWj_A6TSb3p6ujqaK3W7yc1HDStH99gyGjSFC7AGqA0K_x6zsbUs-wxBc5QzbnLCpk2-vOdq_Xa7plmxnTc5_R/s1600/rb+back+to+top+2.png" imageanchor="1" style="color: #992211; margin-left: 1em; margin-right: 1em; position: relative; text-decoration: none;"><img border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiCsxWayusWec-WNryhT-qJolBqa-n-8KEh7xwUzGbj8gSv6SjH2uPuIPBWj_A6TSb3p6ujqaK3W7yc1HDStH99gyGjSFC7AGqA0K_x6zsbUs-wxBc5QzbnLCpk2-vOdq_Xa7plmxnTc5_R/s1600/rb+back+to+top+2.png" style="border-bottom-style: none; border-color: initial; border-left-style: none; border-right-style: none; border-top-style: none; border-width: initial; position: relative;" /></a></div>
<br /><b>BUTTON 2 URL</b><br /><div style="border-bottom-style: ridge; border-left-style: ridge; border-right-style: ridge; border-top-style: ridge; font-family: 'Courier New', Courier, monospace;">
https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiCsxWayusWec-WNryhT-qJolBqa-n-8KEh7xwUzGbj8gSv6SjH2uPuIPBWj_A6TSb3p6ujqaK3W7yc1HDStH99gyGjSFC7AGqA0K_x6zsbUs-wxBc5QzbnLCpk2-vOdq_Xa7plmxnTc5_R/s1600/rb+back+to+top+2.png</div>
<br /><br /><u><b>BUTTON 3:</b></u><br /><br /><div class="separator" style="clear: both; text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEi099vPzZ4GNK8RdaJ04NCwKb978znkQ5b-vRjP-XeD-gKTG83jkhwKgoTM_FdvSg315g7Gh4hjykvbIvzU_RW9x64DmcfmgHR7p1vBdABv8mimWbA8WEvjFzOKqLKz8idQ423bXU2Q-uGh/s1600/rb+back+to+top+3.png" imageanchor="1" style="color: #992211; margin-left: 1em; margin-right: 1em; position: relative; text-decoration: none;"><img border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEi099vPzZ4GNK8RdaJ04NCwKb978znkQ5b-vRjP-XeD-gKTG83jkhwKgoTM_FdvSg315g7Gh4hjykvbIvzU_RW9x64DmcfmgHR7p1vBdABv8mimWbA8WEvjFzOKqLKz8idQ423bXU2Q-uGh/s1600/rb+back+to+top+3.png" style="border-bottom-style: none; border-color: initial; border-left-style: none; border-right-style: none; border-top-style: none; border-width: initial; position: relative;" /></a></div>
<br /><b>BUTTON 3 URL</b><br /><div style="border-bottom-style: ridge; border-left-style: ridge; border-right-style: ridge; border-top-style: ridge;">
<span style="font-family: 'Courier New', Courier, monospace;">https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEi099vPzZ4GNK8RdaJ04NCwKb978znkQ5b-vRjP-XeD-gKTG83jkhwKgoTM_FdvSg315g7Gh4hjykvbIvzU_RW9x64DmcfmgHR7p1vBdABv8mimWbA8WEvjFzOKqLKz8idQ423bXU2Q-uGh/s1600/rb+back+to+top+3.png</span></div>
<br /><br /><u><b>BUTTON 4:</b></u><br /><br /><div class="separator" style="clear: both; text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgdQUP4dCvgie-qU50wb7kNf9-naUCr2d0jCzj4sZBnwP-BdGGEjNNYQ7fUAZpPbdHvlDlUP4eC93iTFsij6XikhV1SON6J9-7mqB7YIn90s-cON2ZA9cJY2JmmxBSNDlg5ZvwymDp3YKVX/s1600/rb+back+to+top+4.png" imageanchor="1" style="color: #992211; margin-left: 1em; margin-right: 1em; position: relative; text-decoration: none;"><img border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgdQUP4dCvgie-qU50wb7kNf9-naUCr2d0jCzj4sZBnwP-BdGGEjNNYQ7fUAZpPbdHvlDlUP4eC93iTFsij6XikhV1SON6J9-7mqB7YIn90s-cON2ZA9cJY2JmmxBSNDlg5ZvwymDp3YKVX/s1600/rb+back+to+top+4.png" style="border-bottom-style: none; border-color: initial; border-left-style: none; border-right-style: none; border-top-style: none; border-width: initial; position: relative;" /></a></div>
<br /><b>BUTTON 4 URL</b><br /><div style="border-bottom-style: ridge; border-left-style: ridge; border-right-style: ridge; border-top-style: ridge;">
<span style="font-family: 'Courier New', Courier, monospace;">https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgdQUP4dCvgie-qU50wb7kNf9-naUCr2d0jCzj4sZBnwP-BdGGEjNNYQ7fUAZpPbdHvlDlUP4eC93iTFsij6XikhV1SON6J9-7mqB7YIn90s-cON2ZA9cJY2JmmxBSNDlg5ZvwymDp3YKVX/s1600/rb+back+to+top+4.png</span></div>
<br /><br /><u><b>BUTTON 5:</b></u><br /><br /><div class="separator" style="clear: both; text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjK66Iyu3Bt_iLu-iv0m4Z0Lr0a1ZV6U_xbfFJ6gAA1hdSnetwf1pWLstbt9oQXlLbO0HKRjoilk8BMV5c4nDqvPES0zuy5WI4seblvKha0DBF202RgyCOZkwk8pYgRI2wcCqsL_j3yBlpM/s1600/rb+back+to+top+5.png" imageanchor="1" style="color: #992211; margin-left: 1em; margin-right: 1em; position: relative; text-decoration: none;"><img border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjK66Iyu3Bt_iLu-iv0m4Z0Lr0a1ZV6U_xbfFJ6gAA1hdSnetwf1pWLstbt9oQXlLbO0HKRjoilk8BMV5c4nDqvPES0zuy5WI4seblvKha0DBF202RgyCOZkwk8pYgRI2wcCqsL_j3yBlpM/s1600/rb+back+to+top+5.png" style="border-bottom-style: none; border-color: initial; border-left-style: none; border-right-style: none; border-top-style: none; border-width: initial; position: relative;" /></a></div>
<br /><b>BUTTON 5 URL</b><br /><div style="border-bottom-style: ridge; border-left-style: ridge; border-right-style: ridge; border-top-style: ridge;">
<span style="font-family: 'Courier New', Courier, monospace;">https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjK66Iyu3Bt_iLu-iv0m4Z0Lr0a1ZV6U_xbfFJ6gAA1hdSnetwf1pWLstbt9oQXlLbO0HKRjoilk8BMV5c4nDqvPES0zuy5WI4seblvKha0DBF202RgyCOZkwk8pYgRI2wcCqsL_j3yBlpM/s1600/rb+back+to+top+5.png</span></div>
<br /><br /><u><b>BUTTON 6:</b></u><br /><br /><div class="separator" style="clear: both; text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEictZZjgDkQkQ3UrNe5qdNASEBdeUq0SVXCqH49Oxxc-M4d15gwmzZazhDS1bBe0vd3k4-Mua1kuHKjbWpBB1Zy-rl5gdO3JlbdKHc163sDbb4cQDG9Ffy8Lj-KSXu4JtUHYiKNfs2UGka9/s1600/rb+back+to+top+6.png" imageanchor="1" style="color: #992211; margin-left: 1em; margin-right: 1em; position: relative; text-decoration: none;"><img border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEictZZjgDkQkQ3UrNe5qdNASEBdeUq0SVXCqH49Oxxc-M4d15gwmzZazhDS1bBe0vd3k4-Mua1kuHKjbWpBB1Zy-rl5gdO3JlbdKHc163sDbb4cQDG9Ffy8Lj-KSXu4JtUHYiKNfs2UGka9/s1600/rb+back+to+top+6.png" style="border-bottom-style: none; border-color: initial; border-left-style: none; border-right-style: none; border-top-style: none; border-width: initial; position: relative;" /></a></div>
<br /><b>BUTTON 6 URL</b><br /><div style="border-bottom-style: ridge; border-left-style: ridge; border-right-style: ridge; border-top-style: ridge;">
<span style="font-family: 'Courier New', Courier, monospace;">https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEictZZjgDkQkQ3UrNe5qdNASEBdeUq0SVXCqH49Oxxc-M4d15gwmzZazhDS1bBe0vd3k4-Mua1kuHKjbWpBB1Zy-rl5gdO3JlbdKHc163sDbb4cQDG9Ffy8Lj-KSXu4JtUHYiKNfs2UGka9/s1600/rb+back+to+top+6.png</span></div>
<br /><br /><u><b>BUTTON 7:</b></u><br /><br /><div class="separator" style="clear: both; text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhJSGcbSOMdw-aqh-88aKAKaEJEbkXbOtxTifH1URhcF8SGOtdyz23ROLz94lyzMVOmhqoJmraV3H8wF0FHD4CdkPrNIe5nHOppiTnIJs8bI1S-xuPm5DMhh8LbeFnBIL63i9jYVRuAj_15/s1600/rb+back+to+top+7.png" imageanchor="1" style="color: #992211; margin-left: 1em; margin-right: 1em; position: relative; text-decoration: none;"><img border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhJSGcbSOMdw-aqh-88aKAKaEJEbkXbOtxTifH1URhcF8SGOtdyz23ROLz94lyzMVOmhqoJmraV3H8wF0FHD4CdkPrNIe5nHOppiTnIJs8bI1S-xuPm5DMhh8LbeFnBIL63i9jYVRuAj_15/s1600/rb+back+to+top+7.png" style="border-bottom-style: none; border-color: initial; border-left-style: none; border-right-style: none; border-top-style: none; border-width: initial; position: relative;" /></a></div>
<br /><b>BUTTON 7 URL</b><br /><div style="border-bottom-style: ridge; border-left-style: ridge; border-right-style: ridge; border-top-style: ridge; font-family: 'Courier New', Courier, monospace;">
https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhJSGcbSOMdw-aqh-88aKAKaEJEbkXbOtxTifH1URhcF8SGOtdyz23ROLz94lyzMVOmhqoJmraV3H8wF0FHD4CdkPrNIe5nHOppiTnIJs8bI1S-xuPm5DMhh8LbeFnBIL63i9jYVRuAj_15/s1600/rb+back+to+top+7.png</div>
<br /><br /><u><b>BUTTON 8:</b></u><br /><br /><div class="separator" style="clear: both; text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg-8cdTixvgw9d9sWJ418j2rmcKfEge-ojWyybhbyOBIESHm7lJbFhJNY4PZNL1WGPLzwAWvLyqWYBdD0-MiF-bTD5HZkfrGeolW4GitFEsjJFEaLy3_x4falJeODaGzHMCa34hyphenhyphenyIW_6B8/s1600/rb+back+to+top+8.png" imageanchor="1" style="color: #992211; margin-left: 1em; margin-right: 1em; position: relative; text-decoration: none;"><img border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg-8cdTixvgw9d9sWJ418j2rmcKfEge-ojWyybhbyOBIESHm7lJbFhJNY4PZNL1WGPLzwAWvLyqWYBdD0-MiF-bTD5HZkfrGeolW4GitFEsjJFEaLy3_x4falJeODaGzHMCa34hyphenhyphenyIW_6B8/s1600/rb+back+to+top+8.png" style="border-bottom-style: none; border-color: initial; border-left-style: none; border-right-style: none; border-top-style: none; border-width: initial; position: relative;" /></a></div>
<br /><b>BUTTON 8 URL</b><br /><div style="border-bottom-style: ridge; border-left-style: ridge; border-right-style: ridge; border-top-style: ridge;">
<span style="font-family: 'Courier New', Courier, monospace;">https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg-8cdTixvgw9d9sWJ418j2rmcKfEge-ojWyybhbyOBIESHm7lJbFhJNY4PZNL1WGPLzwAWvLyqWYBdD0-MiF-bTD5HZkfrGeolW4GitFEsjJFEaLy3_x4falJeODaGzHMCa34hyphenhyphenyIW_6B8/s1600/rb+back+to+top+8.png</span></div>
<br /><br /><u><b>BUTTON 9:</b></u><br /><br /><div class="separator" style="clear: both; text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjoqLEnKR7HYW6TOL22kUXPdaEFSHAKeIYadh0hTwplAnr-jDBts5KMibndGu_VkbMOgufBns8D1L5A1Rqrn8Bd0CiFzfGtid_qFmHY1yKFzSreOcOUZXX9auyVujVcVgG0o80VHbRbWG5-/s1600/rb+back+to+top+9.png" imageanchor="1" style="color: #992211; margin-left: 1em; margin-right: 1em; position: relative; text-decoration: none;"><img border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjoqLEnKR7HYW6TOL22kUXPdaEFSHAKeIYadh0hTwplAnr-jDBts5KMibndGu_VkbMOgufBns8D1L5A1Rqrn8Bd0CiFzfGtid_qFmHY1yKFzSreOcOUZXX9auyVujVcVgG0o80VHbRbWG5-/s1600/rb+back+to+top+9.png" style="border-bottom-style: none; border-color: initial; border-left-style: none; border-right-style: none; border-top-style: none; border-width: initial; position: relative;" /></a></div>
<br /><b>BUTTON 9 URL</b><br /><div style="border-bottom-style: ridge; border-left-style: ridge; border-right-style: ridge; border-top-style: ridge;">
<span style="font-family: 'Courier New', Courier, monospace;">https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjoqLEnKR7HYW6TOL22kUXPdaEFSHAKeIYadh0hTwplAnr-jDBts5KMibndGu_VkbMOgufBns8D1L5A1Rqrn8Bd0CiFzfGtid_qFmHY1yKFzSreOcOUZXX9auyVujVcVgG0o80VHbRbWG5-/s1600/rb+back+to+top+9.png</span></div>
<br /><br /><u><b>BUTTON 10:</b></u><br /><br /><div class="separator" style="clear: both; text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiboY8qpdPnAl_IsqXKoRgq6e2qSUtWyomc4AbyCoCv64u8yBXrixQjG5KTAVj8gGc97l29XI8XicfhU_2cvngYhhknY0M8JegSIeKK6h1RARRTqxpVfgGwYE0R9bfV23jVULu7F-eSzfBH/s1600/rb+back+to+top+10.png" imageanchor="1" style="color: #992211; margin-left: 1em; margin-right: 1em; position: relative; text-decoration: none;"><img border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiboY8qpdPnAl_IsqXKoRgq6e2qSUtWyomc4AbyCoCv64u8yBXrixQjG5KTAVj8gGc97l29XI8XicfhU_2cvngYhhknY0M8JegSIeKK6h1RARRTqxpVfgGwYE0R9bfV23jVULu7F-eSzfBH/s1600/rb+back+to+top+10.png" style="border-bottom-style: none; border-color: initial; border-left-style: none; border-right-style: none; border-top-style: none; border-width: initial; position: relative;" /></a></div>
<br /><b>BUTTON 10 URL</b><br /><div style="border-bottom-style: ridge; border-left-style: ridge; border-right-style: ridge; border-top-style: ridge;">
<span style="font-family: 'Courier New', Courier, monospace;">https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiboY8qpdPnAl_IsqXKoRgq6e2qSUtWyomc4AbyCoCv64u8yBXrixQjG5KTAVj8gGc97l29XI8XicfhU_2cvngYhhknY0M8JegSIeKK6h1RARRTqxpVfgGwYE0R9bfV23jVULu7F-eSzfBH/s1600/rb+back+to+top+10.png</span></div>
<br /><br /><u><b>BUTTON 11 URL:</b></u><br /><br /><div class="separator" style="clear: both; text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhim8KaiT08iaUYkUn17ircz0F3D7RLy2MDaWTLboPgGKlWji6tVKUS3_bos9nKM5iylkYswhYrWjg0ugEFDFOYXof-F1lFjsTZPfWlBSDtbI1tAwDhiNQ8JtxMFnVHOgwAlRRsKOb1CJRS/s1600/rb+back+to+top+11.png" imageanchor="1" style="color: #992211; margin-left: 1em; margin-right: 1em; position: relative; text-decoration: none;"><img border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhim8KaiT08iaUYkUn17ircz0F3D7RLy2MDaWTLboPgGKlWji6tVKUS3_bos9nKM5iylkYswhYrWjg0ugEFDFOYXof-F1lFjsTZPfWlBSDtbI1tAwDhiNQ8JtxMFnVHOgwAlRRsKOb1CJRS/s1600/rb+back+to+top+11.png" style="border-bottom-style: none; border-color: initial; border-left-style: none; border-right-style: none; border-top-style: none; border-width: initial; position: relative;" /></a></div>
<br /><b>BUTTON 11 URL</b><br /><div style="border-bottom-style: ridge; border-left-style: ridge; border-right-style: ridge; border-top-style: ridge;">
<span style="font-family: 'Courier New', Courier, monospace;">https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhim8KaiT08iaUYkUn17ircz0F3D7RLy2MDaWTLboPgGKlWji6tVKUS3_bos9nKM5iylkYswhYrWjg0ugEFDFOYXof-F1lFjsTZPfWlBSDtbI1tAwDhiNQ8JtxMFnVHOgwAlRRsKOb1CJRS/s1600/rb+back+to+top+11.png</span></div>
<br />That's all, hope you like all this cute buttons? we like to hear from you, your comments is highly welcome.<br />Share this article with friends/followers, and in our future post, we will be publishing a lot of tutorials on how you can spice up your blog using jQuery effects, and for you not to miss any of this, simply <a href="http://feedburner.google.com/fb/a/mailverify?uri=Realcombiz" style="color: #992211; position: relative; text-decoration: none;">subscribe</a> now and receive all our latest update directly into your email. stay bless till then. </span></div>

10 + Beautiful Back/Scroll To Top Buttons Widget For Blogger/Blogspot

10 + Beautiful Back/Scroll To Top Buttons Widget For Blogger/Blogspot Today am sharing with you, how to add a back to top butto...