Cara Membuat Widget Subscribe Form Responsive Dan Keren

Cara Membuat Widget Subscribe Form Responsive Dan Keren - Oke Guys. Kali Saya akan Memberikan Tutorial Cara Membuat Subscribe Form Responsive Dan Keren Ala Fostrap .Cara Memasang nya sangat gampang, bisa dilakukan dengan cara :
Klik TataLeta ( Layout ) > Add Widget > Html/Javascript

Note: Jangan Lupa Ganti Tulisan ClickUnduh dengan ID feedburner kalian.


Oke Kotak Subscribe Form Ini Saya Bagi Menjadi 5 Warna. Langsung Aja Cekidot :v

Grey Darken 4  

 <div class="container-subscribe card red">
<div class="row">
<form action="https://feedburner.google.com/fb/a/mailverify" method="post" target="popupwindow" onsubmit="window.open('https://feedburner.google.com/fb/a/mailverify?uri=ClickUnduh', 'popupwindow', 'scrollbars=yes,width=550,height=520');return true" class="col s12">
<div class="row">
        <div class="input-field col s12">
<input class="email-field" name="email" id="email" type="email" class="validate"/>
<label for="email" data-error="wrong" data-success="right">Email</label>
<input type="hidden" value="ClickUnduh" name="uri"/><input type="hidden" name="loc" value="en_US"/>
<div class="center"><button class="submit btn btn-danger waves-effect waves-red white red-text" type="submit" />Subscribe</button>
</div>
</div>
</div>
</form>
</div>
</div> 

Grey Darken 2

 <div class="container-subscribe card grey darken-2">
<div class="row">
<form action="https://feedburner.google.com/fb/a/mailverify" method="post" target="popupwindow" onsubmit="window.open('https://feedburner.google.com/fb/a/mailverify?uri=ClickUnduh', 'popupwindow', 'scrollbars=yes,width=550,height=520');return true" class="col s12">
<div class="row">
        <div class="input-field col s12">
<input class="email-field" name="email" id="email" type="email" class="validate"/>
<label for="email" data-error="wrong" data-success="right">Email</label>
<input type="hidden" value="ClickUnduh" name="uri"/><input type="hidden" name="loc" value="en_US"/>
<div class="center"><button class="submit btn btn-danger waves-effect waves-teal white grey-text text-darken-2" type="submit" />Subscribe</button>
</div>
</div>
</div>
</form>
</div>
</div>  

Teal

 <div class="container-subscribe card teal">
<div class="row">
<form action="https://feedburner.google.com/fb/a/mailverify" method="post" target="popupwindow" onsubmit="window.open('https://feedburner.google.com/fb/a/mailverify?uri=ClickUnduh', 'popupwindow', 'scrollbars=yes,width=550,height=520');return true" class="col s12">
<div class="row">
        <div class="input-field col s12">
<input class="email-field" name="email" id="email" type="email" class="validate"/>
<label for="email" data-error="wrong" data-success="right">Email</label>
<input type="hidden" value="ClickUnduh" name="uri"/><input type="hidden" name="loc" value="en_US"/>
<div class="center"><button class="submit btn btn-danger waves-effect waves-teal white teal-text" type="submit" />Subscribe</button>
</div>
</div>
</div>
</form>
</div>
</div>

Blue

 <div class="container-subscribe card blue">
<div class="row">
<form action="https://feedburner.google.com/fb/a/mailverify" method="post" target="popupwindow" onsubmit="window.open('https://feedburner.google.com/fb/a/mailverify?uri=ClickUnduh', 'popupwindow', 'scrollbars=yes,width=550,height=520');return true" class="col s12">
<div class="row">
        <div class="input-field col s12">
<input class="email-field" name="email" id="email" type="email" class="validate"/>
<label for="email" data-error="wrong" data-success="right">Email</label>
<input type="hidden" value="ClickUnduh" name="uri"/><input type="hidden" name="loc" value="en_US"/>
<div class="center"><button class="submit btn btn-danger waves-effect waves-blue white blue-text" type="submit" />Subscribe</button>
</div>
</div>
</div>
</form>
</div>
</div> 

Red

 <div class="container-subscribe card red">
<div class="row">
<form action="https://feedburner.google.com/fb/a/mailverify" method="post" target="popupwindow" onsubmit="window.open('https://feedburner.google.com/fb/a/mailverify?uri=ClickUnduh', 'popupwindow', 'scrollbars=yes,width=550,height=520');return true" class="col s12">
<div class="row">
        <div class="input-field col s12">
<input class="email-field" name="email" id="email" type="email" class="validate"/>
<label for="email" data-error="wrong" data-success="right">Email</label>
<input type="hidden" value="ClickUnduh" name="uri"/><input type="hidden" name="loc" value="en_US"/>
<div class="center"><button class="submit btn btn-danger waves-effect waves-red white red-text" type="submit" />Subscribe</button>
</div>
</div>
</div>
</form>
</div>
</div> 

Ganti Tulisan ClickUnduh Dengan ID FeedBurner Kalian