Membuat Widget Email Subscribe Dengan Style Flat

Membuat Widget Email Subscribe Dengan Style Flat - Widget ini merupakan widget yang sangat penting dan ga mau dilewatkan oleh para blogger untuk membuat tampilan blog terlihat SEO. Widget ini berfungsi untuk mendapatkan berbagai artikel gratis yang diposting oleh blog-blog yang dimana anda juga mensubmit email anda. contoh hasilnya seperti dibawah ini :




Langkah-langkahnya sebagai berikut :
1. Pada Dasbor > Tataletak > Add Gadget/Widget > Pilih Text/Javascript
2. Lalu copy semua script berikut dan pastekan :


<style scoped="scoped" type="text/css">
#SUBSCRIBE-LTB { width:280px; border:1px solid #aaa; border-radius:3px; padding: 0; } .SUBSCRIBE-LTB-wrapper { background: #98cdca; color:#fff; font-size:14px; line-height:20px; text-align:inherit; text-transform:uppercase; padding:1px 20px 10px; } .SUBSCRIBE-LTB-form { clear:both; display:block; margin:10px 0; } form.SUBSCRIBE-LTB-form { clear:both; display:block; width:auto; margin:10px 0 0; } .SUBSCRIBE-LTB-email-field { -moz-border-radius:4px; -webkit-border-radius:4px; background:#fff ; border:1px solid #ccc; border-radius:4px; color:#444; width:68%; margin:0 0 15px; padding:10px 40px; } .SUBSCRIBE-LTB-email-button { background:#3A4146; border:1px solid #444749; box-shadow:0 1px 0 rgba(255,255,255,0.3) inset, 0 1px 0 transparent; color:#fff; cursor:pointer; font-family:verdana; font-weight:700; text-shadow:1px 1px 0 rgba(0,0,0,.4); text-transform:uppercase; width:100%; padding:10px; } .SUBSCRIBE-LTB-email-button:hover,.SUBSCRIBE-LTB-email-button:focus { background:#444749; } .SUBSCRIBE-LTB-email-button:active { -moz-box-shadow:0 1px 4px rgba(0,0,0,0.5) inset; -webkit-box-shadow:0 1px 4px rgba(0,0,0,0.5) inset; box-shadow:0 1px 4px rgba(0,0,0,0.5) inset; outline:0; } iframe,object,embed,.yt-border iframe,.yt-border object,.yt-border embed,table { width:100%; } embed { border-radius:3px; -moz-box-shadow:0 2px 4px rgba(0,0,0,0.2); -webkit-box-shadow:0 2px 4px rgba(0,0,0,0.2); background:#FFF; border:1px solid #ddd; box-shadow:0 2px 4px rgba(0,0,0,0.2); margin:0; padding:4px; } #footer-section { border-top:1px solid #98cdca; box-shadow:inset 0 4px 6px -3px #98cdca; font-family:cambria; font-size:14px; height:100px; text-align:center; width:100%; margin:10px -30px 5px; padding:0 30px; }
</style>
<div id="SUBSCRIBE-LTB"> <div class="SUBSCRIBE-LTB-wrapper"><font face="verdana"><p><b>Silahkan Isikan Email Anda Disini, Anda Akan Mendapatkan berbagai Artikel Menarik Gratis perharinya !!!!</b> </p></font> <div class="SUBSCRIBE-LTB-form"><form action="https://feedburner.google.com/fb/a/mailverify?uri=JoeErickBlog" class="SUBSCRIBE-LTB-form" method="post" onsubmit="window.open('https://feedburner.google.com/fb/a/mailverify?uri=JoeErickBlog', 'popupwindow', 'scrollbars=yes,width=520,height=520');return true" target="popupwindow"><input name="uri" type="hidden" value="JoeErickBlog" /> <input name="loc" type="hidden" value="en_US" /><input class="SUBSCRIBE-LTB-email-field" name="email" autocomplete="off" placeholder=" Ketik Email Anda Disini ... "/> <input class="SUBSCRIBE-LTB-email-button" title="" type="submit" value="Submit" /></form> </div></div></div>


*Keterangan :
- Kode warna biru ganti dengan Kata-kata anda sendiri.
- Ganti kode berwarna merah dengan kode ID pada Feedburner sobat

3. Kemudian Save Template.

Selesai sudah tutorialnya.
Semoga sukses dan selamat mencoba gan :)

Berlangganan update artikel terbaru via email:

13 Responses to "Membuat Widget Email Subscribe Dengan Style Flat"

  1. kira-kira berat nya mempengaruhi blog saya berapa KB ya sob...takut nanti jadi lemot loadingnya

    ReplyDelete
  2. Berat gk bro itu ntar malah lemot lagi

    ReplyDelete
  3. Keren informasinya bro..Sangat dibutuhkan.

    Maen juga di blog ane
    Koplak-ngakak.blogspot.com

    ReplyDelete
  4. mantap nih widget subscribenya.. pas banget.. ijin sedot scriptnya gan..

    ReplyDelete
  5. panjang juga yah gan script nyah :)

    ReplyDelete
  6. widgetnya keren gan ane izin praktek yah

    ReplyDelete
  7. sep > Kunjungi juga yah > http://bloggernineseven.blogspot.co.id

    ReplyDelete
  8. Nice, menarik nih widgetnya, buatan sendiri sob?

    ReplyDelete
  9. Mantap, ane mau coba buat blog nih

    ReplyDelete
  10. saya ijin nyoba ya gan, semoga mantap nih, makasih sebelumnya :D

    ReplyDelete

PERATURAN BERKOMENTAR :
✔ Relevan
✔ Sopan
✖ Link Aktif
✖ Spam
✖ Diluar Topik / OOT !

Iklan Atas Artikel

Iklan Tengah Artikel 1

Iklan Tengah Artikel 2

Iklan Bawah Artikel