How to make Email Subscription Widget in Blogger?

Currently it is been postponed due to Errors in FeedBurner (Totally my mistake)... Please bear with us until this message disappears...

Hello there,

Do you want your visitors to get notified of your new posts as fast as possible automatically and engage a good amount of Audience Retention to your Website?

©AnandNawal.com | NewsLetter Widget

There are many methods through which you can increase User Engagement but still this Email Subscription or preferably called as NewsLetter is been highly used since a long time.

For Blogger we can also use such service (Thanks to FeedBurner) to let users automatically know about our new content.

Today I am gonna tell you How to add this Email Subscription Widget to your WebSite by using Feedburner as a service to deliver our post notification to users in Email.

Let's start this Tutorial with a short information about FeedBurner and NewsLetter Profits...

What is FeedBurner?

FeedBurner is a Web Feed management service primarily for monetizing RSS feeds. It was acquired by Google in 2007.

FeedBurner is actively been used by Blogger Users since three starting of it but don't issues came which lead to dismissing of some special service of FeedBurner earlier.

How does NewsLetter Profits us?

With a bit of creativity, an Email NewsLetter can grow to become one of the most profitable forms of marketing for your retail business. Unlike Social Media posts and videos, E-mail are not dictated by an algorithm, making them fairly straightforward to optimize.

Newsletters can educate readers about new products, highlight employees, share successes and announce upcoming events or promotions. They even can serve as another advertising source by offering coupons or specials only for those who read the newsletter, which is a smart way to track readership.

Steps to add the Email Subscription Widget to your Website

Step 1: Firstly go to Blogger Dashboard

Step 2: Go to "Layout" and then select any section where you think you can add the newsletter widget with an option on (Add a Gadget).

Step 3: Now select "HTML/JavaScript" and paste the code given below in CodeBox to the content section.

 <!--Email Box by AnandNawal.com-->
<style>@import url('https://fonts.googleapis.com/css?family=Muli:400,700');*,*:before,*:after,input[type="search"]{-webkit-box-sizing:border-box;-moz-box-sizing:border-box;box-sizing:border-box;-webkit-tap-highlight-color:rgba(0,0,0,0);-webkit-tap-highlight-color:transparent}*,*:before,*:after{-webkit-box-sizing:border-box;-moz-box-sizing:border-box;box-sizing:border-box}input,select,textarea{width:100%}#wrapper{max-width:340px;margin:6% auto;background:var(--bodyB);padding:0;color:var(--bodyCa);font-size:16px;line-height:1.6;border-radius:22px;overflow:hidden;box-shadow:0 5px 30px 0 rgba(0,0,0,.05)}#wrapper h3{font-weight:700;margin:0 auto 10px auto}#subscribe-box p{position:relative;overflow:hidden}#subscribe-box p{font-size:14px;color:#767676;margin:0 0 15px;padding:0;line-height:normal}#subscribe-box .emailfield{position:relative;margin:auto;z-index:1}#subscribe-box .emailfield input{background:rgb(255 255 255);padding:13px 20px;color:#aaa;border:1px solid rgba(0,0,0,0.05);font-size:14px;margin-bottom:16px;border-radius:99em}#subscribe-box .emailfield input:focus{color:#222;outline:none;border-color:rgba(0,0,0,0.05);box-shadow:inset 0 0 0 3px rgba(0,0,0,0.05)}#subscribe-box .emailfield .submitbutton{display:block;position:relative;overflow:hidden;background:rgba(255,255,255,.25);color:#fff;width:100%;font-size:15px;font-weight:bold;border:0;margin:auto;box-shadow:0 2px 3px rgba(0,0,0,0.1),0 2px 4px rgba(0,0,0,0.13);transition:all 0.2s cubic-bezier(0.4,0,0.2,1)}#subscribe-box .emailfield .submitbutton:active,#subscribe-box .emailfield .submitbutton:hover{background:rgba(255,255,255,.35);color:#fff;box-shadow:0 3px 3px rgba(0,0,0,0.1),0 3px 4px rgba(0,0,0,0.13)}#subscribe-box .emailfield input:focus.submitbutton{color:#fff}#subscribe-box .emailfield form{position:relative}#subscribe-box .emailfield .submitbuttonlabel{position:absolute;top:3px;right:8px;display:inline;padding:8px 12.5px 8px 20px;cursor:pointer;font-size:13px}#HTML98{position:relative;overflow:hidden;padding:20px}#HTML98:after{content:'';display:block;position:absolute;bottom:0;right:0;width:120px;height:120px;background:rgba(0,0,0,.15);border-radius:120px 0 0;transition:opacity .3s;opacity:1}#HTML98:before{content:'';display:block;position:absolute;bottom:0;right:0;width:120px;height:120px;background:rgba(0,0,0,.15);border-radius:120px 0 0;transition:opacity .3s;opacity:1}#HTML98:hover:after{opacity:0}#HTML98:hover:before{opacity:1}#HTML98 h2:after,#HTML98 h3:after,#subscribe-box .emailfield input[type=submit]{display:none}.drK #subscribe-box p{color:var(--darkT)}.drK #wrapper{background:var(--darkBa)}.drK #subscribe-box .emailfield input{background:var(--darkBs);color:#838383}</style><div id="wrapper"><div id="HTML98"><div id="subscribe-box"><h2 class="title dt"><b>Newsletter</b></h2><p>Get notifications from this blog...</p><div class="emailfield"><form action="https://feedburner.google.com/fb/a/mailverify" method="post" onsubmit="window.open('https://feedburner.google.com/fb/a/mailverify?uri=anandnawal', 'popupwindow', 'scrollbars=yes,width=550,height=520');return true" target="popupwindow"><input required="required" class="emailclass" type="text" name="email" onblur='if (this.value == "") {this.value = "Email Address";}' onfocus='if (this.value == "Email Address") {this.value = "";}' value="Email Address" /><input class="submitbutton" type="submit" id="email-submit" value="Subscribe" /><label class="submitbuttonlabel" for="email-submit"><svg class="icon" viewbox="0 0 24 24" xmlns="https://www.w3.org/2000/svg"><g transform="translate(2.000000, 3.000000)"><path class='svgC' d="M14.1972579,8.17124146e-14 C17.3979916,0.00978563072 19.990286,2.62120148 20,5.84554455 L20,5.84554455 L20,7.30693069 L19.99354,7.4036631 C19.9466817,7.75161611 19.6506049,8.01980198 19.2923485,8.01980198 L19.2923485,8.01980198 L19.2835029,8.0019802 L19.1721336,7.99309967 C19.0257158,7.96959451 18.889286,7.90013647 18.7831177,7.79318503 C18.6504073,7.65949573 18.5758514,7.47817413 18.5758514,7.28910891 L18.5758514,7.28910891 L18.5758514,5.84554455 C18.5518871,3.41954659 16.6054921,1.45879454 14.1972579,1.43465347 L14.1972579,1.43465347 L5.80274215,1.43465347 C3.39450789,1.45879454 1.44811291,3.41954659 1.42414861,5.84554455 L1.42414861,5.84554455 L1.42414861,12.1544554 C1.44811291,14.5804534 3.39450789,16.5412055 5.80274215,16.5653465 L5.80274215,16.5653465 L14.1972579,16.5653465 C16.6054921,16.5412055 18.5518871,14.5804534 18.5758514,12.1544554 C18.6163388,11.7890822 18.922975,11.5127474 19.2879257,11.5127474 C19.6528764,11.5127474 19.9595126,11.7890822 20,12.1544554 C19.990286,15.3787985 17.3979916,17.9902144 14.1972579,18 L14.1972579,18 L5.80274215,18 C2.599996,17.995093 0.00487110525,15.3808258 -1.42108547e-14,12.1544554 L-1.42108547e-14,12.1544554 L-1.42108547e-14,5.84554455 C-1.42108547e-14,2.61713944 2.59797615,8.17124146e-14 5.80274215,8.17124146e-14 L5.80274215,8.17124146e-14 Z M4.29443312,5.38692655 C4.48070099,5.36682207 4.6671823,5.42289927 4.81203008,5.54257426 L4.81203008,5.54257426 L8.96948253,8.85742574 C9.48880627,9.2678976 10.2192875,9.2678976 10.7386112,8.85742574 L10.7386112,8.85742574 L14.8518355,5.54257426 L14.8606811,5.54257426 L14.9473987,5.48291804 C15.2462388,5.30808809 15.6344967,5.37260085 15.8602388,5.64950495 C15.9785304,5.79800076 16.0329385,5.98799536 16.0113373,6.17714498 C15.9897361,6.36629461 15.8939207,6.53887938 15.7452455,6.65643564 L15.7452455,6.65643564 L11.6320212,9.98019802 C10.5861526,10.8280382 9.09540423,10.8280382 8.0495356,9.98019802 L8.0495356,9.98019802 L3.92746572,6.65643564 L3.8513546,6.58355583 C3.61891283,6.32594359 3.59998262,5.92999594 3.821318,5.64950495 C3.93770999,5.50163353 4.10816526,5.40703103 4.29443312,5.38692655 Z"></path></g></svg></label><input name="uri" type="hidden" value="anandnawal" /><input name="loc" type="hidden" value="en_US" /></form></div></div></div></div>

Step 4: Now go to FeedBurner.com and sign up using your account and connect your website to feedburner and allow feeds.

Step 5: Go to FeedBurner Dahsboard and click on "Create Proxy" and then input your website url like this - https://www.example.com/atom.xml in the Feed Url Section just like below -

Step 6:Then click Done and then you will be directed to Proxy Page where you will find a section of Custom Url where just copy whatever you put and that will be your uri="value"

Step 7: You will get your Username there and paste the username in the field whuch is highlighted above to set the email diverted to your Website Feed

Step 8: After everything is fine then just click SAVE

Terms of Use

To appreciate our works, consider keeping the credits in codes. We don't allow to rewrite this post in any manner. Don't copy this post, codes or any part from this article without Permission, it is strictly prohibited. If you do so, Legal Actions will be taken.

Conclusion 

This is all about creating a Email Subscription Widget to your WebSite. I hope you enjoy this article. Please do share this article. And if you are facing problem in any section or you have any question then ask us in comment box.

Some FAQ'S realted to this Post

What is NewsLetter? and How is it Useful?

A NewsLetter is a kind of service that will help users to get notified of new Posts via Email and we will get high amount of Traffic in return if we use NewsLetter service in our Website.

What is FeedBurner?

FeedBurner is a Web Feed management service primarily for monetizing RSS feeds. It was acquired by Google in 2007. FeedBurner is actively been used by Blogger Users since three starting of it but don't issues came which lead to dismissing of some special service of FeedBurner earlier.

Source:
www.anandnawal.com

Currently it is been postponed due to Errors in FeedBurner (Totally my mistake)... Please bear with us until this message disappears...

Go to Link