I have seen that a significant number of those utilizing toolbars, for example, Wibiya have needed to remove it because of interfering with the execution of a few scripts like Scriptaculous and Prototype, while others have decided to remove these scripts just to continue utilizing the toolbar.
All things considered, for those who want to have a custom toolbar that does not give them such issues and permit them to keep utilizing different scripts, here how to make our own floating toolbar with a close option.
Adding a custom Sticky Toolbar on Blogger
Step # 1: Login to your accoutn and go to Template > Edit HTML
Step # 2: Now, click inside the code area and Click CTRL + F key and open search box
Step # 3: copy the following code and paste in the search box and find it.
]]></b:skin>Step # 4: Now above ]]></b:skin> add the following code
#custom-toolbar {
overflow: auto;
position: fixed;
background: #1B1B1B url("https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEih2pW9A4LoWKog0izCNEBLYaCVPM43o_G8DHmDJ-NIGs-_E8YjhyV5rpS26udE0Qp1gg7gJ8ZxRfwtNJdCH_T7lGHcE8cuKVWaoLkZkFcdNvXCPl5T4CLcEzT7IoN0N814sQ-VLWQ_ZqM5/s1600/pagelist.png") repeat-x scroll 0 bottom;
font: bold 13px/17px "Helvetica Neue",Helvetica,Arial,Geneva,sans-serif;
height: 33px;
margin: 0 auto;
width: 100%;
bottom:0px;
right:0;
}
.close-toolbar {
float: right;
margin-top:6px;
padding-right: 10px;
cursor: pointer;
}
.search-text {
color: #D1D1D1;
text-align: center;
border-radius: 10px;
}
.google_translate:hover img {
filter:alpha(opacity=0.90);
-moz-opacity: 0.90;
opacity: 0.90;
border:0;
}
Step # 5: Now find out this tag
</head>Step # 6: Now above the </head> tag add this code
<script type='text/javascript'>Step # 7: Now find out for the </body> tag and just above it, add this HTML code
// Custom Toolbar for Blogger (helplogger.blogspot.com)
//<![CDATA[
var toolbar_blogger = new Array();
var toolbar_clear = new Array();
function toolbarFloat(toolb) {
toolbar_blogger[toolbar_blogger.length] = this;
var ftrpointer = eval(toolbar_blogger.length-1);
this.pagetop = 0;
this.cmode = (document.compatMode && document.compatMode!="BackCompat") ? document.documentElement : document.body;
this.toolbsrc = document.all? document.all[toolb] : document.getElementById(toolb);
this.toolbsrc.height = this.toolbsrc.offsetHeight;
this.toolbheight = this.cmode.clientHeight;
this.toolboffset = toolbGetOffsetY(toolbar_blogger[toolbpointer]);
var toolbbar = 'toolbar_clear['+toolbpointer+'] = setInterval("toolbarFloatInit(toolbar_blogger['+toolbpointer+'])",1);';
toolbbar = toolbbar;
eval(toolbbar);
}
function toolbGetOffsetY(toolb) {
var toolbTotOffset = parseInt(toolb.mtasrc.offsetTop);
var parentOffset = toolb.toolbsrc.offsetParent;
while ( parentOffset != null ) {
toolbTotOffset += parentOffset.offsetTop;
parentOffset = parentOffset.offsetParent;
}
return toolbTotOffset;
}
function toolbarFloatInit(toolb) {
toolb.pagetop = toolb.cmode.scrollTop;
toolb.toolbsrc.style.top = toolb.pagetop - toolb.mtaoffset + "px";
}
function closeTopAds() {
document.getElementById("custom-toolbar").style.visibility = "hidden";
}
//]]>
</script>
<div id='custom-toolbar'>
<img border='0' class='close-toolbar' onClick='closeTopAds();return false;' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjhXJBfvG30FA8I_v5BD-DC0evouYieeTDNnvtTMXjLJblCn9AqDnlboZWnQ-oQsGJn5_XXVtEefI9q_BJTDkI1lB1KJapjll1YHTLYkfpw0U-QFSVi1bjhOfxJNOVrbF2nmTpCcymHt_Fn/s1600/close_button.png' title='Close' width='17'/>
<table border='0' cellpadding='2'>
<tr>
<td style='padding-left:30px; padding-right:50px;'><form action='/search' id='search' method='get' name='searchForm' style='display:inline;'>
<input class='search-text' name='q' onblur='if (this.value == "") this.value = "Search here...";' onfocus='if (this.value == "Search here...") this.value = "";' size='28' type='text' value='Search here...'/></form></td>
<td style='padding-left:20px;'><a href='http://www.facebook.com/username' title='Follow on Facebook'><img src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjy1Y5wL-Wf6V0Mc0zE0ksMpchn7VgwspTPl23SP-I5xSpVsU5a4_drxiAdhRB0GJwq3bO6RTDUKsgRVs64A6_ZE5O9mHe1iZ6XS7TxBH0SqL4OE23zTqm-EtQSkL6hpZKPKv6MKBxTr0iK/s1600/facebook-icon.png'/></a></td>
<td><a href='http://twitter.com/username' title='Follow on Twitter'><img src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhDsOxE7h8_GrjTJRiEZ56ldHJefoUcfZLOL3bnNnN2F2kGPMvymvRbhJzaJIDmX-75lqDQI_RC34AD8Aronu46bquhteKFJy1jQK-ubCxcK2RBI_utC4pW2dtLHip8K6uyKBY3CN4HNn8L/s1600/twitter-icon.png'/></a></td>
<td><a expr:href='data:blog.homepageUrl + "feeds/posts/default"' title='Subscribe to Feed'><img src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgTY4ORHTBOuGhTQvdLZ2Snu-qfKTsqgf1fPnx3uVMD80G1wLzV4WmrpZEB0GQKdsCoxgCLzX9ucxbj126tQjT8ReMuCzDB8SsPaQ7-YUPBm9K2RTIDbrvoRZfFGj3QXJPtZ70I8p4WhEtV/s1600/rss-feed-icon2.png'/></a></td>
<td style='padding-left:40px; padding-top: 5px;'><a class='twitter-share-button' data-count='horizontal' data-lang='en' href='http://twitter.com/share' title='Publish on Twitter'>Tweet</a><script src='http://platform.twitter.com/widgets.js' type='text/javascript'/></td>
<td><a href='http://www.facebook.com/sharer.php' name='fb_share' title='Publish on Facebook' type='button_count'>Share</a><script src='http://static.ak.fbcdn.net/connect.php/js/FB.Share' type='text/javascript'/></td>
<td style='padding-left:60px;'><a class="google_translate" href='Javascript:void(0)' onclick='window.open("http://www.google.com/translate?u="+encodeURIComponent(location.href)+"&langpair=auto%7Cen&hl=en&ie=UTF8"); return false;' rel='nofollow' title='English'><img align='absbottom' alt='English' border='0' height='24' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhY6VuOvNPktnLu9YuKF8_IariYLUs8zyC4vA2I5XxpyYRsN2M4dt9gaTgggspOXg1YHLy7X9lOdwKp4_fMq6nmRkVYByqxpOK23tBUZC2KZpRo1_WA5_IXuBqpH5FZZ81yW5pJrZBKofLr/s1600/United+Kingdom(Great+Britain).png' width='24'/></a></td>
<td><a class="google_translate" href='Javascript:void(0)' onclick="window.open("http://www.google.com/translate?u="+encodeURIComponent(location.href)+"&langpair=auto%7Cde&hl=en&ie=UTF8"); return false;"><img alt="German" border="0" align="absbottom" title="German" height="24" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhcseFpoKY-whDeaO1pf5gqoTKbwzHYY1uc1fmYB7LkVglLfHsfPe0yOtqY-wZQ91jWwF5Rq-9fSYV95BJXAo4Uf1QtmOGXD7uK7iKAvYtgzHPek80S7HyGYzADxR5TaHsudXZ86LeNod_M/s1600/Germany.png" width="24"/></a></td>
<td><a class="google_translate" href='Javascript:void(0)' onclick='window.open("http://www.google.com/translate?u="+encodeURIComponent(location.href)+"&langpair=auto%7Cfr&hl=en&ie=UTF8"); return false;' rel='nofollow' title='French'><img align='absbottom' alt='French' border='0' height='24' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjkyhuylXnsr5wq_5xIiAzZaSmgvGD4oqwgg2apL4Ze95YHt419wPwqJOQLlu2Q9VLS5fwoy6rDUt3a6VxMokQC9QXKoKbHAGXGmF9ct-y8rCbi75uqHrHUqpS0tJyVFDzGc5pN3uQKEJEO/s1600/France.png' width='24'/></a></td>
<td><a class="google_translate" href='Javascript:void(0)' onclick='window.open("http://www.google.com/translate?u="+encodeURIComponent(location.href)+"&langpair=auto%7Car&hl=en&ie=UTF8"); return false;' rel='nofollow' title='Arabic'><img align='absbottom' alt='Arabic' border='0' height='24' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhpbA4R7RPoXcc1Tu9H3lpcL53x0KlbkZwHa9NuwUsx5wnqBm-F8oWWdbit656iiMA_aw066ufe8MG1ctFaxGYH4AKm53THNJJPeGAzlNXT9lJUAkYO-XezJIueDwLmRdJtR5BOdWp2O9rY/s1600/Saudi+Arabia.png' width='24'/></a></td>
<td><a class="google_translate" href='Javascript:void(0)' onclick='window.open("http://www.google.com/translate?u="+encodeURIComponent(location.href)+"&langpair=auto%7Czh-cn&hl=en&ie=UTF8"); return false;' rel='nofollow' title='Chinese Simplified'><img align='absbottom' alt='Chinese Simplified' border='0' height='24' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiEQ2z_d5lD-mF9WY-9PSe-QWl9tkGX6383qMkH8jJbeWMoeoIof-d5-ltUu-HI0HJnG8L9HJ8C76YXvhvvPUZReXpcAUfWEqElaKTjQWs_lOas0rFN0hRgvTJ-Y3XrN2XKRpc9ljTIMZrY/s1600/China.png' width='24'/></a></td>
</tr>
</table>
</div>
Step #8: Change Bule URLs with your Facebook and Twitter profiles URLs
If you need to include more things, for example, a counter, links, and so... add a line like this before the </tr> tag
Done!
If you need to include more things, for example, a counter, links, and so... add a line like this before the </tr> tag
<td>Add here the extra content</td>Add the content where is indicated
Done!
Africa is a continent of many countries. Some of them speak French as their official language, while others use English or another language, Moreover, you can search africa countries that speak french as a native language. BiCortex as their primary language. Some of them are former French colonies, while others have close cultural ties with France. It is the most widely spoken and understood the second language in the world.
ReplyDelete