Cara buat widget Berlangganan bergaya google Plus

Mungkin sobat blogger sudah banyak melihat kotak langganan artikel | subscribe dengan berbagai Variasi, bentuk atau model, pada kesempatan kali ini saya ingin membagikan Cara membuat widget Langganan Artikel yang tentunya agak sedikit berbeda dan bergaya Google Plus, kelebihan widget ini yakni tidak membuat blog lelet.

Cara Pasang di Blog cukup mudah
Silahkan Menuju :
Dasbord+ Tata Letak +Tambah Gadget+HTML/JavaScript

Silahkan Masukkan kode berikut di dalamnya

<div class="subscribe_outer">
<div class="subscribe_wrapper">
<p>Silahkan Langganan Artikel</p>
<div id="btntEmailsub">
<form class="btntEmailform" target="popupwindow" onsubmit="window.open('http://feedburner.google.com/fb/a/mailverify?uri=cyber', 'popupwindow', 'scrollbars=yes,width=600,height=540');return true" method="post" action="http://feedburner.google.com/fb/a/mailverify">
<input type="hidden" value="cyber" name="uri" />
<input type="hidden" value="en_US" name="loc" />
<input class="emailText" type="text" value="Enter your email..." onfocus="if (this.value == " enter="" your="" email...")="" {this.value="" }"="" onblur="if (this.value == " ")="" ;}"="" onclick="value=&#39;&#39;" name="email" />
<input class="emailButton" type="submit" value="Signup Now!" title="" />
</form>
</div>
</div>
</div>
<style>
.subscribe_outer {
background: url("https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgpU9LjWZqbh4Wz8F-scTHNXf5n_dBArYlSUN61m7Qx1A5_jNavXM8vFVmc11AP9PW9aPoHQ7Fqg2ZYz5mGAyr2s__A09U-4gjDMKkL9NvnYoVusDhaJWNJEJi27uUnQ6KqD7R0OXfjTl0/s1600/color-chronicl.gif") repeat scroll 0 0 transparent;
margin: 0 -10px;
padding: 5px 0;
}
.subscribe_wrapper {
background: url("https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgv2i-XanYt8DSzYg33y0WBu_Q3wDP-j7lK8pTBqDRIfMaisuVq2VUA2_D11XQ0efj0EBoHrB5v8Cw8gJHQJNN56DKwAZwJJ6E0Q9-tPzRi1qHz-O-LpVd6sk5UsKN00ELg_T3stqRKh58/s1600/pattern-chronicl.png") repeat scroll 0 0 #333333;
color: #CCCCCC;
font-size: 15px;
font-weight:bold;
line-height: 20px;
padding: 10px 50px 18px 38px;
}
.emailButton {
background:#249334;
border: 0 none;
border-radius: 4px 4px 4px 4px;
color: #FFFFFF;
cursor: pointer;
font-weight: bold;
padding: 10px 40px;
text-shadow: 1px 1px 0 rgba(0, 0, 0, 0.4);
width: 100%;
}
.emailText {
background: url("https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgjGsf2qVTmtxEohjdKZNnI0Jb10mniT5imgsg3zYfEaTEnVDBxEaM5RZPwgdrOHl_q_4V4HvtRIhAT_hfsBbutgpeI7FyIYpxTdxpKLBN9cpBYLxML_YYgRnzFOf6RFe0PzQy-wAlbLzE/s1600/email.png") no-repeat scroll 10px center #FFFFFF;
border: 0 none;
border-radius: 4px 4px 4px 4px;
box-shadow: 0 0 3px rgba(0, 0, 0, 0.05) inset;
color: #444444;
padding: 10px 40px;
margin: 0 0 15px;
outline: none;
text-decoration: none;
width: 70%;
}
input, textarea {
font-family:'Lora',georgia,serif;
}
.subscribe_wrapper {
color: #CCCCCC;
font-size: 14px;
line-height: 20px;
}
.emailButton {
width: 300px;
}
.emailButton {
background: -moz-linear-gradient(center top , #30A146 0%, #249334 100%) repeat scroll 0 0 transparent;
border: 0 none;
border-radius: 4px 4px 4px 4px;
color: #FFFFFF;
cursor: pointer;
font-weight: bold;
padding: 10px 40px;
text-shadow: 1px 1px 0 rgba(0, 0, 0, 0.4);
width: 100%;
}
</style>

Ganti  cyber  dengan id feedburner masing-masing

Terakhir disimpan....
Semoga bermanfaat