How To Add Amazing Email Subscription Box In Blogger In Telugu

Hello Readers and Viewers, How To Add Email Subscription box In Blogger in Telugu without any HTML and CSS Code problems. So you can Add Email Subscription Box In Blogger after reading the post or watching the video.

Email Subscription Box is an essential widget in Blogger. With the help of the Email Subscription box, you can update your user about your new post via email. This Subscription Box can be used in the sidebar or in your post.

So Future Do Let's Get Started.!

1.Backup Your Blogger Template.

Go To > Blogger > Theme > 3 dots > Backup > Download.

2. Get Feedburner Id.

Go To > Blogger > Layout > Add Widget > Search For "Follow By Email" > Click "+" > In Feedburner URL copy from "blogspotyourcode".

Example:- feeds.feedburner.com/blogspot/Asdaw

Paste that code in notepad and Click Cancel and exit from the layout.

3. Open HTML Editor.

Go To > Blogger > Theme > 3 dots > Edit HTML.

4. Search For Head.

Click in empty space and press CRTL+F and enter in search box "</head>".

5. Copy the code to paste above Head.

Now Copy the below code and paste above </head>

<style type="text/css">@keyframes rotate{100%{-webkit-transform:rotate(1turn);transform:rotate(1turn)}} @keyframes change-background {0% {background: #2ecc71;}50% {background: #e74c3c;}75% {background: #3498db;}100% {background: #2ecc71;}} .rainbow{ position:relative; z-index:0; overflow:hidden; padding:3px } .rainbow::before{ content:''; position:absolute; z-index:-2; left:-50%; top:-50%; width:200%; height:200%; background-color:#2ecc71; background-repeat:no-repeat; background-size:50% 50%,50% 50%; background-position:0 0,100% 0,100% 100%,0 100%; background-image:linear-gradient(#2ecc71,#2ecc71),linear-gradient(#fbb300,#fbb300),linear-gradient(#e74c3c,#e74c3c),linear-gradient(#3498db,#3498db); animation:rotate 8s linear infinite } .rainbow::after{ content:''; position:absolute; z-index:-1; left:5px; top:5px; width:calc(100% - 10px); height:calc(100% - 10px); background:#fff } .tb-subscribe-wrapper{ color:#222; line-height:20px; margin:0; padding:20px } .tb-subscribe-wrapper-head{ padding-bottom:15px; margin-bottom:2px; text-align:center; font-size:25px; color:#64707A!important; border-bottom:1px dashed #64707A; } .tb-subscribe-form{ clear:both; display:block; margin:10px auto; overflow:hidden } .tb-subscribe-wrapper p{ color:#64707A!important; margin-top:10px; font-size:14px } form.tb-subscribe-form{ clear:both; display:block; margin:10px 0 0; width:auto; overflow:hidden } .tb-subscribe-css-email-field{ background:#fff; color:#222; margin:0 0 18px; padding:12px; width:90%; border:1px solid rgba(0,0,0,0.1); outline:0; font-size:14px; text-indent:10px; line-height:20px; border-radius:3px; transition:all .6s } .tb-subscribe-css-email-field:hover,.tb-subscribe-css-email-field:focus{ border-color:rgba(0,0,0,0.3) } .tb-subscribe-css-button{ animation: change-background 8s linear infinite; color:#fff; cursor:pointer; font-weight:500; padding:7px; text-transform:none; width:100%; border:none; font-size:16px; border-radius:3px; transition:all .3s } #limit { max-width: 500px; </style>

Then click Save and Exit HTML Editor.

6.Email Subscription Box In Blogger SideBar.

Go To > Blogger > Layout > Add Gadget > Select "HTML/JavaScript".

In Description, Box Paste the below code but before that paste your Feedburner ID and paste in XXXXX fields in below code.

<div class="rainbow"><div id="tb-subscribe-css"><div class="tb-subscribe-wrapper"><div class="tb-subscribe-wrapper-head">Join Our Newsletter</div>Subscribe to our mailing list and get fresh high quality updates for lifetime.<br /><div class="tb-subscribe-form"><form action="https://feedburner.google.com/fb/a/mailverify?uri=XXXXX" class="tb-subscribe-form" method="post" onsubmit="window.open('https://feedburner.google.com/fb/a/mailverify?uri=XXXXX', 'popupwindow', 'scrollbars=yes,width=550,height=520');return true" target="popupwindow"><input name="uri" type="hidden" value="XXXXX" /><input name="loc" type="hidden" value="en_US" /><input autocomplete="off" class="tb-subscribe-css-email-field" name="email" placeholder="Enter your email address" /><input class="tb-subscribe-css-button" title="" type="submit" value="Submit" /></form></div></div></div></div>

Copy the Above Code Manually. 

Now In the Above Code which you add your feed burner Id in it in the description box and click SAVE.

7.Adding Email Subscription box In Blogger Post.

Go To > Blogger > Posts > New Post (or) Existing Posts.

Select HTML view and Paste your code.

<center><div id="limit"><div class="rainbow"><div id="tb-subscribe-css"><div class="tb-subscribe-wrapper"><div class="tb-subscribe-wrapper-head">Join Our Newsletter</div>Subscribe to our mailing list and get fresh high quality updates for lifetime.<br /><div class="tb-subscribe-form"><form action="https://feedburner.google.com/fb/a/mailverify?uri=XXXXX" class="tb-subscribe-form" method="post" onsubmit="window.open('https://feedburner.google.com/fb/a/mailverify?uri=XXXXX', 'popupwindow', 'scrollbars=yes,width=550,height=520');return true" target="popupwindow"><input name="uri" type="hidden" value="XXXXX" /><input name="loc" type="hidden" value="en_US" /><input autocomplete="off" class="tb-subscribe-css-email-field" name="email" placeholder="Enter your email address" /><input class="tb-subscribe-css-button" title="" type="submit" value="Submit" /></form></div></div></div></div></div></center>

Copy the Above Code Manually. 

Paste the Above code but before that paste your Feedburner ID and paste in XXXXX fields in the above code.

Conclusion:-

This is How To Add Email Subscription box In Blogger post and sidebar. In this post, I have shown you How To Add Email Subscription Box In Blogger and also in post. If your facing any trouble while adding the above code let me know in the comments.