Cara Membuat Kotak Subscribe di Blogger

Ketika kita sudah memiliki ciri khas blog kita dan telah memiliki pembaca setia tetapi bagaimana cara memberitahukan ke pelanggan setia kita bahwa artikel yang kita buat sudah update.

Nah hal ini bisa kita akali dengan menggunakan fitur berlangganan yang terdapat di FeedBurner. Apa itu FeedBurner?, Saya akan menjelasakan secara singkat saja.

FeedBunner merupakan sebuah layanan blogging yang berbasis web atau web based tools. FeedBurner juga memiliki salah satu layanan yang fungsinya membantu agar pemilik blog untuk mempromosikan situsnya setiap kali mereka menerbitkan sebuah artikel baru. Dengan menggunakan salah satu alat untuk berlangganan pada situs blog agar pembaca setia bisa melakukan subscribe atau berlanganan.

Jika kalian masih penasaran dengan FeedBurner silahkan Baca : Apa itu FeedBurner dan Fungsinya

Setelah memahami apa itu feedburner sekarang waktunya membuat widget subscribe untuk pelanggan setia supaya berlangganan pada blog anda tetapi bagaimana cara membuatnya.

Jadi pada artikel kali ini saya akan memberikan sebuah cara membuat widget subscribe untuk blog dengan menggunakan FeedBurner. Yup mari kita langsung saja tanpa basa-basi.

Kotak berlangganan atau subscribe artikel bagi blogger memiliki banyak fungsi. Apalagi bagi blogger yang memiliki jumlah pengunjungnya cukup tinggi.

Sebelum membuat widget tersebut kalian harus sudah memiliki akun dari FeedBurner tersebut jika belum kalian harus membuat akun FeedBurner Terlebih dahulu. Jika belum tahu cara membuat akunnya silahkan klik disini

Baik mari kita mulai :

1. Buka Website https://feedburner.google.com dan login menggunakan akun feed kalian, Jika kalian mempunyai banyak blog yang sudah di daftarkan pilih salah satu mana yang ingin anda buat widget subscribe tersebut.

Masuk ke FeedBurner

2. Setelah masuk ke feed yang akan kita gunakan sekarang klik atau pindah ke menu Publicize.

Memilih Publicize menu

3. Selanjutnya di situ terdapat banyak menu layanan atau service pilih atau klik menu Email Subscription, Kemudian klik activate untuk mengaktifkan layanan subscribe tersebut.

Aktifkan layanan Subscribe

4. Jika sudah copy kode yang di atasnya untuk di gunakan sebagai form subscribe yang akan di gunakan.

Copy Kode kotak Subscribe

5. Kemudian Masuk ke Blogger dan paste kode tersebut. Kalian bisa mempaste kode tersebut di layout atau di tempat yang menurut kalian cocok.

Kalau gak mau ribet kalian bisa langsung mencopy script berikut dan letakan di bawah badan post atau di widget baru dengan menggunakan widget html/javascript.

<!-- kotak berlangganan email feedburner -->
<div class="subscribe-box">
<form action="https://feedburner.google.com/fb/a/mailverify" method="post" onsubmit="window.open('https://feedburner.google.com/fb/a/mailverify?uri=URLFEED', 'popupwindow', 'scrollbars=yes,width=550,height=520');return true" target="popupwindow">
Berlangganan update artikel terbaru via email:<br />
<input class="email-address" name="email" placeholder="Masukan alamat email..." type="text" />

<input name="uri" type="hidden" value="URLFEED" />
 <input name="loc" type="hidden" value="en_US" />
 <br />
<input class="submit-email" type="submit" value="Berlangganan" /></form>
</div>

Edit ID feedburner URLFEED Kalian di atas dengan ID feedburner milik kalian

Setelah kalian mencopy code tersebut selanjutnya memasang style agar terlihat lebih menarik. Buka editor tema di blogger dan kemudian cari kode HTML <style> untuk memudahkan tekan ctrl+f dan cari kode tersebut kemudian copy kode berikut sesudah kode <style>

/* SUBSCRIBER BOX */
.subscribe-box {
 background: #f8f8f8;
    padding: 15px;
    margin: 20px 0;
    text-align: center;
    border: 1px solid #efefef;
}
.subscribe-box p {
 margin:15px 0;
}
.subscribe-box input.email-address[type="text"] {
 width: 60%;
    padding: 10px;
    border: 1px solid #efefef;
    text-align: center;
    border-radius: 2px;
    outline: none;
}
.subscribe-box input.submit-email[type="submit"] {
    transition: all 0.5s;
    -moz-transition: all 0.5s;
    -webkit-transition: all 0.5s;
    padding: 10px 15px;
    border-radius: 2px;
    color: #444;
    border: none;
    outline: none;
    border: 1px solid #c7c7c7;
}
.subscribe-box input.submit-email[type="submit"]:hover {
 background:#f8f8f8;
 cursor:pointer;
}
.subscribe-box input.email-address[type="text"]:focus {
 background: #f9f2a5;
}

Jika template kalian tidak ada kode tersebut kalian bisa mencari kode <b:skin> karena kode tersebut merupakan pengganti dari kode <style>.


Nah jika selesai simpan tema dan lihat kotak subscribe sudah selesai.