Cara Membuat Kotak Subscriber Keren Di Blogger

Cara Membuat Kotak Subscriber Keren Di Blogger – Pada Artikel Ini Kita Akan Membahas Lebih Tepatnya Di Kotak Suscriber, Kamu bisa meletakkan widget ini bisa dibawah postingan, atau juga bisa di sidebar. tergantung dengan keinginan masing masing, Kotak Berlangganan Atau Kotak Subscriber Ini Sangat Berfungsi sekali atau hal yang harus ada di blog kita, karena widget ini akan memberitahukan kepada pengunjung yang berlangganan apabila kita mengupdate konten baru di blog yang kita miliki.

Widget ini pernah digunakan sidebar jagoankode yang juga menggunakan ini, jadi buat kalian yang ingin menggunakannya juga, ini gratis hehe. namun sebelum menggunakan widget ini saya harap kamu sudah pernah mendaftar dan memahani fungsi dari feedburner itu sendiri. bisa kalian searching di google terlebih dahulu untuk cara mendaftarnya dan bagaimana menggunakannya.

Peminat Blog Kamu Tentulah Sangat Membutuhkan Widget Ini, Karena Ini Berdampak Baik Bagi Visitor Sehingga Berkemungkinan Visitor Blog Kamu Juga Bertambah Dan Memudahkan Juga Tentunya. Didalam postingan ini kita akan belajar Cara Membuat Kotak Subscriber Yang Keren ehehe, design ini merupakan hasil redesign dari kotak subscriber jagoankode. buat kalian yang ingin melihat demonya bisa kalian lihat dibawah ini :

Dari Design Diatas Ini Merupakan Recomended Banget Dari Admin, Karena Bentuknya Simple Dan Gak Ribet. Ini Pastinya Cocok Banget Digunakan Buat Blog Kamu. beberapa postingan saya sebelumnya juga ada membahas tentang pembuatan kotak subsciber atau langganan yang gak kalah lebih keren juga bisa kalian pilih sesuai degan keinginan kalian masing masing. silahkan baca di postingan saya dibawah ini..

• Cara Membuat Kotak Berlangganan Blog Subscription Box Keren Responsive

Kotak Subscriber Di Atas Sangat Keren Bukan ?…
Kotak Subscriber Yang Keren Di Blog Mampu Menarik Pengunjung Ke Blog Kamu, Jadi Jika Kamu Suka Dengan Design diatas kamu bisa membuatnya dan saya akan berbagi bagaimana cara pembuatannya, yuk simak cara berikut dibawah

Cara Membuat Kotak Subscriber Keren Di Blogger

Kotak Subscriber Ini Sangat Responsive, Tentu Sangat Bagus Pada Tampilan Mobile Dan Desktop, Jika Ingin Tau Pembuatan Kotak Subscribe diatas. cukup terbilang mudah, kalian bisa mengikuti cara dibawah ini…

Buka Blogger.com Dan Silahkan Login Akunmu Masing Masing

• Langsung Ke Thema >> Edit HTML
• Cari Tag Ini ]]></b:skin> Dan Letakkan Kode Berikut Ini Tepat Diatas Kode Tersebut..

#subscribebox {background:#204a84; padding:20px;font-family: 'PT Sans', sans-serif;
}
.widget_follow_subscribe .widget-detail {
 padding: 36px 30px 40px 30px;}
#subscribebox p {
 color: white;
 font-size: 15px;
 text-align: center;
 font-weight: 700;
}
.follow-subscribe-social {
 margin: 0 0 15px;
 padding: 0 0 14px;
 border-bottom: #858585 solid 1px;
}
.follow-subscribe-social ul {
 list-style: none;
 margin: 0;
 padding: 0;
 text-align: center;
}
.follow-subscribe-social ul li {
 display: inline;
 margin: 0 15px 0 0;    border-bottom: none;
}
.follow-subscribe-social ul li:last-child {
 margin: 0;
}
.follow-subscribe-social ul li a {
 font-size: 17px;
 color: #cacaca;
-webkit-transition: color 0.2s ease-in-out;
-moz-transition: color 0.2s ease-in-out;
-ms-transition: color 0.2s ease-in-out;
-o-transition: color 0.2s ease-in-out;
transition: color 0.2s ease-in-out;
}
.follow-subscribe-social ul li a:hover {
 color: #fff;
}
form.subscribe {
 margin-top: -7px;
}
form.subscribe input {
 display: block;
 width: 100%;
}
.subscribe-email {
 height: 45px;
 border: none;
 margin: 0 0 10px;
 font-size: 0.928571em;
 background-color: #ffffff;
  text-align: center;
  color:efefef;
}
.subscribe-email:focus {
 outline: 0;
}
/* Placeholder color */
form.subscribe .placeholder { /* Internet Explorer 9 */
 color: #cacaca;
}
form.subscribe input:-ms-input-placeholder { /* Internet Explorer 10+ */
 color: #cacaca;
}
form.subscribe input::-webkit-input-placeholder { /* WebKit browsers */
    color: #cacaca;
}
form.subscribe input:-moz-placeholder { /* Mozilla Firefox 4 to 18 */
    color: #fafafa;
}
form.subscribe input::-moz-placeholder { /* Mozilla Firefox 19+ */
    color: #fafafa;
}
.subscribe-button {
 height: 45px;
 font-weight: 700;
 font-size:16px;
 color: #fff;
 text-transform: uppercase;
 border: none;
 background-color:#ea5217;
 -webkit-transition: background-color 0.2s ease-in-out;
 -moz-transition: background-color 0.2s ease-in-out;
 -ms-transition: background-color 0.2s ease-in-out;
 -o-transition: background-color 0.2s ease-in-out;
 transition: background-color 0.2s ease-in-out;
}
.subscribe-button:hover {
 background-color: #f4b458;
}
.subscribe-button:focus {
 outline: 0;
}
.creadit a {background:#F35D5C;color:white;margin-top:30px;padding:20px;font-size:15px;} 

Jika Sudah Menambah CSSnya Agar Nantinya Menjadi Cantik, Langkah Selanjutnya Menambahkan Kode Ini Silahkan Ikuti Dengan Benar “

• Langsung Ke Menu Layout / Tata Letak
• Pilih Add a Gadget / Tambahkan Gadget
• Pilih HTML/JAVASCRIPT

<center>
<div id="subscribebox">
<img border="0" alt="Subcribe" src="https://4.bp.blogspot.com/-6F-E7q-6mzc/W0NOIyPnXdI/AAAAAAAADjs/0Q-GAn_MqXQyJHx3dE8RRt-DEhv2iIAzQCLcBGAs/s1600/unnamed.png" width="100" height="100" />
<p>Berlangganan Gratis! JagoanKode.blogspot.com</p>
<form class="subscribe" action='https://feedburner.google.com/fb/a/mailverify?uri=JagoanKode' method='post' onsubmit='window.open(&apos;https://feedburner.google.com/fb/a/mailverify?uri=JagoanKode, &apos;popupwindow&apos;, &apos;scrollbars=yes,width=550,height=520&apos;);return true' target='popupwindow'>
<input name='uri' type='hidden' value='JagoanKode'/>
<input name='loc' type='hidden' value='en_US'/>
<input class="subscribe-email" type='text' name='email' onblur='if (this.value == &quot;&quot;) {this.value = &quot;Your Email&quot;;}' onfocus='if (this.value == &quot;Your Email&quot;) {this.value = &quot;&quot;;}' value='Your Email'/>
<input class="subscribe-button" type="submit" value="Subscribe" />
</form>
<p style="font-size:90%;">Note : Setelah Berlangganan, Jangan Lupa Untuk Verifikasi Di Email Kamu!</p>
</div>
</center>