Stylish Email Subscription Widget For Blogger

Blogger Email Subscription

Do you know what the “Email Subscription Widget” is? The Stylish Email Subscription Widget is a subscription form for Blogger BlogSpot.

Interested visitors to your blog just enter their email addresses in the box and hit the subscribe button on the email subscription box to get all the updates from your blog in their email inbox.

This widget not only increases visitors to your blog but also helps you grow your blog readers’ community.

Must Read: How to Customize Blogger Comment Box?

Stylish Email Subscription Widget for Blogger

By default, the blogger provides an email subscription box, but that email subscription box is not very attractive.

In order to make it attractive and eye-catching, we need to add a stylish email subscription widget for bloggers.

Must Read: How to Download YouTube Profile Picture?

Stylish email boxes attract visitors, and visitors put their emails to get updates in their inboxes. The email subscription widget must be stylish and well-designed.

Advantages of Subscription Widget for BlogSpot:

A stylish email subscription widget for Blogger increases the number of visitors to your website by sending a message of new updates to your blog to their email inbox.

Moreover, AdSense earning depends on the number of visitors to your BlogSpot blog. It means Stylish Email Subscription Widget = More AdSense Earning.

Must Read: Related posts widget for Blogger with Thumbnails

Now I will give you HTML Code and we will come to know how we can add a Custom Email Subscription Widget in Blogger BlogSpot.

Update: Blogger follow by email widget is not working after July 2021.

How to add Subscribe button to Blogger?

Step 1:

Go to –> Blogger

Step 2:

Go to –> Layout

Step 3:

Click –> Add A Gadget

Step 4:

Choose HTML & Paste Given Below Code in Box.

HTML Code From Blogger Email Subscription Widget:

<div class="social-counter">
<style>
@import url(http://fonts.googleapis.com/css?family=Roboto:400,100,300,500,700);
 .wk_subs_box_wrapper{
  background:url('Your Backgroud Image') repeat scroll 0 0 #FFF;
  color:#427FED;
  border-radius: 5px;
  border: 2px solid #0AC4FC;
  font-family: "Roboto";
  font-size:14px;
  line-height:20px;
  padding:1px 20px 10px;
  text-align:center;
  text-transform:uppercase
 }
 .sidebar-subscribe-box-form{
  clear:both;
  display:block;
  margin:10px 0
 }
 form.sidebar-subscribe-box-form{
  clear:both;
  display:block;
  margin:10px 0 0;
  width:auto
 }
 .sidebar-subscribe-box-email-field{
  -moz-border-radius:4px;
  -webkit-border-radius:4px;
  background:#fff;
  border:1px solid #ccc;
  border-radius:4px;
  color:#444;margin:0 0 15px;
  padding:10px 30px;
  width:75%
 }
 .sidebar-subscribe-button{
  -webkit-border-radius: 5;
  -moz-border-radius: 5;
  border-radius: 5px;
  font-family: "Roboto";
  color: #ffffff;
  font-size: 29px;
  background: #3cb0fd;
  padding: 10px 30px 10px 30px;
  width:100%;
  border: solid #ffffff 0px;
  text-decoration: none;
 }
 .sidebar-subscribe-button:hover,.sidebar-subscribe-box-email-button:focus{
  background: #3498db;
  text-decoration: none;
 }
 </style>
 <div class="wk_subs_box_wrapper">
   <p>Subscribe for free</p>
   <div class="sidebar-subscribe-box-form">
    <form action="http://feedburner.google.com/fb/a/mailverify" class="sidebar-subscribe-box-form" method="post" onsubmit="window.open('http://feedburner.google.com/fb/a/mailverify', 'popupwindow', 'scrollbars=yes,width=550,height=520');return true" target="popupwindow">
     <input name="uri" type="hidden" value="freetoreads" />
     <input name="loc" type="hidden" value="en_US" /><input class="sidebar-subscribe-box-email-field" name="email" autocomplete="off" placeholder="Enter your email address"/>
     <input class="sidebar-subscribe-button" title="" type="submit" value="Subscribe Now !" />
    </form>
   </div>
  </div>

Step 5:

Click Save.

Congratulation!

One Response

  1. Heather Gilbert November 26, 2022

Leave a Reply