Float Top Bar ini biasanya berisi Content Iklan ataupun sebuah Form SubScribe. Menurut saya posisi ini adalah posisi yang bagus untuk memasangkan iklan advertiser karena pasti pertama terlihat oleh pengunjung Website atau Blog kita.
Preview :
Jika anda ingin memasangnya juga silahkan ikuti langkah-langkah pembuatannya :
1. Login ke Blogger
2. Masuk ke Tab Layout
3. Pilih Elemen Halaman
4. Tambah Gadget Pilih HTML / JAVASCRIPT
5. Dan copy kode di bawah ini kedalamnya
6. Simpan
2. Masuk ke Tab Layout
3. Pilih Elemen Halaman
4. Tambah Gadget Pilih HTML / JAVASCRIPT
5. Dan copy kode di bawah ini kedalamnya
<style type="text/css">
#gb{
position:fixed;
top:10px;
z-index:+1000;
}
* html #gb{position:relative;}
.gbcontent{
float:right;
border:2px solid #A5BD51;
background:#ffffff;
padding:10px;
}
</style>
<script type="text/javascript">
function showHideGB(){
var gb = document.getElementById("gb");
var w = gb.offsetWidth;
gb.opened ? moveGB(0, 30-w) : moveGB(20-w, 0);
gb.opened = !gb.opened;
}
function moveGB(x0, xf){
var gb = document.getElementById("gb");
var dx = Math.abs(x0-xf) > 10 ? 5 : 1;
var dir = xf>x0 ? 1 : -1;
var x = x0 + dx * dir;
gb.style.top = x.toString() + "px";
if(x0!=xf){setTimeout("moveGB("+x+", "+xf+")", 10);}
}
</script>
<div id="gb">
<div class="gbtab" onclick="showHideGB()"> </div>
<div class="gbcontent">
<div style="text-align:right">
<a href="javascript:showHideGB()">
.:[Close][Klik 2x]:.</a>
</div>
<center>
Masukan Kode iklan atau Gambar yang anda inginkan di sini
</center>
<script type="text/javascript">
var gb = document.getElementById("gb");
gb.style.center = (30-gb.offsetWidth).toString() + "px";
</script></center></div></div>
Untuk tulisan berwarna merah, bisa anda ganti dengan kode iklan, gambar ataupun tulisan yang diinginkan, tulisan berwarna biru adalah text bacaan pada tombol close. Sebenerna tulisan berwarna biru adalah penjebakannya, karena iklan akan close hanya sekali klik saja, jadi apabila 2x klik otomatis iklan juga ke klik.
Update:
Update:
- Tulisan berwarna kuning adalah jarak kotak iklan. Bisa anda tambahkan kode right: ..px atau left: ..px atau bottom: ..px (titik-titik dapat anda ganti dengan angka)
- Tulisan berwarna ungu (z-index:+1000) adalah posisi iklan. z-index:+1000 posisi iklan berada di atas, dapat anda ganti menjadi y-index:+1000.
- Kode berwarna hijau adalah kode warna garis pinggir kotak iklan (border). Anda dapat melihat kode warna DISINI