Thursday, November 8, 2012

Roseic Pro Subscription Box for Blogger

Blogger Widget is going very hit on the daily bases and the competition is going very high in this line of blogging be'coz bloggers don't have the new fresh Widgets on blogging they are just posting something like Blogger News, OR some tricky trick related with webmaster or web designing but we have a Pro and Fresh Subscription Box for Blogger with Mouse Hover Effect and named as 'Rosiec' be'coz I love Rose.

Add Roseic Pro Subscription Box

Click on Drop Down Menu and select Template

Backup your Template before making any changes to your blog

Now Click on Edit HTML > Proceed > Expand Widget Templates

Press Ctrl + F and search the code shown below.

</head>

Paste below codes before </head>

<link href='http://fonts.googleapis.com/css?family=Allura' rel='stylesheet' type='text/css'>
<link href='http://fonts.googleapis.com/css?family=Lobster' rel='stylesheet' type='text/css'>

Save your template.

Now Go to Layout > Click on Add a Gadget

Select HTML/JavaScript Widget.

Paste below code in it.

<style>
.wg-subw{
padding:20px;
border:1px solid;
-moz-box-shadow:    inset 0 0 30px #000000;
-webkit-box-shadow: inset 0 0 30px #000000;
box-shadow:         inset 0 0 30px #000000;
transition: box-shadow .777s;
-webkit-transition: box-shadow .777s;
-moz-transition: box-shadow .777s;
-o-transition: box-shadow .777s;
-ms-transition: box-shadow .777s;
}
.wg-subw:hover{
-moz-box-shadow:    inset 0 0 50px #000000;
-webkit-box-shadow: inset 0 0 50px #000000;
box-shadow:         inset 0 0 50px #000000;
}
.textfonts{
font-family: 'Lobster', cursive;
font-size:28px;
}
.firstfonts{
font-size:40px;
font-family: 'Allura', cursive;
}
.wg-input
{
background: url("http://i1203.photobucket.com/albums/bb382/chandeep10/btnt-custom-theme/email.png") no-repeat scroll 10px center #FFFFFF;
font-family: 'Lobster', cursive;
padding: 8px 40px;
}
.wg-button{
border:1px solid black;
background: -moz-linear-gradient(center top , #30A146 0%, #249334 100%) repeat scroll 0 0 transparent;
border: 0 none;
border-radius: 4px 4px 4px 4px;
color: #FFFFFF;
cursor: pointer;
font-family: "Droid Sans","Lucida Grande",Tahoma,sans-serif;
font-weight: bold;
padding: 10px 40px;
text-shadow: 1px 1px 0 rgba(0, 0, 0, 0.4);
background:#000;
border: 0 none;
border-radius: 4px 4px 4px 4px;
color: #FFFFFF;
cursor: pointer;
font-family: "Droid Sans","Lucida Grande",Tahoma,sans-serif;
font-weight: bold;
padding: 10px 40px;
text-shadow: 1px 1px 0 rgba(0, 0, 0, 0.4);
transition: background-color .777s;
-webkit-transition: background-color .777s;
-moz-transition: background-color .777s;
-o-transition: background-color .777s;
-ms-transition: background-color .777s;
}
.wg-button:hover{
background:grey;
}

.sidebar .Followers
{
border-style:inset;
}
.description
{
display: none;
}
</style>
<div class='wg-subw'>
<form action='http://feedburner.google.com/fb/a/mailverify' 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'>
<center>
<div class='firstfonts'>Subscribe Us</div>
<div class='textfonts'>Get Latest Updates About Blogger Stuff Direct in Your Inbox</div>
<p><input class='wg-input' name='email' onfocus='if (this.value == "Enter your email...") {this.value = ""}' style='font-size:15px; width:240px' type='text' value='Enter your email...'/></p><input name='uri' type='hidden' value='WidgetGenerators'/><input name='loc' type='hidden' value='en_US'/>
<input class='wg-button' type='submit' value='Subscribe'/>
</center></form></div>