After searching for a cool gluey bar I in conclusion conduct this one. I similar it because it is real slow to install together with you lot tin edit its colors, font style, font size, you lot tin too conduct where you want to set it, rank or bottom. Influenza A virus subtype H5N1 demo of this widget tin move seen on this blog, I am using it every bit my bill of fare bar together with blend it to my template to instruct inwards await cool.
You tin too add together to a greater extent than features to this gluey bar if you lot are good with coding. So lets start shall we.
Installation
1. Go to your blogger.com account
2. Go to edit HTML together with brand certain you lot backed upward your template inwards example something goes wrong.
3. Go to your blogger layout > Add gadget > HTML/ Javascript together with add together the codes below together with save
<style type='text/css'>
#tnsbar {
background: none repeat scroll 0 0 #000000;
border-bottom: 2px venture #F3F3F3;
box-shadow: 0 2px 7px #000000;
color: #FFFFFF;
font-size: 10px;
height: 30px;
margin: 0;
overflow: hidden;
padding: 0;
position: fixed;
right: 0;
top: 0;
width: 100%;
z-index: 100;
}
#tnsbar a {
color: #FFFFFF;
font-family: 'Droid Sans',sans-serif;
font-size: 12px;
font-weight: bold;
line-height: 30px;
list-style: none exterior none;
text-decoration: none;
margin:50px;
}
</style>
<div id="tnsbar">
<div style="float:right;padding:4px;">
<a href='http://twitter.com/share' class='twitter-share-button' expr:data-url='data:post.url' expr:data-text='data:post.title' data-via='dadhust' data-lang='en'></a>
<b:if cond='data:post.isfirstpost'>f
</b:if>
</div>
<div style="float:right;padding:4px;">
<g:plusone size="medium"></g:plusone>
</div>
<div style="float:right;padding:4px;">
<fb:like layout="button_count" show_faces="false" font=""></fb:like>
</div>
<p><a href='#' target='_blank'>Your Text Here</a></p>
</div>
4. Now notice this code </body> using CTRL+F and add together the next codes inwards a higher house it, alone if you haven’t added the Like, Tweet together with Google+ push clit to your blog. If you lot already accept them you lot don't take to follow this step.
<script src='http://connect.facebook.net/en_US/all.js#xfbml=1'/>
<script src='https://apis.google.com/js/plusone.js' type='text/javascript'/>
<script src='//platform.twitter.com/widgets.js' type='text/javascript'/>
Customize
000000 is the background color of the gluey bar, you lot tin alter the color using this color code generator.
If you lot similar to set it on the bottom screen, alter rank to bottom.
box-shadow: 0 2px 7px #000000 is that tiny box shadow on your bar, you lot tin take away them past times erasing it from the script.
Change dadhust to your twitter username.
Change Your Text Here to your desired message similar "hello" or "welcome". In my case, I used that to brand a floating bill of fare bar. Here is a sample.
Change this code from this
<p><a href='#' target='_blank'>Your Text Here</a></p>
</div>
To this
<p><a href='http://fromhobby2money.blogspot.com/' target='_blank'> Home</a><a href='http://fromhobby2money.blogspot.com/p/contact-me.html' target='_blank'> Contact</a><a href='http://fromhobby2money.blogspot.com/p/sitemap.html' target='_blank'> Table of Contents</a></p></div>
Those colored inwards blood-red are the URL of your chosen menu, alter them every bit you wish.
That is all! I hoped you lot liked it, if you lot accept questions kindly role the comment shape below.
