Cara Memasang Flag Counter di Blogspot

Flag counter adalah sebuah aplikasi sederhana yang berfungsi menampilkan jumlah pengunjung blog beserta asal negara mereka melalui ikon bendera. Selain informatif, fitur ini juga memberi sentuhan visual yang menarik pada tampilan blog.

Pemasangan flag counter di Blogspot tergolong mudah dan tidak membutuhkan kemampuan teknis khusus. Kamu hanya perlu mengikuti beberapa langkah berikut secara berurutan.

Langkah 1: Kunjungi situs Flag Counter
Buka situs resmi penyedia layanan flag counter di flagcounter.com.

Langkah 2: Atur tampilan flag counter
Isi pengaturan sesuai kebutuhan blog kamu, antara lain:

• Maximum Flag To Show: jumlah bendera negara yang ingin ditampilkan.
• Columns Of Flag: jumlah kolom bendera.
• Label On Top Of Counter: judul atau nama counter.
• Background Color: warna latar counter.
• Text Color: warna teks.
• Border Color: warna garis tepi.
• Show Country Flag: menampilkan kode negara.
• Show Pageview: menampilkan jumlah halaman yang dikunjungi.

Langkah 3: Pratinjau hasil
Di bagian bawah halaman terdapat contoh bertajuk “Example Flag Counter With Your Choices”. Pastikan tampilannya sudah sesuai dengan keinginan kamu.

Langkah 4: Ambil kode flag counter
Jika sudah sesuai, klik tombol “Get Your Flag Counter” lalu salin kode yang tersedia pada bagian “Code For Website”.

Langkah 5: Pasang di Blogger
Masuk ke Blogger → Dashboard Blog → Rancangan/Layout → Elemen Laman/Page Element.

Langkah 6: Tambahkan gadget
Klik Add Gadget, pilih HTML/Javascript, lalu tempelkan kode flag counter ke dalam kolom yang tersedia.

Langkah 7: Simpan perubahan
Klik Save untuk menyimpan pengaturan. Flag counter akan langsung tampil di blog kamu.

Dengan mengikuti langkah-langkah di atas, kamu bisa mengetahui asal pengunjung blog sekaligus mempercantik tampilan sidebar secara fungsional dan rapi.

 

 

Read More

Cara Memasang Chatbox Buka–Tutup di Blogspot

Konten yang informatif dengan tampilan blog yang rapi dan komunikatif berpeluang besar mendatangkan banyak pengunjung. Salah satu fitur sederhana yang bisa meningkatkan interaksi pembaca adalah chatbox.

Agar tidak memakan banyak ruang, chatbox sebaiknya dibuat bisa dibuka dan ditutup. Dengan begitu, blog tetap terlihat bersih dan nyaman dibaca.

Berikut tutorial memasang chatbox buka–tutup di Blogger.

 Membuat Akun Chatbox

Langkah pertama, buat akun chatbox di situs www.cbox.ws. Ikuti proses pendaftaran hingga selesai, lalu salin kode script chatbox yang diberikan.

 Masuk ke Dashboard Blogger

Login ke akun Blogger kamu, lalu masuk ke menu Rancangan / Layout. Pilih Elemen Laman / Page Elements, kemudian klik Tambah Gadget dan pilih HTML/Javascript.

Memasang Script Chatbox

Salin dan tempel script berikut ke dalam kotak HTML/Javascript. Pastikan struktur kode tidak diubah. Kamu hanya perlu mengganti bagian kode chatbox Cbox dengan script milikmu sendiri.

<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/AVvXsEjYXIDUoOod62YzQCgEBu6TAKtCFlkYIiT2eUOsK4w9SiRGKlmCYL-qEac3-u7bgW3jnC6xIlwNJm7CLH-FYnzQI-cQ2IIrGPS9eHAB6CxqJAMDFzlLlI237hK9szRubULCIHULen4zY6Xa/s1600/cbred.png') no-repeat;

}

.gbcontent{

float:left;

border:6px solid #B40404;

background:#F7F8E0;

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">

 

<!-- KODE SCRIPT CBOX ANDA -->

 

<br />

<a href="javascript:showHideGB()">[Hide]</a>

 </div>

</div>

 <script type="text/javascript">

var gb = document.getElementById("gb");

gb.style.right = (30-gb.offsetWidth).toString() + "px";

</script>

 

Menyimpan Perubahan

Jika semua langkah sudah dilakukan, klik Simpan / Save. Chatbox buka–tutup akan langsung tampil di blog kamu.

 Keterangan Tambahan

• Bagian kode chatbox harus diganti dengan script Cbox milikmu sendiri.
• Gambar tombol buka–tutup bisa diganti dengan mengubah URL gambar pada bagian CSS.

Read More