Cara Membuat Kotak Subdiscribe Elegan

Hai Sobat, kali ini saya akan share tentang Cara Membuat Kotak Subdiscribe Elegan. Kotak ini saya buat simple dan tidak membuat blog anda menjadi berat.
Mau tau caranya ?? Langsung Saja Ke Tutorialnya

CARA MEMBUAT KOTAK SUBDISCRIBE ELEGAN

1. Masuk Ke Beranda Blogger > Tata Letak > Tambah Widget > HTML/Javascript
2. Masukkan Kode Di Bawah Ini

<link href='http://fonts.googleapis.com/css?family=Open+Sans:300italic,400italic,600italic,400,300,600,700' rel='stylesheet' type='text/css'/>
<div id='byard-emailsubsocial'>
              <div class='heading'>
               Ikuti Kami
              </div>
                 <p>Masukkan Emailmu Dan Dapatkan Pembaruan Setiap Harinya.</p>
             <div class='emailsub'>
              <form action='http://feedburner.google.com/fb/a/mailverify' method='post'target="popupwindow" onsubmit="window.open('http://feedburner.google.com/fb/a/mailverify?uri=alamat', 'popupwindow', 'scrollbars=yes,width=550,height=520');return true">
               <input type='text' name='name' placeholder='Nama Anda' />
               <input type='text' name='email' placeholder='Alamat Email Anda' />
               <input type="hidden" value="initextyak" name="uri"/>
               <input type="hidden" name="loc" value="en_US"/>
                        <input value="Bergabung!" class="button" type="submit" />
              </form>
             </div>
             </div>
 <style type='text/css'>
     #byard-emailsubsocial {
      width: 300px;
      height: 330px;
      border: 1px solid #ddd;
        border-radius: 5px 5px 0px 0px;
     }
     #byard-emailsubsocial .heading {
padding: 15px 25px;
line-height: 35px;
font-size: 26px;
font-weight: 600;
font-family: open sans;
color: rgb(170, 170, 170);
text-align: center;
text-shadow: 0px 1px rgba(255, 255, 255, 0.75);
background: none repeat scroll 0% 0% rgb(247, 247, 247);
     }
   #byard-emailsubsocial p {
    font-family: open sans;
    font-size: 13px;
    color: rgb(170, 170, 170);
    line-height: 25px;
    padding: 10px 20px 0 20px;
    margin: 0;
   }
   #byard-emailsubsocial .emailsub {
    padding: 0px 20px 10px 20px;
   }
   #byard-emailsubsocial .emailsub input {
    color: rgb(170, 170, 170);
    padding: 10px;
    margin-top: 10px;
    font-size: 15px;
    font-family: open sans;
    width: 92%;
    border: 1px solid #ccc;
    border-bottom: 2px solid #ccc;
    border-radius: 5px;
    transition:border 0.15s linear 0s, box-shadow 0.15s linear 0s, color 0.15s linear 0s;
   }
   #byard-emailsubsocial .emailsub input:focus {
    border-color:#F4836A;
    outline: none;
    box-shadow: 0 0 2px 1px #F4836A;
   }
   #byard-emailsubsocial .emailsub .button {
    background: #F4836A;
    color: white!important;
    border:none;
    outline: none;
    border-bottom: 3px solid #B3614E;
    transition:background .4s linear;
    width: 90%;
    margin-right: 5%;
    margin-left: 5%;
    font-weight: 600;
    cursor:pointer;
   }
   #byard-emailsubsocial .emailsub .button:hover{
    background: #DD7761;
   }
#credits {
margin: 0 auto!important;
margin-top: -10px!important;
width: 160px;
}
     </style>

3. Klik Simpan