Add Attractive Social/Email Subscription Widget For Blogger

 

Features Of This Widget

1. Attractive Look With Attractive Hover Affect
2. WordPress styled box for blogger
3. This Will Add In Your Sidebar
4. This Will Also Add In Your Footer
5. This Will Increase Your Subscribers
6. This Widget Definitely Gonna Help You A Little
7. Very Easily You Can Add This Widget In Your Blogger Blog
8. Load Faster on Any Browser
9. You can use it on WordPress. 

Why To Add This Widget In Your Blog?

So Friends If You Want To Make Your Blog More Attractive And Responsive Design Then You Should Use This Widget. This Widget Totally Created With HTML And CSS3.
Credits
This Widget Is Totally Created And Developed By Blogger Techniches. So All The Credits Goes To Us. Even This Widget Has No Credit Link So This Widget Is 100% Absouletly Free,  If You Want To Share This Widget In Your Blog Then You'll Need To Link Back To Us.

Tutorial On How Can You Add This Widget

•     Go To Blogger >> Layout >> Add a Gadget
•     Choose "HTML/JavaScript"
•     Paste The Following Code In The Content Box.

<div id="subscribers"><div class="subscriptionboxtitle"><h4>Sign Up With In Seconds</h4><span style="color: white;">Sign Up With Our Newsletter And Get Daily Fresh Updates Straight In Your Inbox (We Hate Spam! We Promise)</span></div><div class="subscriptionsingup"><form action="http://feedburner.google.com/fb/a/mailverify" id="subscribe" method="post" onsubmit="window.open( 'http://feedburner.google.com/fb/a/mailverify?uri=helperstutorial', 'popupwindow', 'scrollbars=yes,width=550,height=520');return true" target="popupwindow"><input id="subscriptionbox" name="email" onblur="if ( this.value == '' ) { this.value = 'Enter your email address.......'; }" onfocus="if ( this.value == 'Enter your email address.........') { this.value = ''; }" type="text" value="Enter your email address......." /><input name="uri" type="hidden" value="helperstutorial /><input name="loc" type="hidden" value="en_US" /><input id="subscribebutton" type="submit" value="Yes, I Want Daily Updates." /><br /><span style="color: white;"><span style="font-size: xx-small;">(</span><span style="font-size: xx-small;">Note:</span></span><span style="color: red; font-size: xx-small;"> </span><span style="color: white; font-size: xx-small;">When signing up you will initially receive a confirmation email requiring your approval to complete the Subscription.<Script Language='Javascript'><!--
document.write(unescape('%3C%61%20%74%61%72%67%65%74%3D%22%5F%62%6C%61%6E%6B%22%20%72%6F%6C%65%3D%22%62%75%74%74%6F%6E%22%20%63%6C%61%73%73%3D%22%63%72%65%64%69%74%73%22%20%68%72%65%66%3D%22%68%74%74%70%3A%2F%2F%77%77%77%2E%61%6C%6C%62%6C%6F%67%74%68%69%6E%67%73%2E%63%6F%6D%2F%22%3E%47%65%74%20%49%74%3C%2F%61%3E'));//--></Script></span><span style="color: white; font-size: x-small;">)</span></form></div><style>

    .subscriptionsingup {    padding: 20px;}

    #subscriptionbox {    padding: 10px 15px 10px 15px;    width: 260px;    text-shadow: none;    font-size: 16px;    color: #009999;    margin-bottom: 7px;transition:background 400ms;}#subscriptionbox:focus{background:#ffcb00;}#subscribebutton {    background: #000;    border: none;    font-weight: 700;    color: #fff;    width: 257px;    padding: 15px;    text-shadow: none;    font-size: 15px;    cursor: pointer;    padding-right: 10px;    margin-left: 2px;}

    .thin {    text-shadow: none;    font-weight: 300;}

    #subscribers {    float: left;    width: 296px;    background: #009909;    border: 4px solid #000;    font-family:open sans;}

    #whatyouget {    background: #03628f;    padding: 10px;}

    ul.whatyougetwith li {    background: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhGW2A_ZtVDoNW41SQzjiXu1D_y3MzcFMQGwPiPcBOBV9YplQEDi31fnwFU2sFYRoURbklr_EUi2-bYh-R8cz6XhEYELajPC7PGIxFAg8qsM0yeunFUlZn3bitOqqeDPP97k99gxVIqkzs/s1600/checkmarkk.png) no-repeat;    margin: 10px;    padding-bottom: 10px;    text-shadow: none;    font-size: 14px;    line-height: 20px;    text-shadow: none;    font-weight: 700;    color: #fff;    overflow: hidden;    padding-left: 25px;}

    .whatyougetwith ul {    margin: 30px 30px 0 25px;    padding: 0 0 0 25px;}

    .subscriptionboxtitle {    height: 110px;    padding: 10px;    background: #009909;}

    .subscriptionboxtitle p {    text-shadow: none;    font-size: 14px;    padding: 0px;    margin: 0px;    line-height: 20px;    color: #fff;    margin-top: 5px;    text-align: center;}

    .subscriptionboxtitle h4 {    text-shadow: none;    font-size: 23px;    margin: 0px;    padding: 0px;    text-align: center;    line-height: 25px;    color: #fff;    padding-top: 15px;    padding-bottom: 10px;}

    </style></div></div>

• Replace    red    Color With Your Feed Burner Name.
• Replace  green  Color With Your Desire Heading.
• Replace    blue   Color With Your Desire Sign Up Message.
• Finally Click On Save Button.
• That's All.

Need Any Help

I Hope! You Successfully Added This Widget In Your Blog. I Hope This Widget Gonna Help You A Little. If Any Kind Of Help or Discussion About This Widget Then Feel Free To Ask Through The Comments. I'm Always Here To Help You In The Blogging World. Also Share Your Views And Thinking About The King Means Comments & One Thing Also Subscribe Us For More Great tutorials, Widgets, SEO Much More About Blogging. Happy Blogging & Peace..!!

Share it →

Tweet