Widget Subscribe Terang

Widget Subscribe Terang

17 Comments

Sebelumnya saya pernah share cara pasanga widget subscribe gelap. Kali ini saya akan share cara pasang widget subscribe terang. Penampilannya dan fungsinya sama dan tidak kalah menarik dengan widget sebelumnya. Cara pembuatannya cukup mudah dan tidak memberatkan loading blog. Sebelumnya saya ucapkan terima kasih kepada bloggertrix atas kode widget ini. Baiklah, mari kita bahas cara pasang widget subscribe terang untuk blogspot. Ikuti langkah berikut


Log in ke blogger
Klik Rancangan
Klik Tambah Gadget
Pilih HTML/JavaScript
Masukkan kode berikut ke dalamnya
<style>
.btrixsocial_box-email{background:Fff no-repeat 0px 12px; width:270px; float:center; font-size:1.4em; font-weight:bold; margin:2px 20px 0px 10px; color:#686B6C}
.btrixsocial_box-emailsubmit{background:#0084CE; cursor:pointer;  color:#fff; border:none; padding:3px; margin:0 0 0px 0; text-shadow:0 -1px 1px rgbaundefined0,0,0,0.25); -moz-border-radius:2px; -webkit-border-radius:2px; border-radius:2px; font:12px sans-serif}
.btrixsocial_box-emailsubmit:hover{background:#E98313}
.textarea{padding:2px; margin:0px 2px 0px 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:200px; height:20px; color:#666}
#socialboxbt{text-align:center; font-weight:bold; padding:5px; border:1px solid black; width:300px; -moz-box-shadow:0px 0px 8px #000; -webkit-box-shadow:0px 0px 8px #000; box-shadow:0px 0px 8px #000}
</style>
<br />
<div id="socialboxbt">
<a href="http://feeds.feedburner.com/USERNAME-FEEDBURNER" imageanchor="1" rel="nofollow" style="float: center; margin-left: .5em; margin-right: 1em;" target="blank"><img border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhvUuMNOHIihvZfI7sp0qh0Q7hncbYfanNW_f7hvEsAWnS7qw5qgj_jl8C2LtIQOjVwok44WRIyiD_TG4xYAYfbico8r8H-KV7rQ3-XSO0clTf0Z65JoQtb_XslgQsZWcsvEhfCiQrXt7y3/s1600/rss.png" /></a>
Submit your Email Address to Get Free latest Articles Directly to your Inbox
<br />
<div class="btrixsocial_box-email">
<form action="http://feedburner.google.com/fb/a/mailverify" id="feedform" method="post" onsubmit="window.openundefined'http://feedburner.google.com/fb/a/mailverify?uri=USERNAME-FEEDBURNER', 'popupwindow', 'scrollbars=yes,width=550,height=520');return true" target="popupwindow">
<input class="textarea" gtbfieldid="3" name="email" onblur="if undefinedthis.value == &quot;&quot;) {this.value = &quot;Enter email address here&quot;;}" onfocus="if undefinedthis.value == &quot;Enter email address here&quot;) {this.value = &quot;&quot;;}" type="text" value="Enter email address here..." />
<input name="uri" type="hidden" value="USERNAME-FEEDBURNER" /><input name="loc" type="hidden" value="en_US" />
<input class="btrixsocial_box-emailsubmit" type="submit" value="Submit" />
</form>
</div>
<style class="text/css">
table
{border-bottom: 0px solid #E6E6E6;float: center;width: 300px;margin:-8px 0 0 0px;}
.subicons
{border-right: 0px solid #E6E6E6;}
.Fadeout {filter:alphaundefinedopacity=100);opacity: 1.0;border:0;
}
.Fadeout:hover{filter:alphaundefinedopacity=80);opacity: 0.8;border:0;
}
</style>
<br /><div class="table"><table>
<tbody><tr>
<td><div class="subicons">
<a class="Fadeout" href="http://www.facebook.com/USERNAME" imageanchor="1" rel="nofollow" target="_blank"><img border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhDDps5c2IhOhRXGfLYNkt-5J_6HUE7H42tB1ds-nzKeI3_9qPVApG4rlVakq59dFPNvObBUP1Wb9BbMppm9dzAxaoRl_xFeBoS1rbkpYkNcjU9MhfYJb5cxyqxE4Ak0Qftcx9durihKVU/s1600/btrix-facebook-icon.png" /></a></div>
</td><td><div class="subicons">
<a class="Fadeout" href="http://twitter.com/USERNAME" imageanchor="1" rel="nofollow" target="_blank"><img border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhEbpmGC7hc1KjZqtPVc1nhnQ9uoJTt5rG7ZwDhLJZjFU4ApDyqC37yFdN7i46UzvabQMZ6TT4A2xUbeJlWfatwucdqiJ9CRoL_ijfU-3OjZA1dfI1DrG8N5G8evcUbyO4PvvqAM7VMv-c/s1600/btrix-twitter-icon.png" /></a></div>
</td>
<td><div class="subicons">
<a class="Fadeout" href="http://feeds.feedburner.com/FEEDBURNER" imageanchor="1" rel="nofollow" target="_blank"><img border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhOl4nigiSNZYA1alsew1NgtksMsQC7UBwjpUVIrD6Stt7_JACn_Tsk6F1bprZqwqaZm6-_1lWOBGMl0V9eqfaDUB2z6lXODmIPowRRXrIvM-ZxTyAOiQwqWL9smpTngkC1edVXhohFNl0/s1600/btrix-rss-icon.png" /></a></div>
</td>
<td><a class="Fadeout" href="https://pinterest.com/USERNAME" imageanchor="1" rel="nofollow" target="_blank"><img border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEj9fiA3QfW2WmlrOHeuK0cmWAItLbGp8ZNPO_MPr1B7xyFoy-w7JTfRw5RBpm7d0Oy_uyKMdhgohrz3I4ZAMHE39DwGwKBE-yCJhiUGes56yYiNXh5rJrziUzC_HL37gtiGyE8Myw8ar_w/s1600/btrix-Pinterest-icon.png" /></a></td>
</tr></tbody></table></div></div>
Edit tulisan merah dengan cetak tebal sesuai petunjuk
Selanjutnya klik Simpan dan lihat hasilnya
Demikian tutorial cara pasang widget subscribe terang untuk blogspot. Semoga bermanfaat bagi kita semua, amin. Selamat menmcoba dan sukses selalu.

Source Code: Bloggertrix
Mau belajar trick dan tips blogging lengkap dan mudah?... BACA DI SINI

About the Author

Blogonol adalah Blog - 0 atau blog kosong dengan konten tutorial blog, seo, widget, template gratis, dan blog info yang dikonsep secara sederhana untuk belajar membangun blog yang lebih baik.