Friday , May 29 2020
Home / Blogger Tricks / Best Stylish and Pretty Blogger Newsletter Email Subscription Widget

Best Stylish and Pretty Blogger Newsletter Email Subscription Widget

Best Stylish and Pretty Blogger Newsletter Email Subscription Widgets
Pretty Blogger Newsletter Email Subscription Widgets

Email subscription widget is very important widget for every blogger. You can grow your reader to add this Best Stylish and Pretty Blogger Newsletter Email Subscription Widget. Email subscription widget can grow your traffic source. Cool minded Blogger must used these type email subscription widgets. because in this way reader can get notification about your any activity on your blog. So must use these types email subscription widget.Email subscription widget is attached with Feed Burner account and many people use email subscription as a MailChimp.

Most Pro blogger used email subscription.Got thousands of reader you can also get more of them you just need to believe on me and work hard.Now need to a added email subscription widget. Get thousand of subscriber and become famous Blogger.if you thinking that what is email subscription widget why you asking me to use email subscription widget.

Email Subscription Widget Benefit for Bloggers 

Email subscription widget linked to automatically with Feed burner if you want to use default and simple email subscription widget then just need to click one button and you can add email subscription widget in blogger. in this post I am telling you about Stylish and Pretty Blogger Newsletter Email Subscription Widget for readers attraction. its is very attractive them of email subscription widget. if you came to Email subscription benefit It is very important for Bloggers and Readers because when blogger post a new blog automatically notification will send in readers mail box. then reader easily find superior and useful content.


Stylish and Pretty Blogger Newsletter Email Subscription Widget

Responsive Email Subscription Widget For Blogger

Here is beautiful and stylish blogger newsletter email subscription widget. It is very pretty with cartoon image as nod to Sign Up button with social Icon like Facebook,Twitter and Google+.and also a Feed Burner button and the pretty thing in the below side a Facebook like need to first customize email subscription widget HTML code.

➤Copy the Below code and paste in your Blogger Gadget.

<style type=”text/css”>
.hbzsignup-form {
background: transparent url(“”) no-repeat scroll center center / 268px 110px;
height: 105px;
width: 250px;
margin: 2px auto 60px auto;

.hbzform-inner p {
text-align: center;
color: #fff;
padding: 0px;
font: bold 1px “trebuchet MS”,”Tahoma”;

.hbzemailform {
margin: 120px auto 6px;
width: 500px;

#hbzemailbox {
background:#FF6633 none repeat scroll 0% 0%;
border: medium none;
font: 12px/12px “HelveticaNeue”,Helvetica,Arial,sans-serif;
margin-right: 10px;
box-shadow: 0px 0px 4px rgb(207, 207, 207) inset, 1px 1px 1px rgb(186, 186, 186);
padding: 7px;
box-sizing: content-box;
height: 12px;
vertical-align: top;
display: inline-block;
#hbzemailbutton {
background:#FF6633(to bottom, rgb(202, 434, 40) 0%, rgb(235, 88, 78) 100%) repeat scroll 0% 0%;
box-shadow: 1px 3px 2px rgb(182, 37, 32) inset;
border: medium none;
color: #FF6633;
cursor: pointer;
font: 13px/13px “HelveticaNeue”,Helvetica,Arial,sans-serif;
padding: 10px;
border-radius: 10px;
height: 27px;
display: inline-block;

#hbzemailbutton:hover {
background: transparent linear-gradient(to bottom, #CA3028 0%, #B72420 100%) repeat scroll 0% 0%;

.hbzsocial-icons {
margin: 20px 0 0;
overflow: hidden;
display: block;
text-align: center;

.hbzsocial-icons ul {
display: inline-block;
margin: 0 auto !important;
text-align: center;
padding: 0px

.hbzsocial-icons ul li {
background: transparent !important;
border: none !important;
float: left;
list-style-type: none !important;
margin: 10 4px 10px !important;
padding: 0 !important;

.hbzsocial-icons ul li::before,
.hbzsocial-icons ul li::after {
display: none !important;

.hbzsocial-icons ul li a, .hbzsocial-icons ul li a:hover {
background: url(“”) no-repeat scroll 0 0;
-moz-border-radius: 50%;
-webkit-border-radius: 50%;
border-radius: 50%;
display: block;
height: 38px;
overflow: hidden;
text-indent: -999px;
transition: all 0.25s linear 0s; width: 38px;

.hbzsocial-icons ul a {
background-color: #3b5998;
background-position: -60px 3px;

.hbzsocial-icons ul a {
background-color: #00aced;
background-position: -253px 3px;

.hbzsocial-icons ul a {
background-color: #dd4b39;
background-position: -93px 3px;

.hbzsocial-icons ul a {
background-color: #cb2027;
background-position: -157px 3px;

.hbzsocial-icons ul a {
background-color: #F87E12;
background-position: -189px 3px;
.hbzsocial-icons ul li a:hover {
background-color: #333;

.hbzsocial-like {
display: block;
text-align: center;

.hbzsocial-like tbody, .hbzsocial-like tbody tr {
display: block;

.hbzfb-likes {
display: inline-block;
padding-bottom: 15px;
margin-right: 5px;

.hbztw-follow {
display: inline


<div class=’hbzsignup-form’>
<div class=’hbzform-inner’>
<p>Sign Up for Email Updates</p>
<div class=’hbzemailform’>
<form action=’’ id=’subscribe’ method=’post’ onsubmit=’;;, &apos;popupwindow&apos;, &apos;scrollbars=yes,width=550,height=520&apos;);return true’ target=’popupwindow’>
<input name=’uri’ type=’hidden’ value='[Your Blog uri]’/>
<input name=’loc’ type=’hidden’ value=’en_US’/>
<input id=’hbzemailbox’ name=’email’ required=” type=’text’ placeholder=’Enter your email…’/>
<input id=’hbzemailbutton’ title=” type=’submit’ value=’Sign up’/>

<div class=”hbzsocial-icons”>
<li class=”social-facebook”><a href=”” target=”_blank” title=”Facebook”>Facebook</a></li>
<li class=”social-twitter”><a href=”″ target=”_blank” title=”Twitter”>Twitter</a></li>
<li class=”social-gplus”><a href=”″ target=”_blank” title=”Google+”>Google+</a></li>
<li class=”social-pinterest”><a href=”” target=”_blank” title=”Pinterest”>Pinterest</a></li>
<li class=”social-rss”><a href=”” target=”_blank” title=”RSS”>RSS</a></li>

<table class=’hbzsocial-like’>
<td class=’hbzfb-likes’>
<div id=”fb-root”>
<script>(function(d, s, id) {
var js, fjs = d.getElementsByTagName(s)[0];
if (d.getElementById(id)) return;
js = d.createElement(s); = id;
js.src = “//″;
fjs.parentNode.insertBefore(js, fjs);
}(document, ‘script’, ‘facebook-jssdk’));
<div class=”fb-like” data-href=”[Fb url]” data-layout=”button_count” data-action=”like” data-show-faces=”false” data-share=”false”>
<td class=’hbztw-follow’>

<a href=”” target=”Email subscription widgets”>.</a>

➤Stop now time to replcae some code and URL with your URL

➦[Your Blog uri]

➤When you have succesfully replace links with your now add the Email subscription widget in blogger

How To Add Email Subscription Widget In Blogger

➤Sign in to Blogger

➤Go to Layoutt section

➤Click on Add a Gadget now new popup page will be open now search here HTML/Javascript 

➤Click on + Button and you can see a new empty box now paste the copies code of Email Subscription widget

➤now Click on Save Button

【You have successfully added Best Stylish and Pretty Blogger Newsletter Email Subscription Widget】

How To Add Stylish Email Subscription Widget to Blogger

If you need stylish email subscription widget for your blogger i will create for you 100% free email subscription widget just comment us and tell your design we will create for you free email widget.

About Zahid Ashraf

Asslam-o-Allaikum Friends I am from Layyah Pakistan.its my part time hobby to promote my content on Google because I am Also a SEO expert and YouTube master. Now Earn Money from Google Adsense and Android Apps

Check Also

add scrolling text for wordpress

How To Add Scrolling Text in Blogger or WordPress with HTML Code

Scrolling Text in WordPres You can see in many post there are on the header …

Leave a Reply

Your email address will not be published. Required fields are marked *