What should I say about any widget be'coz all widgets are very awesome and very helpful for any blogger and there are thousands of widgets are available on internet where you can get the many kinds of professional widgets for blogging and many kinds of platforms like Wordpress, Blogger, Tumbler etc. but we deals on the blogger platform be'coz it's very easy and compatible for all kinds of HTML, JavaScript and CSS languages. We have a new a fresh Subscription widget for blogger with mouse hover effect.
Add Biggy Simple and Subscription Widget
- Login to Blogger > Dashborad
- Click on Drop Down Menu and select Layout
- Add a HTML/JavaScript Gadget
- Paste below code in it.
<style>
.rosyy{
color:#3e3e3e;
font-family: Impact, sans-serif;
font-size: 30px;
font-weight: normal;
line-height: 30px;
padding: 10px 0 0 10px;
text-shadow:0px 1px 0px #fff, 0px 2px 0px #C6C6C6;
}
.WG-91481wid {
background: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhdGc0h6GGVaXWEl1hBZuHBV5yDDmNJAo94O5B_winTefnJAQBxFkEXqUzApz5buJ8_HCT1KvEoB4vO9Lc70cmihu5MN1WMc48k0faA7NEYWK3WOoFsMTw-naHWxwUkXGNt5TpkyeJxmjTO/s400/body.png);
margin: 20px;
border-radius: 10px 30px 10px 30px;
width: 728px;
height: 120px;
color: #fff;
font-size: 14px;
padding: 15px;
transition:border-radius .5s;
-webkit-transition:border-radius .5s;
-moz-transition:border-radius .5s;
}
.WG-91481wid:hover{
border-radius:30px 10px 30px 10px;
}
.WG-91481wid p {
width: 350px;
line-height: 21px;
}
.subsbox {
float: right;
}
#subbox {
background: white url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgD231C1LLgdNHR7GnpDOwp8lRL8EHZy9upOUuLGu9LuycpA4BZaMRVteHw6tay6LgT4RyPBsakrwDjDFeqLLgBN1_3Dmn_-f4vgEx1qAWL-t3d3yB80zCpJEtf1nsHwUWQaA4On2calEOg/s1600/subscribe-email.png) no-repeat right;
width: 200px;
padding: 10px;
color: #888;
border: 1px soiid #222222;
}
#subbutton {
background: #2aa4cf;
color: #fff;
border-radius: 5px 15px 5px 15px;
height: 40px;
border: 1px solid #292929;
text-transform: uppercase;
font-weight: bold;
transition:border-radius .5s;
-webkit-transition:border-radius .5s;
-moz-transition:border-radius .5s;
}
#subbutton:hover {
border-radius:15px 5px 15px 5px;
}
</style>
<div class="WG-91481wid">
<div class="rosyy"><center>Get Daily Fresh Resepi Direct in Your Mail</center></div><br/>
<div class="subsbox">
<form action="http://feedburner.google.com/fb/a/mailverify" id="subscribe" method="post" onsubmit="window.open( 'http://feedburner.google.com/fb/a/mailverify?uri=WIdgetGenerators', 'popupwindow', 'scrollbars=yes,width=550,height=520');return true" target="popupwindow">
<input id="subbox" name="email" onblur="if ( this.value == '' ) { this.value = 'Enter your email address...'; }" onfocus="if ( this.value == 'Enter your email address...') { this.value = ''; }" value="Enter your email address..." type="text">
<input name="uri" value="WidgetGenerators" type="hidden">
<input name="loc" value="en_US" type="hidden">
<input id="subbutton" value="Subscribe!" type="submit">
</form>
</div>
<font color="#434343"><p>We Will Send You Our Best Direct in Your Mail and You Get Instant Access on Our Every Article! Without Any Cost.</p></font>
</div>
- Save Your Widget.