Add Unique and Stylish Email Subscribe Box to Blogger

Want to add a classic,Stylist and 100% Unique Email Subscribe Box below post to your Blogger Blog ?.if yes then this post is just for you.this Email Subscribe Box is simple but professional 3D look type as shown in above image.

How to add this Email Subscribe Box to Blogger below each post 

Follew below simple steps to add this Email Subscribe Box to Blogger

• Login to Blogger > Click on drop down menu >then select "Template".
• Now you will see  "EDIT HTML" Button ,Click on it >and then click on Proceed button .Now find code like this 

<div class='post-footer-line post-footer-line-1'>

or

<div class='post-footer-line post-footer-line-2'/>

Note:-Above code may be differ According to template try to Find your below post  code ,if you can send me your template to my mail.

Now After Finding your code ,Add the below Code

<b:if cond='data:blog.pageType == &quot;item&quot;'>
<div id="newsletterbox" style="background-color: whitesmoke; border: 10px solid rgb(228, 228, 228); font-family: Helvetica, Arial, sans-serif; font-size: 14px; line-height: 20px; margin-top: 30px;">
<div class="white-border" style="border: 1px solid rgb(255, 255, 255);">
<div class="newsletterbox-wrap" style="background-attachment: scroll; background-color: transparent; background-image: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgTVT1sXB1fPnOU1WqIFNRVASRqJuk6ihalSBqk6ld9du7-_1zhHM0wHz-wqJcxhZ6fWLyVzj3WE4TbMA049AZ6nXsBNuAvGOG0dDQ5Gi_5K8iwR7jwehh5qO1xczxb4KXR-GG_uZPOPcw/s1600/enews-ribbon.png); background-position: 0% 0%; background-repeat: no-repeat no-repeat; margin: -17px -18px; overflow: hidden; padding: 45px 30px 40px; text-align: center; text-shadow: rgb(255, 255, 255) 1px 1px;">
<h4 style="color: #333333; font-family: 'Droid Sans', arial, serif; font-size: 26px; font-weight: normal; line-height: 22px; margin: 0px 0px 10px; padding: 0px;">
Subscribe Our Newsletter</h4>
<div style="color: #666666; font-family: 'Droid Serif', arial, serif; line-height: 22px; margin-bottom: 20px; margin-left: 35px; margin-right: 35px; padding: 0px;">
Join over 5,000 people who get free and fresh content delivered automatically each time we publish.</div>
<form action='http://feedburner.google.com/fb/a/mailverify' method='post' onsubmit='window.open(&apos;http://feedburner.google.com/fb/a/mailverify?uri=egytricks&apos;, &apos;popupwindow&apos;, &apos;scrollbars=yes,width=550,height=520&apos;);return true' target='popupwindow'>
<input id="subbox" name="email" style="background-attachment: scroll; background-image: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgWTKhfmozR5myA01WBCQ9c-IKw4YPF7_0wrODjhxX2SGNWkcTigJ6V3MZktFQzDXAx_p-gtyC70uAd1Lc2UovewL31ICMKeQrk6YyfI8ldMR1cwewkn-hTo3EeYXePWWIUSJcaS1293Z4/s1600/enews1.png); background-position: 0% 50%; background-repeat: no-repeat no-repeat; border: 1px solid rgb(221, 221, 221); box-shadow: rgb(204, 204, 204) 0px 0px 5px inset; color: #999999; font-family: proxima-nova, sans-serif; font-size: 12px; line-height: 22px; margin: 0px 5px; padding-bottom: 15px; padding-left: 45px; padding-top: 15px; width: 292.796875px;" type="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;;}' value='Enter Your Email'/>&nbsp;<input name='uri' type='hidden' value='egytricks'/><input id="subbutton" style="background-color: #407ab4; border-bottom-left-radius: 20px; border-bottom-right-radius: 20px; border-top-left-radius: 20px; border-top-right-radius: 20px; border: 5px none rgb(236, 234, 229); box-shadow: rgb(162, 74, 29) 0px 1px 1px; color: white; cursor: pointer; font-weight: bold; line-height: 22px; margin: 10px 10px 10px 0px; padding: 10px 15px; text-transform: uppercase;" type="submit" value="Sign Up" /></form>
</div>
</div>
</div>
</b:if>

Replace the highlighted word egytricks from above code.

You can also add this Email Subscribe Box as Widget.

Now all done if get any Problem adding this then comment below .
Also Try this Hover Red Css Email Subscribe Box to Blogger

Read More

Hover Red Css Email Subscribe Box to Blogger

This is a Beautiful CSS Type Email Subscribe Box for Blogger you also add this WordPress or any site,in this Post i will tell you how to this Professional look Email Subscribe Widget,as i told this is Css Email Subscribe Box Widget so we will add the CSS to Blogger First.

CSS EFFECT..

Now First we will add the CSS Code in Blogger Template so follow my Simple below Instruction.

• Login to Blogger  >> Click on drop down menu >>then select "Template".
• Now you will see  "EDIT HTML" Button ,Click on it >>  and then click Proceed button .
• Now find this tag </head> by using CTRL + F 
• Paste below code Just Before/above </head> tag  

<link charset='utf-8' href='https://dl.dropbox.com/s/ss1dy8cqp3gfbb1/Email-Subscribe-Blogger.css' media='screen' rel='stylesheet' title='no title' type='text/css'/>

Email Subscribe CODE

Now we can  use below code to add Email Subscribe Box any where we want. you can add it as HTML WIDGET in blogger layout,But i will  Recommend You to add below Email Subscribe Box code to Template.

Just Find below Code in our Template .

<div class='post-footer-line post-footer-line-3'/>

and Below above code add the below code.

<b:if cond='data:blog.pageType == &quot;item&quot;'>
<div id='TWSubscribe'>
<p class='headline'>Subscribe Updates, Its FREE!</p>
<span class='Arrow'/>
<form action='http://feedburner.google.com/fb/a/mailverify' method='post' onsubmit='window.open(&apos;http://feedburner.google.com/fb/a/mailverify?uri=egytricks&apos;, &apos;popupwindow&apos;, &apos;scrollbars=yes,width=550,height=520&apos;);return true' target='popupwindow'> <table><tr><td><input class='Text' 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 name='uri' type='hidden' value='egytricks'/><input name='loc' type='hidden' value='en_US'/></td><td><input class='Button' type='submit' value='Subscribe Now'/></td></tr></table></form>
</div></b:if>

Now all done Save the Template.

Read More