Kamis, 15 Maret 2018

Cara Membuat Buku Tamu Di Blog

Buku tamu / Guest book adalah widget yang lumayan penting di blog karena dapat berfungsi untuk chatting / komunikasi baik dengan pengunjung ataupun untuk para blogger yang biasanya ingin blogwalking / meninggalkan jejak dengan menaruh link blognya di buku tamu agar bisa saling mengunjungi dan pastinya juga bisa menambah traffic blog sobat. Gadget buku tamu yang biasa dipakai pada blogger, wordpress maupun website adalah cbox, shoutbox dan shoutmix, tapi disini kita akan membuat guest book tersebut dengan menggunakan cbox yang keren, mudah digunakan dan free tanpa bayar.

Cara Membuat Buku Tamu Di Blog Gratis Terbaru



Cara Memasang Buku Tamu Di Blog Terbaru :

1. Pertama sobat bisa mendaftar / daftar akun cbox dengan cara buka situs web www.cbox.wslalu klik Sign up

Cara Membuat Buku Tamu Di Blog Gratis Terbaru

2. Kemudian isi kotak pendaftaran seperti cbox name (tidak boleh pakai spasi), email address (alamat email), password, confirm password dan website sobat serta centang "I agree to the Cbox terms and cconditions of service" jika sudah klik Create my Cbox!

Cara Membuat Buku Tamu Di Blog Gratis Terbaru

3. Cbox Created, akun sobat telah terbuat lalu klik Log in untuk masuk ke dalam Cbox

Cara Membuat Buku Tamu Di Blog Gratis Terbaru

4. Setelah itu masukkan Account name dan password yang tadi baru dibuat lalu klik Log in

Cara Membuat Buku Tamu Di Blog Gratis Terbaru

5. Maka akan muncul halaman cbok sobat lalu scroll ke bagian bawah untuk mendapatkan kode nya

Cara Membuat Buku Tamu Di Blog Gratis Terbaru

6. Berikut embed code cbox, silahkan copy kode tersebut

Cara Membuat Buku Tamu Di Blog Gratis Terbaru

7. Kemudian masuk ke blogger sobat lalu klik Laman baru pada Menu Laman / Pages untuk membuat buku tamu di halaman blog

Cara Membuat Buku Tamu Di Blog Gratis Terbaru

8. Isi Judul lalu klik mode HTML dan masukkan kode cbox sobat ( yang di kotak biru untuk mengatur lebar silahkan ganti menjadi 280px atau sesuai yang diinginkan ), jika sudah klik Publikasikan

Cara Membuat Buku Tamu Di Blog Gratis Terbaru

9. Maka halaman guest book sobat telah terbuat klik Lihat untuk melihat hasilnya

Cara Membuat Buku Tamu Di Blog Gratis Terbaru

10. Selain membuat buku tamu cbox di halaman blog, sobat juga bisa menaruh / meletakkan widget tersebut pada sidebar atau footer blog dengan cara pilih Menu Tata letak lalu pada bagian sidebar / footer klik Tambahkan Gadget

Cara Membuat Buku Tamu Di Blog Gratis Terbaru

11. Maka akan muncul tampilan berikut lalu klik tombol tambah pada HTML/JavaScript

Cara Membuat Buku Tamu Di Blog Gratis Terbaru

12. Kemudian isi judul dan masukkan kode cbox sobat lalu klik simpan maka buku tamu cbox akan tampil di sidebar / footer blog sobat

Cara Membuat Buku Tamu Di Blog Gratis Terbaru

13. Atau sobat juga bisa membuat buku tamu tersembunyi pada samping kanan blog dengan cara seperti di atas masuk ke Menu Tata Letak > klik Tambahkan Gadget pada bagian footer > pilih HTML/Javascript kemudian untuk judul tidak usah diisi lalu masukkan kode di bawah ini (ganti tulisan warna biru dengan kode cbox milik sobat) jika sudah klik Simpan

<style type="text/css">
#gb{
position:fixed;
top:10px;
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/AVvXsEitpd1PH2ZZW_cdhuvit6Ncrk8lcNOkt8nXbIQCVT6HHG7bW9Ew4e5B7tb05ohtwV5u1X4tSsNO_vIZUlbGGWbOCIHGxwDQeRiYdetWIQeuCSbubAXBN8-vJW1G77DKIVqrWsq93X0mpdEs/') 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">
<!-- BEGIN CBOX - www.cbox.ws - v001 -->
Code cbox milik sobat
<!-- END CBOX -->

<script type="text/javascript">
var gb = document.getElementById("gb");
gb.style.right = (30-gb.offsetWidth).toString() + "px";
</script></div></div>


14. Terakhir klik Simpan setelan.. Selesai

Tidak ada komentar:

Posting Komentar

cara konfigurasi DNS server

Nama : Bunga Syah Fitri Dewi Kelas : XII - TKJ 3 Cara Konfigurasi DNS Server Sebelum  membuat atau konfigurasi dns server di linux...