Features:
1.) It Will Fixed On Top Either You Scroll The Page Or Not.
2.) It Also Has A Close Button So That Is Visitor Did Not Want To See, They Have Control To Close It.
3.) Easy To Install And Quick To Load.
7.) Works On IE+6 And All Other Browsers.
8.) Gradient Will Also Work On IE+6 And All Other Browsers.
How To Add In Blogspot?
1.) Go To Your www.blogger.com
2.) Open Your Desire Blog.
3.) Go To Layout.
4.) Click “Add A Gadget” Where You Want To Add It.
5.) Now Scroll To “HTML-JAVASCRIPT”
6.) Click “+” Icon To Add It.
7.) Now Copy The Below Code And Paste It To There.
8.) Leave The Title Empty.
9.) Click Save, Now You Are Done.
How To Add In Website?
1.) Just Go To Your HTML File.
2.) Now Copy The Below Code And Paste It Between <body> </body>.
3.) Save It, Now You Are Done.
<style>
#exebar{
background: #7d7e7d; /* Old browsers */
/* IE9 SVG, needs conditional override of ‘filter’ to ‘none’ */
background: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiA/Pgo8c3ZnIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgd2lkdGg9IjEwMCUiIGhlaWdodD0iMTAwJSIgdmlld0JveD0iMCAwIDEgMSIgcHJlc2VydmVBc3BlY3RSYXRpbz0ibm9uZSI+CiAgPGxpbmVhckdyYWRpZW50IGlkPSJncmFkLXVjZ2ctZ2VuZXJhdGVkIiBncmFkaWVudFVuaXRzPSJ1c2VyU3BhY2VPblVzZSIgeDE9IjAlIiB5MT0iMCUiIHgyPSIwJSIgeTI9IjEwMCUiPgogICAgPHN0b3Agb2Zmc2V0PSIwJSIgc3RvcC1jb2xvcj0iIzdkN2U3ZCIgc3RvcC1vcGFjaXR5PSIxIi8+CiAgICA8c3RvcCBvZmZzZXQ9IjEwMCUiIHN0b3AtY29sb3I9IiMwZTBlMGUiIHN0b3Atb3BhY2l0eT0iMSIvPgogIDwvbGluZWFyR3JhZGllbnQ+CiAgPHJlY3QgeD0iMCIgeT0iMCIgd2lkdGg9IjEiIGhlaWdodD0iMSIgZmlsbD0idXJsKCNncmFkLXVjZ2ctZ2VuZXJhdGVkKSIgLz4KPC9zdmc+);
background: -moz-linear-gradient(top, #7d7e7d 0%, #0e0e0e 100%); /* FF3.6+ */
background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#7d7e7d), color-stop(100%,#0e0e0e)); /* Chrome,Safari4+ */
background: -webkit-linear-gradient(top, #7d7e7d 0%,#0e0e0e 100%); /* Chrome10+,Safari5.1+ */
background: -o-linear-gradient(top, #7d7e7d 0%,#0e0e0e 100%); /* Opera 11.10+ */
background: -ms-linear-gradient(top, #7d7e7d 0%,#0e0e0e 100%); /* IE10+ */
background: linear-gradient(top, #7d7e7d 0%,#0e0e0e 100%); /* W3C */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr=’#7d7e7d’, endColorstr=’#0e0e0e’,GradientType=0 ); /* IE6-8 */
width:100%;
text-align:center;
top:0px;
left:0px;
border-bottom: 1px solid #888888;
z-index: 999;
height: 28px;
position:fixed;
line-height: 2.2em;
color:#fff;
font-size:13px;
font-weight:bold;
font-family: arial,”Helvetica”,sans-serif;
}
#exebar a{color:#eeff00;text-decoration:none;}
#exebar a:hover{text-decoration:underline;}
</style>
<script type=’text/javascript’>
//<![CDATA[
function closeTopAds() {document.getElementById(“exebar”).style.display = “none”;}
//]]>
</script>
<div id=’exebar’>
+++Your Text Here…+++
<center style=’padding:0px; float:right; cursor:pointer;’ onclick=’closeTopAds();return false;’>(X) </center>
</div>
<!– This Is A Copyrighted “EXE Top Fixed Bar” Widget, Don’t Try To Theft It Otherwise… –>
Customization:
1.) Change The Red Text To Your Desire HTML, JavaScript Codes Or Text With Links.
2.) Save And Done.
This is my own opinion that the best use of this bar is here with that full tutorial, please have a look.
How To Make Your Blog For Low Speed Connection?
Its Amzing Tips 🙂
Thanks, This Code Is Now UpDated With New Code And Gradient That Will Also Work On IE+6…
salamo alaykom
thank u brother; it’s work for me http://pro-stats.blogspot.com/
You Are Welcome, Also Try “Hulo Bar” For Your Blog.
Like your another widgets, this one is also awesome. I only search for blogger widgets on Google, If I can’t find it in exeideas :). I added this top bar to my site http://www.makeuseofandroid.com. My site already have a sticky top navigation menu on top. So I want to add this one to bottom. How can I do it?
Thanks.. Now it’s working fine 🙂
Welcome Here And Thanks For Liking Our Blog And Leaving Positive Views For New Comers. Yes, You Can Move It To Bottom By Changing Just “top” To “bottom” In First CSS Live.
You Are Welcome…
Very useful post I really appreciate it…keep up the good work. Thanks!
Welcome Here And Thanks For Liking Our Widget. Hope To See It Live On Your Blog…
It is responsive with blogger mobile view.
Yes, You can try. If have any problem then we are here to help…