Stylish And Beautifull Blog And Website Email Subscription Box

Email Subscription Box help you to get more subscribers to your blog. These widgets not only increase your traffic but also helps you to grow a loyal community. You can use these emails any time to make your reader updated about your services or posts.

This Email Subscription Box will show a beautiful widget on your blog or website so that this Email Subscription Box can attract your readers and will convert it into your subscriber means you are now confirming your legal. Now garb this stylish widget and paste it on your web page and start counting your subscriber.

Features:

1.) No JQuery File Added.
2.) No JavaScript Codes.
3.) Stylish CSS Added.
4.) Simple And Fast Loading Widget.
5.) Can Work With Any Browser.

How To Add In A WebPage?

1.) Just Go To Your “Web Page File”.
2.) Now “Copy” The Below Codes And “Paste” It To There Positions.
3.) “Save” It, Now You Are Done.

CSS:

<style type="text/css">
#EXE_EMAIL_BOX{
padding:0;
margin:0 auto;
width:240px;
height:auto;
}
#EXE_BOX{
height:400px;
background:#222 url(https://www.generationplugin.com/preview/wp-content/uploads/Regular_bgimage.jpg) repeat center center;
}
#EXE_BOX_HEADING{
background: url(https://generationplugin.com/online/images/btn/head-red.png) no-repeat;
height:135px;
}
#EXE_BOX_HEADING h2 {
color:#FFFFFF;
font-family:Times New Roman,Times,serif;
font-size:28px;
margin:0;
padding:20px 0;
font-weight:bold;
text-align:center;
line-height:120%;
}
#EXE_BOX p {
color:#FFFFFF;
margin:10px 0 20px 0;
padding:0 20px;
font-size:12px;
text-align:center;
line-height:17px;
font-family:Arial,Helvetica,sans-serif;
}
#EXE_BOX input[type="text"] {
background-repeat:no-repeat;
width:211px;
color:#999999;
height:42px;
margin:10px auto;
padding:0 50px 0 10px;
text-indent:0;
display:block;
-webkit-box-sizing:border-box;
-moz-box-sizing:border-box;
box-sizing:border-box;
-webkit-box-sizing:border-box;
-moz-box-sizing:border-box;
box-sizing:border-box;
border-color:transparent;
box-shadow:none;
-webkit-box-shadow:none;
background-position:100% 100%;
background-repeat:no-repeat;
background-color:#FFFFFF;
-webkit-border-radius:3px;
-moz-border-radius:3px;
border-radius:3px;
font-size:14px;
}
#EXE_BOX input[type="submit"] {
background-repeat:no-repeat;
-webkit-box-shadow:0 2px 4px RGBA(0,0,0,.3);
-moz-box-shadow:0 2px 4px RGBA(0,0,0,.3);
box-shadow:0 2px 4px RGBA(0,0,0,.3);
-webkit-text-shadow:1px 1px 0 rgba(0,0,0,.3);
-moz-text-shadow:1px 1px 0 rgba(0,0,0,.3);
text-shadow:1px 1px 0 rgba(0,0,0,.3);
-webkit-border-radius:3px;
-moz-border-radius:3px;
border-radius:3px;
font-size:16px;
font-weight:bold;
color:#FFF;
text-transform:uppercase;
display:block;
text-decoration:none;
border:0;
width:212px;
height:44px;
text-align:center;
padding:11px 0 11px 0;
margin:0 auto;
vertical-align:top;
background-color:transparent;
cursor:pointer;
}
#EXE_BOX span{
background:url(https://generationplugin.com/online/images/boxes/icon-padlock.png) no-repeat 0 2px;
padding-left:25px;
line-height:12px;
font-size:9px;
color:#FFFFFF;
width:190px;
margin:0 auto;
display:block;
}
</style>

HTML:

<div id="EXE_EMAIL_BOX">
<div id="EXE_BOX">
<div id="EXE_BOX_HEADING"><h2>Everything For Your Bedroom</h2></div>
<p>Insert your details below and we will send you our brochure to your inbox.</p>
<form id="gpformsubmit_regular" action="##########" method="post">
<input name="name" type="text" value="Insert your name" style="background-image:url(https://generationplugin.com/online/images/user.png);"/>
<input name="email" type="text" value="Insert your email" style="background-image:url(https://generationplugin.com/online/images/email.png);"/>
<input name="submit" type="submit" value="SUBSCRIBE" style="background-image:url(https://www.generationplugin.com/online/images/btn/red.gif);"/>
</form>
<span>We will not share your details with anyone, we will keep your info secure safely!</span>
</div>
<img src="https://generationplugin.com/online/images/boxes/regular_shadow.png"/>
</div>

Customization:

1.) You Can Add More HTML,CSS. If You Are Pro, Then You Can Do Any Thing.

Last Words:

That’s all we have. If you have any problem with this code in your template then feel free to contact us with full explanation of your problem. We will reply you as time allow to us. Don’t forget to share this with your friends so they can also take benefit from it and leave your precious feedback in our comment form below. Happy blogging, See you in next article…