Most of peoples want
simple, clean yet Stylish and Cute Subscription Form for their blogs. Today
we came with Stylish and Cute Subscription Form Widget for Blogspot Blogs
and Wordpress. This widget will keep your sidebar neat and clean and will
surely attract visitors to Subscribe for your daily updates via Email. This
widget has some CSS effects and is easy to customize. Follow following steps to
add this Stylish and Cute Subscription Form Widget to Blogspot and
Wordpress.
Tip: Copy the code given below and paste it inside this
editor to see a live demo.
How to Add a Stylish and Cute Subscription Form
Widget to Blogger?
STEP #2: Go to Dashboard>Layout
STEP #4: Select HTML/JavaScript gadget.
<style>
.abt-email{
background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjboQk_iHRXLuN5APACyR06BqU0G3Yq0YrDqkPFViFq7B1AxzFGqOnZGRZQK39iyFyef4pAiH_umv59URwZ2OkD77QDhRuYYeQHlPzLHPE2hR03QIa44janX6ELFJRktNZMwkmtZ_AAAOA/h120/service-email.jpg)
no-repeat -8px 10px ;
width:240px;
padding:10px 0 0 65px;
float:left;
font-size:1.2em;
font-weight:bold;
margin:0 0 10px 0;
color:#0084CE;
box-shadow: 1px 1px 5px 1px #eee;
-moz-border-radius:10px;
-webkit-border-radius:10px;
border-radius:10px;
}
.abt-emailsubmit{
background:#9B9895;
cursor:pointer;
color:#fff;
border:none;
padding:4.4px;
text-shadow:0 -1px 1px
rgba(0,0,0,0.25);
-moz-border-radius:6px;
-webkit-border-radius:6px;
border-radius:6px;
font:12px sans-serif; box-shadow:inset
4px 4px 3px rgba(0,0,0,0.1);
}
.abt-emailsubmit:hover{
background:#0084CE; box-shadow:inset
8px 8px 6px rgba(0,0,0,0.1);
}
.textarea{background: #fff
!important;box-shadow:inset 4px 4px 3px rgba(0,0,0,0.1);
border: 1px solid #d2d2d2;
padding: 0px 8px 0px 8px;
color: #888; font-size: 12px;
height: 25px; width: 165px;
border-radius: 5px;
-moz-border-radius: 5px;
-webkit-border-radius: 5px;
margin:0px; }
</style>
<div class='abt-email'>
Subscribe via Email
<form
action="http://feedburner.google.com/fb/a/mailverify"
id="feedform" method="post" target="popupwindow"
onsubmit="window.open('http://feedburner.google.com/fb/a/mailverify?uri=WIKITECHNOL', 'popupwindow',
'scrollbars=yes,width=550,height=520');return true">
<input gtbfieldid="3"
class="textarea" name="email" onblur="if (this.value
== "") {this.value = "Enter email address
here";}" onfocus="if (this.value == "Enter email
address here") {this.value = "";}"
value="Enter email address here" type="text" />
<input type="hidden"
value="WIKITECHNOL"
name="uri"/><input type="hidden" name="loc"
value="en_US"/>
<input
class="abt-emailsubmit" value="Submit"
type="submit" />
</form>
</div>
How to Customize?
- Replace WIKITECHNOL with your feedburner username.
STEP #6: Now click on Save and
it’s done.
How to Add a Stylish and Cute Subscription Form
Widget to Wordpress?
STEP #1: Go to Dashboard>Appearance>Widgets>Available
Widgets.
STEP #2: Drag Text Widget
into a sidebar.
STEP #3: Copy the above code in STEP #5 into the Text Widget.
STEP #4: Now Save.
So execute steps correctly and you are done. Head
to your blog and check the trick executed. So don't forget us. We will only
survive with your generosity. Like, Share, Follow and Subscribe. If you are
facing any problem with implementing these codes just comment below for help.
Stay tuned for more posts.
{ 0 comments... read them below or add one }
Post a Comment