Andilangodang – Di postingan yang ke sekian kali saya masih akan membagikan kode script yang mungkin akan Anda terapkan di blog Anda sekalian. Dan sesuai judul postingan kali ini yaitu Cara Memasang Informasi bar di blog, script ini berfungsi sebagai pemberitahuan dini bagi pengunjung dan berisi pesan atau informasi mengenai blog. Munculnya bar ini bisa dihilangkan apabila mungkin pengunjung tidak membutuhkannya dengan meng-klik pesan tersebut.
Berikut screen shot contoh informasi bar yang saya maksudkan :
Cara pasangnya : Login ke blogger > Tata Letak > Tambah Gadget > HTML/ Javascript dan Copy kode script berikut :
ini Scriptnya :
Ganti Warna Merah dengan keinginan anda.
Sumber : Masbugie.com
Berikut screen shot contoh informasi bar yang saya maksudkan :
Cara pasangnya : Login ke blogger > Tata Letak > Tambah Gadget > HTML/ Javascript dan Copy kode script berikut :
ini Scriptnya :
<style type="text/css">
#informationbar{
position: fixed;
left: 0;
width: 100%;
text-indent: 5px;
padding: 3px 0;
background-color: YELLOW;
border-bottom: px solid black;
font: bold 12px Verdana;
}
* html #informationbar{ position: absolute;
width: expression(document.compatMode=="CSS1Compat"? document.documentElement.clientWidth+"px" : body.clientWidth+"px");
}
</style>
<script type="text/javascript">
/***********************************************
* Animated Information Bar on http://www.masbugie.com
***********************************************/
function informationbar(){
this.displayfreq="always"
this.content='<a href="javascript:informationbar.close()">'
}
informationbar.prototype.setContent=function(data){
this.content=this.content+data
document.write('<div id="informationbar" style="top: -500px">'+this.content+'</div>')
}
informationbar.prototype.animatetoview=function(){
var barinstance=this
if (parseInt(this.barref.style.top)<0){
this.barref.style.top=parseInt(this.barref.style.top)+5+"px"
setTimeout(function(){barinstance.animatetoview()}, 50)
}
else{
if (document.all && !window.XMLHttpRequest)
this.barref.style.setExpression("top", 'document.compatMode=="CSS1Compat"? document.documentElement.scrollTop+"px" : body.scrollTop+"px"')
else
this.barref.style.top=0
}
}
informationbar.close=function(){
document.getElementById("informationbar").style.display="none"
if (this.displayfreq=="session")
document.cookie="infobarshown=1;path=/"
}
informationbar.prototype.setfrequency=function(type){
this.displayfreq=type
}
informationbar.prototype.initialize=function(){
if (this.displayfreq=="session" && document.cookie.indexOf("infobarshown")==-1 || this.displayfreq=="always"){
this.barref=document.getElementById("informationbar")
this.barheight=parseInt(this.barref.offsetHeight)
this.barref.style.top=this.barheight*(-1)+"px"
this.animatetoview()
}
}
window.onunload=function(){
this.barref=null
}
</script>
<script type="text/javascript">
var infobar=new informationbar()
infobar.setContent('SELAMAT DATANG DI Lan News , JIKA ANDA INGIN BERLANGGANAN ARTIKEL LAINNYA SILAHKAN KLIK' <a href="http://www.andilangodang.co.cc">DISINI</a>')
infobar.initialize()
</script>
#informationbar{
position: fixed;
left: 0;
width: 100%;
text-indent: 5px;
padding: 3px 0;
background-color: YELLOW;
border-bottom: px solid black;
font: bold 12px Verdana;
}
* html #informationbar{ position: absolute;
width: expression(document.compatMode=="CSS1Compat"? document.documentElement.clientWidth+"px" : body.clientWidth+"px");
}
</style>
<script type="text/javascript">
/***********************************************
* Animated Information Bar on http://www.masbugie.com
***********************************************/
function informationbar(){
this.displayfreq="always"
this.content='<a href="javascript:informationbar.close()">'
}
informationbar.prototype.setContent=function(data){
this.content=this.content+data
document.write('<div id="informationbar" style="top: -500px">'+this.content+'</div>')
}
informationbar.prototype.animatetoview=function(){
var barinstance=this
if (parseInt(this.barref.style.top)<0){
this.barref.style.top=parseInt(this.barref.style.top)+5+"px"
setTimeout(function(){barinstance.animatetoview()}, 50)
}
else{
if (document.all && !window.XMLHttpRequest)
this.barref.style.setExpression("top", 'document.compatMode=="CSS1Compat"? document.documentElement.scrollTop+"px" : body.scrollTop+"px"')
else
this.barref.style.top=0
}
}
informationbar.close=function(){
document.getElementById("informationbar").style.display="none"
if (this.displayfreq=="session")
document.cookie="infobarshown=1;path=/"
}
informationbar.prototype.setfrequency=function(type){
this.displayfreq=type
}
informationbar.prototype.initialize=function(){
if (this.displayfreq=="session" && document.cookie.indexOf("infobarshown")==-1 || this.displayfreq=="always"){
this.barref=document.getElementById("informationbar")
this.barheight=parseInt(this.barref.offsetHeight)
this.barref.style.top=this.barheight*(-1)+"px"
this.animatetoview()
}
}
window.onunload=function(){
this.barref=null
}
</script>
<script type="text/javascript">
var infobar=new informationbar()
infobar.setContent('SELAMAT DATANG DI Lan News , JIKA ANDA INGIN BERLANGGANAN ARTIKEL LAINNYA SILAHKAN KLIK' <a href="http://www.andilangodang.co.cc">DISINI</a>')
infobar.initialize()
</script>
Ganti Warna Merah dengan keinginan anda.
Sumber : Masbugie.com