Farhan Share, Membuat Email Subscription Sederhana di Blog- Sobat farhan memang sekarang ini blogger banyak sekali menggunakan berbagi macam jenis tampilan form email subscription, mulai dari form asli feedburner, sampai yang tampilan dan bentuk form-nya lebih menarik, yaitu dengan cara diedit terlebih dahulu sehingga menjadi widget yang lebih animatif dan kreatif. Sobat farhan, berbeda dengan postingan farhan sebelumnya tentang form email subscription Membuat email subscription dengan social media, pada kesempatan kali ini farhan akan memberikan salah satu solusi bagi sobat yang menginginkan form email subscription dengan tema friendly, easy loading, dan sederhana, contoh widget-nya sobat farhan bisa lihat pada gambar di atas ini. Baik, sobat farhan di bawah ini farhan sudah persiapkan kode script dan langkah-langkah membuat email subscription sederhana di blog, di simak baik-baik ya.
1. Login Ke Blogger.
2. Pilih Tata Letak.
3. Pilih Add Gadget.
4. Pilih HTML/JavaScript.
5. Sobat letakkan kode di bawah ini ke dalam box "Konten".
<!-- email subscription by www.farhanshare.blogspot.com -->
<style>
.tips-email{
background:url(http://i1141.photobucket.com/albums/n581/fskhan619/orangeemaillogo1copy.png) no-repeat 0px 12px;
width:300px;
padding:10px 0 0 63px;
margin-top:10px;
float:left;
font-size:18px;
font-weight:bold;
margin:0 0 10px 0;
color:#36393A;
}
.tips-emailsubmit{
background:#9B9895;
cursor:pointer;
color:#fff;
border:none;
padding:5px;
text-shadow:0 -1px 1px rgbaundefined0,0,0,0.25);
-moz-border-radius:6px;
-webkit-border-radius:6px;
border-radius:6px;
font:12px sans-serif;
}
.tips-emailsubmit:hover{
background:#F88017
}
.textarea{
padding:2px;
margin:6px 2px 6px 2px;
background:#f9f9f9;
border:1px solid #ccc;
resize:none;
box-shadow:inset 1px 1px 1px rgbaundefined0,0,0,0.1);
-moz-box-shadow:inset 1px 1px 1px rgbaundefined0,0,0,0.1);
-webkit-box-shadow:inset 1px 1px 1px rgbaundefined0,0,0,0.1); font-size:13px;
width:140px;
color:#666;}
</style>
<div class="tips-email">
Subscribe via Email
<form action="http://feedburner.google.com/fb/a/mailverify" id="feedform" method="post" target="popupwindow" onsubmit="window.openundefined'http://feedburner.google.com/fb/a/mailverify?uri=farhanshare', 'popupwindow', 'scrollbars=yes,width=550,height=520');return true">
<input gtbfieldid="3" class="textarea" name="email" onblur="if undefinedthis.value == "") {this.value = "Email address here";}" onfocus="if undefinedthis.value == "Email address here") {this.value = "";}" value="Email address here" type="text" />
<input type="hidden" value="farhanshare" name="uri"/><input type="hidden" name="loc" value="en_US"/>
<input class="tips-emailsubmit" value="Submit" type="submit" />
</form>
</div>
<!-- email subscription by www.farhanshare.blogspot.com -->
<style>
.tips-email{
background:url(http://i1141.photobucket.com/albums/n581/fskhan619/orangeemaillogo1copy.png) no-repeat 0px 12px;
width:300px;
padding:10px 0 0 63px;
margin-top:10px;
float:left;
font-size:18px;
font-weight:bold;
margin:0 0 10px 0;
color:#36393A;
}
.tips-emailsubmit{
background:#9B9895;
cursor:pointer;
color:#fff;
border:none;
padding:5px;
text-shadow:0 -1px 1px rgbaundefined0,0,0,0.25);
-moz-border-radius:6px;
-webkit-border-radius:6px;
border-radius:6px;
font:12px sans-serif;
}
.tips-emailsubmit:hover{
background:#F88017
}
.textarea{
padding:2px;
margin:6px 2px 6px 2px;
background:#f9f9f9;
border:1px solid #ccc;
resize:none;
box-shadow:inset 1px 1px 1px rgbaundefined0,0,0,0.1);
-moz-box-shadow:inset 1px 1px 1px rgbaundefined0,0,0,0.1);
-webkit-box-shadow:inset 1px 1px 1px rgbaundefined0,0,0,0.1); font-size:13px;
width:140px;
color:#666;}
</style>
<div class="tips-email">
Subscribe via Email
<form action="http://feedburner.google.com/fb/a/mailverify" id="feedform" method="post" target="popupwindow" onsubmit="window.openundefined'http://feedburner.google.com/fb/a/mailverify?uri=farhanshare', 'popupwindow', 'scrollbars=yes,width=550,height=520');return true">
<input gtbfieldid="3" class="textarea" name="email" onblur="if undefinedthis.value == "") {this.value = "Email address here";}" onfocus="if undefinedthis.value == "Email address here") {this.value = "";}" value="Email address here" type="text" />
<input type="hidden" value="farhanshare" name="uri"/><input type="hidden" name="loc" value="en_US"/>
<input class="tips-emailsubmit" value="Submit" type="submit" />
</form>
</div>
<!-- email subscription by www.farhanshare.blogspot.com -->
Catatan : Ganti kode yang berwarna merah dengan ID Feedburner sobat.
Demikian sobat farhan tutorial blog tentang membuat email subscription sederhana, semoga bermanfaat, dan selamat mencoba, bila ada pertanyaan seputar cara membuat widget email subscription sederhana ini, sobat bisa tinggalkan komentar di bawah.
EmoticonEmoticon