Saturday, 31 December 2016

Add a Stunning Email Subscribe Widget to Blogger

Add Stunning Email Subscription Widget to Blogger

Email subscription form lets your blog readers read your latest blogs updates through their subscribed email inbox. As i have already discussed the benefits of adding an email subscription widgets in my recent post CSS3 Email Subscribe Widget for Blogger and i showed you how to add it in your blogger. Today I will show you an amazing email subscription widget with boxes name and email. This is really a nice and professional email subscription widget.

Check out: How to Add Google Feedburner Email Subscribe Widget to Blogger

Adding Email Subscription Widget to Your Blogger

  1. Blogger Dashboard > Template Edit HTML > and past given codes right after the <head>
  2. <link href='' rel='stylesheet' type='text/css'/> <link href='//,700' rel='stylesheet' type='text/css'/>

    If font awesome is already installed to your blogger template then skip the first step and follow the next steps

  3. Go to Blogger Dashboard > Add a Gadget > HTML/JavaScript > and past below codes.
  4. <style type='text/css'> #subscribe-box {background-color:#FFA07A;font-family: 'PT Sans', sans-serif; color:#8B0000; border:#858585 dashed 2px } #subscribe-box p {font-size:22px;color:#8B0000;line-height:20px;padding:10px 20px 0 20px;margin:0;} #subscribe-box .emailfield {padding:0px 20px 10px;} #subscribe-box .emailfield input {background:#f9f9f9;color:#bbb;padding:10px;margin-top:10px;font-size:13px;width:91%;border:0;transition:all 0.4s ease-in-out;} #subscribe-box .emailfield input:focus {background:#fff;outline:none;color:#888;} #subscribe-box .emailfield .submitbutton {background:#444;color:#fff;text-transform:uppercase;font-weight:700;font-size:18px;font-family: 'PT Sans', sans-serif;;border:none;outline:none;width:100%;cursor:pointer;border-radius:3px;transition:all 0.4s ease-in-out;} #subscribe-box .emailfield .submitbutton:active {outline:none;border:none;background:#fff;color:#e25734;}#subscribe-box .emailfield .submitbutton:hover{background:#fff;color:#444;} .creadit a{color: #A7A6A6; float: right; font-size: 8px </style> <div id="subscribe-box"> <center> Get our Latest Updates Right Straight to Your Inbox</center> <div class="emailfield"> <form action="" method="post" onsubmit="', 'popupwindow', 'scrollbars=yes,width=550,height=520');return true" target="popupwindow"><input name="name" onblur="if (this.value == &quot;&quot;) {this.value = &quot;Your Name&quot;;}" onfocus="if (this.value == &quot;Your Name&quot;) {this.value = &quot;&quot;;}" type="text" value="Your Name" /> <input name="email" onblur="if (this.value == &quot;&quot;) {this.value = &quot;Your Email&quot;;}" onfocus="if (this.value == &quot;Your Email&quot;) {this.value = &quot;&quot;;}" type="text" value="Your Email" /> <input name="uri" type="hidden" value="knigulper" /><input name="loc" type="hidden" value="en_US" /> <input class="submitbutton" type="submit" value="Subscribe Now" /> </form> </div> </div> <div class="creadit"> <a href="" target="_blank"> Get This Widget</a></div>


    Replace the blue text with your own feedburner username.

Discover How to Grow Your Blog to 2k+ Visits /Day

Get Free Access

More From Knigulper

Comment Policy

Please Keep in mind that all comments are moderated manually & by default, all the links in comment area are set to nofollow. Using hyperlinks in comment is forbidden and such comments will not be published. Let's enjoy a spam-free conversation.

Speak Your Mind