Step by Step Instruction (with Demo and Images) to Add Custom Stylish Email Subscription Wiglets with Free Social Media Integration to Boost Your Blog Traffic.

4 Stylish Email Subscription Widgets For Blogger

Stylish Email Subscription Widgets For Blogger

Email subscription widget is a subscription form for blogger sidebar provided by feedburner, this widget help your interested visitors to get latest updates from your blog via e-mail. People just enter their email address and then click on the "Subscribe" button and then, they would get all your blog's updates right on their email's Inbox. These widgets not only increase your traffic but also helps you to grow a loyal community of readers.

Benefits Of Email Subscription Widget

Email Subscription box is also considered as the best ways to promote a website. Subscription widget help you in creating an active community of readers and boost your blog traffic. More traffic = More AdSense earning. This widget help you to deliver latest posts to your customers instantaneously via Email, and the best part of this widget is that you will get social media links free in it which are going to help you to connect with your customers via social media channels.

How To Add Email Subscription Widget To Blogger

Even blogger provide the Email subscription widget for blogger but that was not as much appealing as a custom stylish email subscription box with social media integration. Custom email subscription widget provide email subscription service as well as social media service. Here are some best subscription widgets for blogger, so choose according to the design of your blog and follow the steps given below:

Steps: How To Add a Stylish Subscription Widget To Blogger

    Adding Font Awesome Stylesheet (Optional)

    firstly, we will add a fontawesome CSS file in the head. Fontawesome provides vectors and icons for websites.

    Note: You can skip this step if you don't want to display social icons

  1. Login to your Blogger account, then go to Theme > Edit HTML.

    Edit HTML Theme
  2. Click anywhere inside the Theme code, then search for the following code:

    </head> Ctrl+F
  3. Paste the below given code just above it

    <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/@fortawesome/[email protected]/css/all.min.css">
  4. Click Save .

  5. Configuration

    Fillup the fields below and generate your code.

  6. Creating Email Subscription widget

  7. Navigate to Layout > Add a Gadget > HTML/JavaScript >

    Add HTML/Javascript widget
  8. Paste your code inside the 'Content'.

  9. Click Save

Read: How to Change Email Subscription Delivery Time

Enjoy !

Now visitors of your blog will be able to subscribe your blog easy by using Subscription widget. For any issues related to above Subscription boxes Please Comment Below. More Subscription widgets will be added soon. Stay Updated, Browse Howbloggerz ! :)

    December 10 2020 + Added
  • Minor design upgrades
  • Made all forms responsive
  • Fontawesome icons
  • Form to simplify configuration process
  • Configuration option - To change heading
  • Configuration option - To change email placeholder
  • Configuration option - To change submit placeholder
  • Configuration option - To enable/disable social icons
  • Configuration option - To enable/disable monocholor for icons
  • Configuration option - No. of icons per line
  • ◧ Changed
  • Google Plus to Instagram
  • Maximum width changed to 300px
  • 4th design
  • - Removed
  • Twitter and facebook scripts to improve page loading speed
  • CSS font declaration so the form can adapt your theme
Love it? Don't forget to Subscribe
  • Jatin
    Jatin
    29 December 2016 at 01:03
    Hey, Thanks for the forms.. I really Liked them.. and are a great help to my Blog..
    prince singh
    prince singh
    13 April 2020 at 01:01
    You are welcome
  • RamuYadavTheTiger
    RamuYadavTheTiger
    27 January 2017 at 23:15
    good
    Saurabh Jarial
    Saurabh Jarial
    29 January 2017 at 18:38
    Thanks RAMU
    Keep blogging, follow howbloggerz.
  • Cyb3R Gh0sT
    Cyb3R Gh0sT
    24 February 2017 at 21:15
    I'm facing this problem"The feed does not have subscriptions by email enabled"
    I have enabled feedburner email Subscribe option, But not working....

    Charis Alexandres
    Charis Alexandres
    25 February 2018 at 05:50
    is not working I place the feed title but the message "The feed does not have subscriptions by email enabled" appear
    $ Jarial
    $ Jarial
    27 February 2018 at 23:50
    1. Goto Feedburner
    2. Click on 'Publicize' tab
    3. Click on 'Email Subscriptions'
    4. Make sure the service is in 'Active' state.
  • Unknown
    Unknown
    8 May 2017 at 14:16
    Thanks You Very Much Great Widgets.
  • Criss Freitas
    Criss Freitas
    9 May 2017 at 02:12

    THANK YOU!!
  • Erica
    Erica
    6 June 2017 at 01:09
    Very nice looking Subscription boxes. Could you tell me what I need to do to add an envelope or email icon to the third one down (the grey box with red button) that you have listed? I'd like people to be able to email me by clicking the envelope icon. Thanks a lot!
    Saurabh Jarial
    Saurabh Jarial
    7 June 2017 at 11:35
    Hello ERICA
    To add email button follow the steps.

    1. Add

    <li class="social-email"><a href="mailto:your email address" title="Email" >Email</a></li>

    above </ul>

    2. Add

    .hbzsocial-icons ul li.social-email a {
        background-position: -32px 1px;
    }

    .hbzsocial-icons ul li.social-email a:hover {
        background-color: #DA472B;
    }

    above </style>

    Let me know if this helps you.
  • Erica
    Erica
    8 June 2017 at 03:16
    Worked like a charm! Thanks so much!
    Saurabh Jarial
    Saurabh Jarial
    8 June 2017 at 14:04
    Keep visiting! Happy blogging
  • Shakeel Younis
    Shakeel Younis
    29 June 2017 at 16:58
    Awesome, thanks for the help, I have further customized it according to my requirements. T
    Saurabh Jarial
    Saurabh Jarial
    29 June 2017 at 17:52
    That's good!
    Happy Blogging
  • CA Nikunj Kikani
    CA Nikunj Kikani
    24 August 2017 at 16:52
    thank you dear
    Saurabh Jarial
    Saurabh Jarial
    11 September 2017 at 22:55
    I am happy to help you.
  • Cocina Ficción
    Cocina Ficción
    12 September 2017 at 21:58
    Hi,
    I would like to add instagram to tast widget. How can I add it?
    Thank you!
    Saurabh Jarial
    Saurabh Jarial
    13 September 2017 at 00:01
    I hope you got my mail with code :)
    Cocina Ficción
    Cocina Ficción
    13 September 2017 at 00:17
    Yes, thank you! ^_^
  • Prasad Pakhare
    Prasad Pakhare
    13 October 2017 at 12:20
    Thanks it was cool!!!!
    i got it done for my blog
    Saurabh Jarial
    Saurabh Jarial
    14 October 2017 at 15:45
    Happy blogging!
  • Pradeep Singh
    Pradeep Singh
    15 October 2017 at 10:50
    How to add an instagram icon?
    Saurabh Jarial
    Saurabh Jarial
    4 December 2017 at 21:34
    Soon I will update this post with Instagram and other icon in widgets. Stay tuned!
  • Tom (Admin)
    Tom (Admin)
    23 October 2017 at 21:25
    Wow awesome widgets bundle of thanks bro...
  • Prasad Pakhare
    Prasad Pakhare
    27 October 2017 at 00:11
    Awesome thanks
  • Ikem Donald Nwokedi
    Ikem Donald Nwokedi
    7 January 2018 at 03:38
    Thanks for the forms I go with number one
  • Unknown
    Unknown
    31 January 2018 at 23:09
    Hi admin, great post. awesome. But why the inner box text 'your email' is showing dark instead of white? cant change that. help
    Saurabh Jarial
    Saurabh Jarial
    6 February 2018 at 00:46
    Hi Subodh,

    Please specify the widget you are talking about.

    Thanks
  • Firman Maulana
    Firman Maulana
    9 March 2018 at 13:31
    Thank you! This work perfectly!
    Saurabh Jarial
    Saurabh Jarial
    9 March 2018 at 22:22
    Happy Blogging!
  • Romain
    Romain
    23 March 2018 at 20:53
    Hi Saurabh Jarial.

    I would like to make the third subscribe box appear horizontal {full page). Can you help me please.

    Thanks
    Saurabh Jarial
    Saurabh Jarial
    9 April 2018 at 09:04
    Hi Romain,
    Please contact me via 'Contact Us'
  • Lana
    Lana
    12 April 2018 at 07:15
    Nice blog
  • Yusril M
    Yusril M
    30 April 2018 at 20:32
    ahh finaly I found it
  • Recalmaru
    Recalmaru
    28 May 2018 at 12:06
    Thanks ^^
  • Unknown
    Unknown
    30 May 2018 at 12:45
    Hi,
    I would like to add instagram to tast widget. How can I add it?
    Thank you!
    Saurabh Jarial
    Saurabh Jarial
    14 June 2018 at 17:29
    I will update this post soon with instagram icon.
    Stay tuned!
  • Sms
    Sms
    22 June 2018 at 14:37
    awesome sir ...
  • Pradip Karmakar
    Pradip Karmakar
    6 July 2018 at 19:44
    hey!nice post ! can u pls tell me how to create a subscription form like ur site :)
    Saurabh Jarial
    Saurabh Jarial
    7 July 2018 at 16:59
    Sure, I'll adding more design soon.
    Stay tuned!
  • ABHILASHA
    ABHILASHA
    11 August 2018 at 13:04
    THank you nice information
  • NDF
    NDF
    22 September 2018 at 03:29
    Works perfectly for my site, thanks for sharing
  • Anonymous
    Anonymous
    16 November 2018 at 11:54
    I did as you said , oh it worked 100% and is same color as my theme.

    Thanks a lot.

    Am recommending on my site. God bless
  • dansar jamuda
    dansar jamuda
    2 January 2019 at 23:11
    thanks dude fanily i set my subscriber widgets successfully with your guide. keep up .
  • Unknown
    Unknown
    22 February 2019 at 18:31
    hey!nice post ! can u pls tell me how to create a subscription form like ur site :)

    Saurabh Jarial
    Saurabh Jarial
    4 May 2019 at 12:16
    New designs will come soon. Stay tuned!
  • Sumaira Kousar
    Sumaira Kousar
    8 March 2019 at 17:56
    thank yous os much . it worked but i want a widget for instagram plz
    Saurabh Jarial
    Saurabh Jarial
    4 May 2019 at 12:04
    Sure! I will write the Instagram article soon.
  • Perfectish
    Perfectish
    12 March 2019 at 18:14
    Thank you so much for this.
    Saurabh Jarial
    Saurabh Jarial
    4 May 2019 at 11:58
    You are Welcome.
  • Zla India
    Zla India
    30 March 2019 at 12:54
    This is not working in my blog.
    I tried a lot
    Saurabh Jarial
    Saurabh Jarial
    24 April 2019 at 16:53
    Please contact me via contact form. Don't forget to add additional details.
  • Filipe Da Silva
    Filipe Da Silva
    22 June 2019 at 05:24
    Hi Jarial,

    Super good work, thank you for sharing.

    I was going around and around, but its complicated for me to add the Instagram and YouTube code on this code of yours, the first one with the big red envelope.

    Can you please add them for me. Ill leave you a donation after that. Thanks in advance.

    Fil
    Saurabh Jarial
    Saurabh Jarial
    4 July 2019 at 16:33
    Hi,

    Thanks for your sayings but I am not accepting donations for now.
    Can you please contact me via contact page so I can offer you help.

    Thanks
  • LoganZ
    LoganZ
    13 August 2019 at 16:38
    Thanks for your article.
  • Bengkel Mobil Kuningmas Auto Care
    Bengkel Mobil Kuningmas Auto Care
    23 October 2019 at 05:23
    Hi thankyou for share this, I have follow your instruction for the feed burner link, but it just show only like and follow (fb & twitter), form email and social icon is white blank, do you know why it happen?
    Saurabh Jarial
    Saurabh Jarial
    24 November 2019 at 11:31
    Please install the widget and let me know the link (via contact form) so I can have a look over the problem.
  • Skete
    Skete
    28 October 2019 at 01:05
    Nice Post
  • Paul Dabuco
    Paul Dabuco
    20 February 2020 at 11:42
    Hi, how can I add youtube and instagram subscription? Thanks
  • Mohd Amir Ansari
    Mohd Amir Ansari
    20 April 2020 at 16:51
    Nice post, Just a query, while I have copy pasted your code, but I am not getting the Facebook Likes with count button in the first widget. Have updated the link of js reference but still could not resolve. Can you help me out please.
    Saurabh Jarial
    Saurabh Jarial
    27 July 2020 at 21:00
    Please contact us via contact us form and attach your code with it.
    Thanks
  • Palash mudi
    Palash mudi
    22 April 2020 at 08:08
    How to popup these widgets?.. I need some expert guides from all.
    Saurabh Jarial
    Saurabh Jarial
    27 July 2020 at 20:57
    A post soon. Stay Connected!
  • Admin
    Admin
    23 July 2020 at 05:17
    Can you write about how to add pop-up email subscription widget on blogger
    Saurabh Jarial
    Saurabh Jarial
    27 July 2020 at 20:58
    Will write post on this. Stay tuned!
  • MorseBlog
    MorseBlog
    25 April 2021 at 20:24
    This seems to use Feedburner and Google is telling me they are deprecating their service. Is there an alternative or is there something I misunderstand?
    Saurabh Jarial
    Saurabh Jarial
    27 June 2021 at 21:11
    You're right! Well there are many to choose from but I personally use MailChimp