Shoutbox/Buku Tamu Show-Hide Di Samping Kanan Blog
Rabu, 19 Januari 2011
-
11:36 AM
|
12
Comments |
Rezkiji
|
Edit Entri
Bagaimana Caranya Membuat Buku Tamu Atau Shoubox yang Kita Miliki Posisinya Berada Di samping Page Sheet Blog kita???
Mau tau Caranya?? Namun Kita Harus Tau Lebih Dulu Apa Keuntungannya,,Menurut saya Jika Shoutbox/Buku tamu posisinya Show/Hide di samping kanan blog kita,itu akan mengurangi tempat di sidebar,,dan lebih memperindah blog kita (menurut saya sebagai pemula).
Ini di Caranya :
1. Silahkan Masuk Ke akun Blogspot anda dengan email dan password sendiri (: ,,setelah berada di Dsahboard klik Desaign
2. Pilih Posisi sidebar Dimana aja (tanpa mengisi kolom judul)
3. Klik Add a Gadget -->Pilih HTML/Javascript
4. Copy dan Paste kode berikut Di Kolom HTML/JavaScript :
Keterangan :
5. Klik Save dan lihat hasilnya
Contoh:
Mau tau Caranya?? Namun Kita Harus Tau Lebih Dulu Apa Keuntungannya,,Menurut saya Jika Shoutbox/Buku tamu posisinya Show/Hide di samping kanan blog kita,itu akan mengurangi tempat di sidebar,,dan lebih memperindah blog kita (menurut saya sebagai pemula).
Ini di Caranya :
1. Silahkan Masuk Ke akun Blogspot anda dengan email dan password sendiri (: ,,setelah berada di Dsahboard klik Desaign
2. Pilih Posisi sidebar Dimana aja (tanpa mengisi kolom judul)
3. Klik Add a Gadget -->Pilih HTML/Javascript
4. Copy dan Paste kode berikut Di Kolom HTML/JavaScript :
<style type="text/css">
#gb{
position:fixed;
top:50px;
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/AVvXsEhHVDH8rCzu2hlZDUbSg8WjGRM9HDnx1tLtogYCC_NSZ2LDzpNWkYAxnG1NOjxAk1K5jsX-u-JtjIrD9l7AW2h6kqKqwUJIOX8q9Jdn7gPh7hYyB1b0gBzBlhDNyf9ZXxWraTlO1f_coZAn/') 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">
<!-- Letakkan kode buku tamu anda di bawah ini -->
<div style="text-align:right">
<a href="javascript:showHideGB()">
[close]
</a>
</div>
</div>
</div>
<small>Widget by: <a href="http://rezdown7.blogspot.com/" target="_blank">Rezdown7</a></small>
<script type="text/javascript">
var gb = document.getElementById("gb");
gb.style.right = (30-gb.offsetWidth).toString() + "px";
</script>
Keterangan :
- Kode Yang Berwarna Hijau Silhakan Anda Ganti dengan Tombol/gambar anda Sendiri,,Jika Tidak ingin pun Tidak apa2
- Kode Yang Berwarna Biru adalah untuk warna Border = Warna Garis Pinggir ,, Background = Warna Latar belakang.
- Kode Yang Berwarna Merah sesuai bacanya <!-- Letakkan kode buku tamu anda di bawah ini --> Silahkan Anda sisipkan Kode Shoutmix/bukutamu anda Di Bawah Kode Yang Berwarna Merah Tersebut.
5. Klik Save dan lihat hasilnya
Langganan:
Posting Komentar
(
Atom
)
Entri Populer
- Jadwal Pertandingan Timnas Indonesia Senior, U-23 Dan U-19 | Update Terbaru
- Cara Menampilkan Gambar Di File Explorer Windows 10 - Thumbnail
- Daftar Kode Warna | HTML
- Daftar Agen Tiket Pesawat Termurah - Velosita
- Trik Mengetahui Jumlah Download Pada File Hosting - Google Drive
- Download Windows7 Starter Untuk Netbook | 32 Bit
- Cara Mudah Install Ubuntu 12.04 LTS Dual Boot Dengan Windows7
- Cara Membuat Halaman Scroll Di Blog | HTML
- Followers | RezDown7.Com
- Marco Simoncelli Meninggal Dunia
nice trick sob..bleh dicoba ya..
BalasHapus@Adrian makasi sob,,iya silhkan :D
BalasHapusmakasih banyak gan!
BalasHapusWah sukses niee, thanks ea
BalasHapuspertanyaannya gmana caranya biar turun sedikit soalnya itu di blog ku terlalu tinggi???
@Pramuka Smanab cari kode ini gan top:50px; (bgian atas)
BalasHapusklo udh ketemu ubah angkanya sesuai yg dibutuhkan.
kembali lgi klo gk ada perubahan :)
terima kasih mas , bisa menjadi Bimbingan Untuk Belajar atau bisa sebagai referensi blog ini, semangat Anak indonesia
BalasHapusmakasih kang infonya
BalasHapushttp://adutburza.blogspot.com/
ww.giribig.com
duniagame.info
idcheat.com
Buku tamunya bagus cocok untuk dipasang diblog ane :)
BalasHapusSalah satu mobil terlaris dikelas mpv adalah Suzuki Ertiga, info kredit mobil suzuki cekidot di http://suzukimobilkeren.blogspot.com
Artikel yang bagus, buku tamu dapat memperindah blog
BalasHapusKomentar ini telah dihapus oleh administrator blog.
BalasHapussalam sukses ya kak
BalasHapusgood job post
BalasHapus