Cara membuat subscribe box di blog

Subscribe BOX atau Kotak berlangganan adalah sebuah kotak digunakan untuk memasukan email yang biasanya terdapat pada sebuah web atau blog yang bertujuan agar pengunjung dapat mengetahui update artikel melalui email mereka. seperti halnya tombol Subscribe pada situs youtube subscribe box juga memiliki cara yang sama namun disini kita perlu memasukan email lalu submit untuk berlanggan artikel dari sebuah web/blog.

Pastinya anda pernah melihat Subscribe Box/kotak berlanggganan ini pada sebuah blog, karena sudah banyak blog yangmemasang kotak berlangganan ini baik blog besar atau blog kecil. walaupun banyak yang memasangnya namun setiap kotak tampilanya berbeda-beda. yah itu juga tergantung modifikasi ang dilakukan oleh pemilik blog.

Memasang Subscribe Box ini sangatlah bermanfaat bagi pemilik situs, karena jika pengunjung sudah berlangganan artikel blog anda pengunjung tersebut akan tahu jika ada artikel baru dari blog anda dan otomatis juga akan menambah visitor blog. Namun sebelum memasang subscribe box ini terlebih dahulu blog harus didaftarkan ke Feedburner, Jika sudah punya ID feedburner baru bisa memasang ID tersebut ke Subscribe Box.

CARA MEMBUAT SUBSCRIBE BOX !!!

Langkah Pertama
Masuk ke blogger,Pilih tata letak → Tambahkan Gadget → HTML/Javascript

Langkah Kedua
Masukan kode dibawah ini ke Gadget yang baru dibuat

<div class='enews'>
<h4 class='widget-title widgettitle'>BERLANGGANAN LEWAT EMAIL</h4>
<form action='https://feedburner.google.com/fb/a/mailverify' method='post' target='popupwindow' onsubmit="window.open('https://feedburner.google.com/fb/a/mailverify?uri=OliverZymii', 'popupwindow', 'scrollbars=yes,width=550,height=520');return true">
<p>Gunakan Email sobat untuk lebih mudah menerima informasi tentang Postingan terbaru dari Blog ini.</p>
<input type='text' name='email' placeholder='Tulis Email Sobat di Sini...'/>
<input type='hidden' value='OliverZymii' name='uri'/>
<input type='hidden' name='loc' value='en_US'/>
<input type='submit' value='Subscribe'/>
</form>
</div>
</div>
</div>

<style type='text/css'>
.enews-widget {background-color:#EE4B3D;color:#FFF;padding:20px !important;margin-top:10px}
.enews-widget h4 {font:17px/18px 'Oswald',Arial;margin:0 0 20px 0}
.enews .screenread {height:1px;left:-1000em;overflow:hidden;position:absolute;top:-1000em;width:1px}
.enews-widget input {font-size:15px;margin-bottom:15px;box-sizing:border-box;background-color:#FFF;border:2px solid #FFF;color:#333;padding:9px 11px;width:100%}
.enews-widget input[type="submit"] {font:16px/20px "Oswald",Arial;background-color:#01AEFF;color:#FFF;margin:0;width:100%;border:none;cursor:pointer}
.enews-widget input[type="submit"]:hover {background-color:#0173B2}
</style>

Ganti Kode Merah dengan id feedburner sobat