Widget Box Form Berlangganan

Berikut ini kumpulan Kotak form berlangganan yang menarik, dan sangat enak dipandang, atau ada yang Cocok buat blog teman2 silahkan digunakan


Stylish Rss Feed Subscription
box berlangganan

<center>
<div align="center" id="bloggertrix1-Subscribe-wrapper">
<div id="ig-subscription-optin" style="border: 3px solid #000000; filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#55AAEE', endColorstr='#003366',GradientType=0 ); width: 250px;">
<h3 id="bloggertrix1-title-text" style="color: white; font-size: 20px;">
GET FREE EMAIL UPDATES</h3>
<form action="http://feedburner.google.com/fb/a/mailverify" method="post" onsubmit="window.open('http://feedburner.google.com/fb/a/mailverify?uri=bloggertrix', 'popupwindow', 'scrollbars=yes,width=550,height=520');return true" target="popupwindow">
<a class="social-icons" href="https://facebook.com/blukusud"><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiGEWKNmEggLPF7BbhS17EtXys1lLErxhLoSIt1K2KJOs8bBfY77mIJmebW2jCCqXQ9pKYv576qOx2c8i1pBuGHnSnh6ehVH1NAkU6Hsi5MkUH5mtsTzfERUzL1lYR1c4diR9owS1EB5i8r/s1600/Bloggertrix-facebook.png" /></a>
<a class="social-icons" href="https://twitter.com/alfihasnal"><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgv8rDiXDjdJtoKWIXfD_qy8zeBmwHvrrZeC-yecTBNaud0s4FXitJexxkLLUYWIgyscKIx59VqJWox_xYj5c3iMqwKqU02nTc8pt2drtQqBSVJ4hDnPbaMv0x09wusdrP5rHRqE7eiGgH5/s1600/bloggertrix-twitter.png" /></a>
<a class="social-icons" href="https://plus.google.com/userId"><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhaquBpDJd0K-pmWPoaXd2XnP-lbZHMQqbfXm1nzatmZlh_FwsKaOuIezreQ4KT6Pg5wgVYdk1xOUK-00kyqs-EGqGJz_Uol5uOy7xJUFW00yS6dGP_EDW1aDhXZUpUyqGSXg6bKBRVSLSf/s1600/Bloggertrix-Googleplus.png" /></a>
<a class="social-icons" href="http://www.feedburner.com/alfihasnal"><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiRd7tOd0Gsmrv4C5kBYVm51axTtnZ8chpvY7VHEnBM_wFMeHH3-DhubhEjxmn9PnYF_WIdBMEHC5e1gxVKrP_-2PReuTIQ3T5NA2p0Bma-aU-Mo8_yko2TRECMJK_LpPGlyQ7vYB6YrMtD/s1600/Bloggertrix-Rss.png" /></a>

<input class="email" id="bloggertrix_Subscriber_email" name="from" onblur="if(this.value=='')this.value=this.defaultValue;" onfocus="if(this.value==this.defaultValue)this.value='';" style="width: 130px;" type="text" value="Enter Email Address" /><br />
<div class="separator" style="clear: both; text-align: center;">
</div>
<input name="uri" type="hidden" value="bloggertrix" /><input name="loc" type="hidden" value="en_US" /> <input id="digitalhubinc_Submit_Text" style="height: auto; padding: 5px 0;" type="submit" value="Get Access Today!" /></form>
</div>
</div>
</center>
<style>
a.social-icons {margin-right: 5px; height:40px;width:40px;}
a.social-icons:hover {opacity: .7;filter:alpha(opacity=70); }
#ig-subscription-optin {margin: 0px;padding: 10px;background: #2A6DA9;
background: -moz-linear-gradient(top, #5AE, #036);background: -webkit-gradient(linear, left top, left bottom, from(#5AE), to(#036));height: auto!important;color: white !important;padding: 20px 15px !important;
text-align: center !important;font-family: Georgia, Times, "Times New Roman", serif !important;margin: 10px;margin: 0px;padding: 10px;
margin: 8px 0 0 !important;line-height: 22px;font-family: Georgia, Times, "Times New Roman", serif;padding: 5px;border: none;}#ig-subscription-optin p {margin: 8px 0 0 !important;line-height: 22px;font-family: Georgia, Times, "Times New Roman", serif;
padding: 5px;border: none;}#ig-subscription-optin input.name {
background: white url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEi0QfgZvoBFbufLaPoxK1hAA9nTudxWoaglLLTEE-gdW-VEz9DbM9EdXupvJz-BEVqIi9aKjufWSNaHjTt7ZV2eJi__kdgtQbOaEJ7w-XoH52QLFcBZEPWhvnPhaN1AdpAl16uh7i2RD2Vc/s1600/subscribe-name.png) no-repeat center right;}
#ig-subscription-optin input[type="text"] {border: 1px solid #111 !important;
font-size: 15px !important;margin-bottom: 10px !important;padding: 8px 28px 8px 10px !important;width: 80% !important;height: auto !important;}
#ig-subscription-optin input.email {background: white url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhUmva4iUp4CRosQfyayFYVk_ihP6AwQr6lcqeRmAI82KOsnBtnlnO9-b02oGLlshlDtTLvNHEBftSzorgZ5WH_tZ8KWJXG4NICrc162vphdi4Si27nEEtjZxKU8nKFmMJL_YrsdJWcHFmO/s1600/subscribe-email.png) no-repeat center right;}#ig-subscription-optin input {
font-family: Georgia, Times, "Times New Roman", serif;border-radius: 3px;-moz-border-radius: 3px;-webkit-border-radius: 3px;box-shadow: 0 2px 2px #111;-moz-box-shadow: 0 2px 2px #111;-webkit-box-shadow: 0 2px 2px #111;margin: 0px;padding: 0px;}#ig-subscription-optin h3 {margin-top: 10px !important;margin-bottom: 8px !important;margin-left: 10px !important;margin-right: 10px !important;
font-weight: bold !important;line-height: 26px !important;letter-spacing: normal;
text-transform: none;text-decoration: none;
text-align: center !important;font-family: Georgia, Times, "Times New Roman", serif;
border: none;padding: 0px !important;float: none;}input:hover[type="submit"] {
background-color: #0094D2;border: 1px solid #0094D2;color: white;text-decoration: none;}input[type="submit"] {background-color: #00A7ED;border: 1px solid #0094D2;
color: white;cursor: pointer;font-family: 'Droid Sans', sans-serif !important;font-size: 13px;font-weight: normal;padding: 5px;text-decoration: none;}input {
color: #333;font-family: 'Droid Sans', sans-serif;}#ig-subscription-optin input[type="submit"] {background: #960E17 url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEh6CGTc30jtLAg5rZzQuK87n4QJ4j2xF80AkbsnMlmiVMOGbxuKUdWC47GtdwPNWx0RTrui10yvhCO_79-D2rXdzyPup9p7XF4TpxME9KKAomprDvN9VVrRXd-VorP6vRj9A_U1VylEg3hx/s1600/subscribe-red.png) repeat-x top;border: 1px solid #111 !important;color: white;cursor: pointer !important;font-size: 18px !important;font-weight: bold !important;
padding: 6px 0 !important;text-shadow: -1px -1px #3A060A !important;width: 90% !important;height: auto !important;line-height: 24px !important;}
#ig-subscription-optin input[type="submit"]:hover {color: #FFA5A5;}</style>


Blue Color Social Subscription


box berlangganan

<style>
#sidebar-subscribe-box{width:300px;border:1px solid #aaa;border-radius:3px;padding:3px 0}
.sidebar-subscribe-box-wrapper{background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg8MUfQF3Uohqazl237XTF5wmenp9Wk5gBwoDWRgszKbcyVbLx36xCh4FY3ypSQOQMLEDOdMuO8NfzfWODrtl62ciUNwFDez4cEcVA_QYXVsvEDGnfV_S56R0AMXNhzs1tGjT6xaXGHg1k/s1600/background.png) repeat scroll 0 0 #f7f7f7;color:#111;font-size:14px;line-height:20px;padding:1px 20px 10px;text-align:center;text-transform:uppercase}
.sidebar-subscribe-box-form{clear:both;display:block;margin:10px 0}form.sidebar-subscribe-box-form{clear:both;display:block;margin:10px 0 0;width:auto}
.sidebar-subscribe-box-email-field{-moz-border-radius:4px;-webkit-border-radius:4px;background:#fff url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhUAQ70Zs3qcvjpi7xe4jlqlq-SBxA6PxnqI8Ec-UwhDjRpINH0v2aQf4rFSTYmmvXj4hcvwzw9xm34iDK2W9eqXZwCEV72Ad5WqB9ANY2hm5HxvDVJFR7lboZVBddrmLc0kL30LJtu4Tg/s1600/icons.png) no-repeat 0 -27px;border:1px solid #ccc;border-radius:4px;color:#444;margin:0 0 15px;padding:10px 40px;width:68%}
.sidebar-subscribe-box-email-button{background:#09f;border:1px solid #007fff;box-shadow:0 1px 0 rgba(255,255,255,0.3) inset, 0 1px 0 transparent;color:#fff;cursor:pointer;font-family:verdana;font-weight:700;padding:10px;text-shadow:1px 1px 0 rgba(0,0,0,.4);text-transform:uppercase;width:100%}
.sidebar-subscribe-box-email-button:hover,.sidebar-subscribe-box-email-button:focus{background:#1ca4ff}
.sidebar-subscribe-box-email-button:active{-moz-box-shadow:0 1px 4px rgba(0,0,0,0.5) inset;-webkit-box-shadow:0 1px 4px rgba(0,0,0,0.5) inset;box-shadow:0 1px 4px rgba(0,0,0,0.5) inset;outline:0}iframe,object,embed,.yt-border iframe,.yt-border object,.yt-border embed,table{width:100%}embed{border-radius:3px;-moz-box-shadow:0 2px 4px rgba(0,0,0,0.2);-webkit-box-shadow:0 2px 4px rgba(0,0,0,0.2);background:#FFF;border:1px solid #ddd;box-shadow:0 2px 4px rgba(0,0,0,0.2);margin:0;padding:4px 4px 4px}
#footer-section{border-top:1px solid #aaa;box-shadow:inset 0 4px 6px -3px #aaa;font-family:cambria;font-size:14px;height:100px;margin:10px -30px 5px;padding:0 30px;text-align:center;width:100%}
a.social-icons{margin-right: 5px;height:45px;width:45px;}
a.social-icons:hover { opacity: .7; filter:alpha(opacity=70);}
</style>

<div id="sidebar-subscribe-box">
<div class="sidebar-subscribe-box-wrapper">
<br/>
<a class="social-icons" href="https://facebook.com/idseoblog"><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiGEWKNmEggLPF7BbhS17EtXys1lLErxhLoSIt1K2KJOs8bBfY77mIJmebW2jCCqXQ9pKYv576qOx2c8i1pBuGHnSnh6ehVH1NAkU6Hsi5MkUH5mtsTzfERUzL1lYR1c4diR9owS1EB5i8r/s1600/Bloggertrix-facebook.png" /></a>
<a class="social-icons" href="https://twitter.com/idseoblog"><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgv8rDiXDjdJtoKWIXfD_qy8zeBmwHvrrZeC-yecTBNaud0s4FXitJexxkLLUYWIgyscKIx59VqJWox_xYj5c3iMqwKqU02nTc8pt2drtQqBSVJ4hDnPbaMv0x09wusdrP5rHRqE7eiGgH5/s1600/bloggertrix-twitter.png" /></a>
<a class="social-icons" href="https://plus.google.com/userId"><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhaquBpDJd0K-pmWPoaXd2XnP-lbZHMQqbfXm1nzatmZlh_FwsKaOuIezreQ4KT6Pg5wgVYdk1xOUK-00kyqs-EGqGJz_Uol5uOy7xJUFW00yS6dGP_EDW1aDhXZUpUyqGSXg6bKBRVSLSf/s1600/Bloggertrix-Googleplus.png" /></a>
<a class="social-icons" href="http://www.feedburner.com/alfihasnal"><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiRd7tOd0Gsmrv4C5kBYVm51axTtnZ8chpvY7VHEnBM_wFMeHH3-DhubhEjxmn9PnYF_WIdBMEHC5e1gxVKrP_-2PReuTIQ3T5NA2p0Bma-aU-Mo8_yko2TRECMJK_LpPGlyQ7vYB6YrMtD/s1600/Bloggertrix-Rss.png" /></a>
<p>Subscribe To Our Email Newsletter & Receive Updates Free</p>
<div class="sidebar-subscribe-box-form"><form action="http://feedburner.google.com/fb/a/mailverify?uri=bloggertrix" class="sidebar-subscribe-box-form" method="post" onsubmit="window.open('http://feedburner.google.com/fb/a/mailverify?uri=bloggertrix', 'popupwindow', 'scrollbars=yes,width=550,height=520');return true" target="popupwindow"><input name="uri" type="hidden" value="bloggertrix" />
<input name="loc" type="hidden" value="en_US" /><input class="sidebar-subscribe-box-email-field" name="email" autocomplete="off" placeholder="Enter your email address here"/>
<input class="sidebar-subscribe-box-email-button" title="" type="submit" value="Subscribe Now !" /></form>
</div></div></div>



Social Media And Rss Subscribe

box berlangganan
<style>
.subscribebtrix {
border: 2px solid #000000;
padding: 8px;
width: 310px;
-webkit-transition: all 0.5s ease-in-out;
-moz-transition: all 0.5s ease-in-out;
-ms-transition: all 0.5s ease-in-out;
-o-transition: all 0.5s ease-in-out;
transition: all 0.5s ease-in-out;
}
.subscribebtrix:hover {
-moz-box-shadow: inset 1px 1px 10px 1px rgba(249, 215, 126, 1);
-webkit-box-shadow: inset 1px 1px 10px 1px rgba(249, 215, 126, 1);
box-shadow: inset 1px 1px 10px 1px rgba(249, 215, 126, 1);
}
.tbimailbox {
border: 1px solid #D3D3D3;
-webkit-border-radius: 4px;
border-radius: 4px;
-moz-box-shadow: 1px 1px 1px 1px rgba(255, 172, 84, 0.4) inset;
-webkit-box-shadow: 1px 1px 1px 1px rgba(0, 0, 0, 0.4) inset;
box-shadow: 1px 1px 1px 1px rgba(0, 0, 0, 0.4) inset;
color: #666;
font: 14px "trebuchet ms", sans-serif;
padding: 7px 15px;
width: 160px;
-webkit-transition: all 0.5s ease-in-out;
-moz-transition: all 0.5s ease-in-out;
-ms-transition: all 0.5s ease-in-out;
-o-transition: all 0.5s ease-in-out;
transition: all 0.5s ease-in-out;
}
.tbimailbox:hover {
-webkit-box-shadow: none;
box-shadow: none;
-webkit-transition: all 0.5s ease-in-out;
-moz-transition: all 0.5s ease-in-out;
-ms-transition: all 0.5s ease-in-out;
-o-transition: all 0.5s ease-in-out;
transition: all 0.5s ease-in-out;
}
.btrixsubmit {
font: bold 12px Tahoma, Geneva, sans-serif;
font-style: normal;
color: #ffffff;
background: #ff5714;
border: 0px solid #ffffff;
text-shadow: 0px -1px 1px #222222;
box-shadow: 2px 2px 5px #000000;
-moz-box-shadow: 2px 2px 5px #000000;
-webkit-box-shadow: 2px 2px 5px #000000;
border-radius: 10px 10px 10px 10px;
-moz-border-radius: 10px 10px 10px 10px;
-webkit-border-radius: 10px 10px 10px 10px;
padding: 8px 15px;
cursor: pointer;
margin: 0 auto;
}
.btrixsubmit:active {
cursor: pointer;
position: relative;
top: 2px;
}
.btrixsubmit::-moz-focus-inner {
border: 0;
padding: 0;
margin: 0;
}
</style>

<br />
<div class="subscribebtrix">
<div style="color: #666666; font-weight: bold; font: 22px Oswald, cursive; margin: 0px 0px 10px 15px;">
Free Updates to your Inbox</div>
<div style="margin: 10px 0 0 6px;">
<form action="http://feedburner.google.com/fb/a/mailverify" class="emailform" method="post" onsubmit="window.open('http://feedburner.google.com/fb/a/mailverify?uri=bloggertrix', 'popupwindow', 'scrollbars=yes,width=550,height=520');return true" style="margin: 0pt;" target="popupwindow">
<input name="uri" type="hidden" value="bloggertrix" />
<input name="loc" type="hidden" value="en_US" />
<input class="tbimailbox" name="email" onblur="if (this.value == &quot;&quot;) {this.value = &quot;Enter your email...&quot;;}" onfocus="if (this.value == &quot;Enter your email...&quot;) {this.value = &quot;&quot;}" type="text" value="Enter your email..." />
<input alt="" class="btrixsubmit" title="" type="submit" value="Subscribe" />
</form>
</div>
<div style="border: none; color: #666666; font: 22px Oswald, cursive; margin: 25px 0 0 5px;">
Follow us:</div>
<div style="margin: -32px 0 0 120px;">
<a href="http://www.facebook.com/bloggertrix" target="_blank" title="Join us on Facebook"><img alt="facebook" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgxIeg9D8CTJPX-OswqQ14OEAcqdG1P19o8t6To-sT97n3f82XXVsZZcE2_Ff-wlOJ4Cy22R32PUjPoD4N8DXnDk7XR_sSTu-I4v6GaUuzLOGTmyRZc516n6Q6u6JdqiSXp-h2iZmT3a3s/s1600/facebook_btrix.png" /></a>
<a href="http://www.twitter.com/bloggertrix" rel="nofollow" target="_blank" title="Follow us on Twitter"><img alt="twitter" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgw89uJ4n73J-x4jx1QoaW2YG6dbsz842mCn5mCLlOxCWe5al_eywEa7W602b7RezYoycbZ2lYrctniyxmC53zY2Dunj8eIhJegSnI7tNL3P28eOUBg__FXtTTSpXMiAwCfc7kD0ehBp-M/s1600/twitter_btrix.png" /></a>
<a href="https://plus.google.com/UserId" rel="nofollow" target="_blank" title="Follow us on Google+"><img alt="gplus" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhmISJdZ4I8PtUtYb81ghODicw4UK404l8yOa6lua9RTvzBkMewiMBxWsuFRKHUSvP0SmZuHgWbUPY_UR-GS-0RZLOnkiPGXaOeQ8wNeYZQb6YJ2YCdHTTwLVPlWZmiopiiVBO06eRwNsg/s1600/googleplus_btrix.png" /></a>
<a href="http://www.pinterest.com/bloggertrix" rel="nofollow" target="_blank" title="Follow us on Pinterest"><img alt="pinterest" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgeJ5npH7oVoS21rw7_SoXt-sZ0G7089foBuOsKYHANlGKN7cDnzLrwTHsH_4V5WXI0OcpoBVUq8CxH7MdmRLwz97IgQFcb0diz7mQ-4EzpFf0MG7-VtMP1qDDwWtRaLNHvHZyOei30t2c/s1600/pinterest_btrix.png" /></a>
<a href="http://feeds2.feedburner.com/bloggertrix" rel="nofollow" target="_blank" title="Subscribe to RSS"><img alt="rss" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgRAXN2Nlb5bv6LnY7D0sCbAb5NK8vSCHSEKDY_khUE1S_1_-fuXoEYuRwg-iZCIkyHJOHdW3uBwidHFGTqTKuxAdXI5vWoWIuvb05o2bS52GcoAFNqzrpSO0IE9Gyw1YLkpk30lp2Ug_k/s1600/rss_btrix.png" /></a>
</div>
<div align="center">
<a href="http://feeds.feedburner.com/idseoblog"><img alt="" height="26" src="http://feeds.feedburner.com/~fc/bloggertrix?bg=FF9900&amp;fg=444444&amp;anim=1" style="border: 0;" width="88" /></a></div>
</div>
Tulisan Berwarna Merah silahkan diganti dengan id sodara



Cara Menggunakan diBlog



  1. Pergi ke blogger> Tata Letak
  2. Klik Tambahkan gadget
  3. Selanjutnya and select 'HTML/Javascript'
  4. Masukan Kode diatas

save

You may like these posts