Membuat Formulir Berlangganan Lucu dan Menarik

Saya akan berbagi banyak tutorial pada bentuk Berlangganan RSS seperti Formulir Berlangganan Email.Kali ini akan dibagikan tampilan berlangganan RSS yang simpel serta tentunya akan menarik pengunjung tertarik untuk berlangganan artikel kita. Langsung saja pada TKB.

Seperti yang pernah saya berikan triks untuk Cara Mengubah Feedburner Chicklets Pada Blog, yang mungkin banyak digunakan oleh pemilik-pemilik blog. Bahkan caranya tidak terlalu ribet seperti pada tutorial-tutorial sebelumya. Ikuti aja langkahnya sebagai berikut:

Login Blogger anda;

Pilih Rancangan;

Klik tab Tambahkan Elemen (Gadget)

Pilih HTML/JavaScript;

Copy paste kode dibawah kedalam HTML tersebut;

Lalu Simpan, selesai.

<style>
.kod-email{
background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgL0mXmKc0JbdbzBpM0u7zs6n8rLDG34b5Ha_6cS0nZXxAAqNH-EGSI1NpPw2_9wivtz_HwVHNy_U3wzX2EdzhO7XgpmvyRvMEeW6ieyExPmTf1Uv7iwqHpWYp4SPlg_bszNaztecxdULsj/s1600/email.png) no-repeat 0px 12px ;
width:300px;
padding:10px 0 0 55px;
float:left;
font-size:1.4em;
font-weight:bold;
margin:0 0 10px 0;
color:#686B6C;
}
.kod-emailsubmit{
background:#9B9895;
cursor:pointer;
color:#fff;
border:none;
padding:3px;
text-shadow:0 -1px 1px rgba(0,0,0,0.25);
-moz-border-radius:6px;
-webkit-border-radius:6px;
border-radius:6px;
font:12px sans-serif;
}
.kod-emailsubmit:hover{
background:#E98313;
}
.textarea{
padding:2px;
margin:6px 2px 6px 2px;
background:#f9f9f9;
border:1px solid #ccc;
resize:none;
box-shadow:inset 1px 1px 1px rgba(0,0,0,0.1);
-moz-box-shadow:inset 1px 1px 1px rgba(0,0,0,0.1);
-webkit-box-shadow:inset 1px 1px 1px rgba(0,0,0,0.1); font-size:13px;
width:170px;
color:#666;}
</style>
<div class="kod-email">
Subscribe via Email <form action="http://feedburner.google.com/fb/a/mailverify" id="feedform" method="post" target="popupwindow" onsubmit="window.open('http://feedburner.google.com/fb/a/mailverify?uri=KangOnkDesign', 'popupwindow', 'scrollbars=yes,width=550,height=520');return true">
<input gtbfieldid="3" class="textarea" name="email" onblur="if (this.value == "") {this.value = "Enter email address here";}" onfocus="if (this.value == "Enter email address here") {this.value = "";}" value="Enter email address here" type="text" />
<input type="hidden" value="KangOnkDesign" name="uri"/><input type="hidden" name="loc" value="en_US"/>
<input class="kod-emailsubmit" value="Submit" type="submit" />
</form>
</div>

Catatan penting : rubahlah http://feedburner.google.com/fb/a/mailverify?uri=KangOnkDesign dengan Feedburner Email Feed link anda. Anda bisa mendapatkannya dengan mengunjungi account feedburner kemudian arahkan ke Publikasikan dan kemudian ke Email Subscriptions.

Ganti KangOnkDesign dengan judul feed anda. Ini muncul di akhir link feed anda. Dalam kasus saya ini adalah http://feedburner.google.com/fb/a/mailverify?uri=KangOnkDesign

Semoga bermanfaat....