Make Simple Subscribes Box For You

Karena tidak ada kerjaan, Koben membuat lagi form action subscribes. Kotak berlangganan via email itu loh sob! Sebelumnya juga gue pernah membuat Beautiful Subscribes Box. Sekarang mau berbagi cara membuat kotak berlangganan sederhana, namun tetap mengusung gaya bin full stylish ;;) Sangkin sederhananya cocok bagi blogger yg suka dengan tema minimalis ;))
Global design subscribes box kali ini akan menampilkan image logo gmail didalam area input text. Kotak dan tombol dibuat murni menggunakan CSS diberi sentuhan atribut CSS3 b-)

Demo Simple Subscribes Box Full Gaya

Code CSS

Bagaimana sobat sabit sekalian, tertarik menanamkan kotak langganan via email tersebut ke dalam blog kalian! Sikat ramuan berikut

.textemail {
    background: url("http://3.bp.blogspot.com/-CCakSxEfeIo/Tvb8sF7iveI/AAAAAAAAAUY/Yk3BSDLI8Vo/s1600/gmail.png") no-repeat scroll 5px center transparent;
    border: 1px solid #DDD;
    border-radius: 5px;
    color: #555;
    font-weight: bold;
    padding: 10px 5px 10px 35px;
    font-style: italic;
width:235px;
    box-shadow: 1px 1px 5px #CCC inset;
}
.button_ {
background-color:#f4f4f4;
     border-radius: 5px;
     border: 1px solid #DDD;
     color: #555;
     cursor: pointer;
     font-weight: bold;
     padding: 9px 10px;
     text-decoration: none;
    box-shadow: 0px 0px 5px #CCC inset;
}

Markup HTML

<form target="popupwindow" onsubmit="window.open('http://feedburner.google.com/fb/a/mailverify?uri=beben-koben', 'popupwindow', 'scrollbars=no,width=540,height=530,top=0,left=0');return true" method="post" class="emailform" action="http://feedburner.google.com/fb/a/mailverify">
<input type="hidden" value="beben-koben" name="uri" />
<input type="text" placeholder="Enter your email..." name="email" class="textemail" />
<input type="submit" value="Subscribe" title="" class="button_" />
</form>Gantikan tulisan warna merah tua dengan uri kalian masing² Semoga bermanfaat :)
Happy subscribes box \m/