6/12/14 Simple Flat UI Subscribe Email | SAMSURY SITES
samsury-sites.blogspot.com/2014/06/simple-flat-ui-subscribe-email.html 1/3
SAMSURY SITES Tutorial Blog
SIMPLE FLAT UI SUBSCRIBE EMAIL
Simple Flat UI Subscribe Email - Mungkin bisa dikatakan kelanjutan artikel sebelumnya tentang modifikasi contact
form dengan gaya ui style dan tentunya masih menggunakan gaya flat ui yang di kombinasikan dengan menu ui
awesome dan template flat ui portfolio design. Dan semuanya itu untuk membuat blog/web kita menjadi lebih indah
dengan widget unik serta konsep warna Flat yang lagi ngetren saat ini.
DEMO
VIEW CODE
Komponen dasarnya :
CSS
HOME BUTTON CSS3 FLAT UI METRO UI STYLE Simple Flat UI Subscribe Email
6/12/14 Simple Flat UI Subscribe Email | SAMSURY SITES
samsury-sites.blogspot.com/2014/06/simple-flat-ui-subscribe-email.html 2/3
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;
}
#vn-emailsubsocial .emailsub input:focus {
border-color:#F4836A;
outline: none;
box-shadow: 0 0 2px 1px #F4836A;
}
#vn-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;
}
#vn-emailsubsocial .emailsub .button:hover{
background: #DD7761;
}
HTML
<div id="vn-emailsubsocial">
<div class="heading">
Sign Up Here
</div>
Isikan pesan yang ingin anda sampaikan disini<br />
<div class="emailsub">
<form action="http://feedburner.google.com/fb/a/mailverify" method="post"
onsubmit="window.open('http://feedburner.google.com/fb/a/mailverify?uri=SamsurySites', 'popupwindow',
'scrollbars=yes,width=550,height=520');return true" target="popupwindow">
<input name="name" placeholder="Your Name" type="text" />
<input name="email" placeholder="Your Email" type="text" />
<input name="uri" type="hidden" value="BloggerYard" />
<input name="loc" type="hidden" value="en_US" />
<input class="button" type="submit" value="Sign Up Now!" />
</form>
</div>
</div>
Ganti tulisan SamsurySites dengan nama feed rss blog anda
Demikian sedikit tips blog ui style kali ini semoga bermanfaat, baca juga Simple Tooltip Dropdown Menu CSS3
Older Post
6/12/14 Simple Flat UI Subscribe Email | SAMSURY SITES
samsury-sites.blogspot.com/2014/06/simple-flat-ui-subscribe-email.html 3/3
Sign out
Notify me
Enter your comment...
Comment as: Virlyz Nyzam (Google)
Publish
Preview
BY SAMSURY SITES