Mungkin kebanyakan orang sudah banyak yang tahu tentang tutorial ini, tapi buat yang belum tahu tenang aja, karena kali ini saya akan memberikan tutorial yang paling gampang untuk di ikuti. Dan saya yakin seorang pemula seperti saya sekalipun bisa melakukannya.
Ikuti langkah berikut:
- masuk dulu ke akun Blog anda,
- kemudian klik rancangan--Page Elements,
- kemudian klik Add Gadget setelah muncul halaman baru pilih saja HTML/Java Script. Kemudian copy kode berikut lalu letakan di dalamnya.
<style type="text/css">
#gb{
position:fixed;
top:100px;
z-index:+1000;
}
* html #gb{position:relative;}
.gbtab{
height:100px;
width:30px;
float:left;
cursor:pointer;
background:url('https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhnWxnHhBfCce4R_I-CJBamUwmUrIimxuxOcrXqmj9jskY5hv_KDSzpPNlPomdkf4HWSVZlxjYLhsJ_fCvUZ4t1VI2GyJ_3asM6DQsbik7eb0dCi0OAmmPwrI5G8WzOxw2QX7Srd1rT39-9/') no-repeat;
}
.gbcontent{
float:left;
border:2px solid #A5BD51;
background:#F5F5F5;
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.right = x.toString() + "px";
if(x0!=xf){setTimeout("moveGB("+x+", "+xf+")", 10);}
}
</script>
<div id="gb">
<div class="gbtab" onclick="showHideGB()"> </div>
<div class="gbcontent">
<br />
<a href="http://trik-tutorials.blogspot.com/" title="Internet trik and tutorial">MyBlog</a>
<div style="text-align:right">
<a href="javascript:showHideGB()">
[close]
</a>
</div>
</div>
</div>
<script type="text/javascript">
var gb = document.getElementById("gb");
gb.style.right = (30-gb.offsetWidth).toString() + "px";
</script>
Udah deh selesai, gampangkan kan.?
kalau ada sedikit kekeliruan pada kode silahkan memberi komentar ya..
Selamat mencoba dan semoga sukses buat anda..!!!
BACA JUGA!
- Tabel kode warna css
- Cara mudah Memasang shoutmix bersama
- Cara memasang widget alexa pada blog
- Cara meningkatkan alexa rank blog
- membuat kotak daftar isi blog
- Cara Mengukur seberapa berat blog/web kamu
- Cara supaya domain co.cc bisa diakses tanpa www(redirect tanpa www)
- Merubah Domain Blogspot menjadi co.cc
- Membuat scroll pada komentar blog
- Fungsi Gadget Followers pada Blog
- Cara mudah memasang meta tag blogger
- Mengubah tampilan iklan kumpulblogger
- Cara membuat label menjadi berwarna
- Membuat widget hanya muncul pada postingan
- Cara membuat daftar isi otomatis pada blogger
- Membuat Menu Horisontal pada blogger
- Membuat Breadcrumb Navigation pada blogger
- Cara membuat widget hanya tampil di homepage
- bertukar link dengan adil
- Membuat 3 kolom element dibawah header
- Membuat dua element dibawah header
- Cara menghapus komentar blog
- Cara membuat navbar auto hidden