Good day! today I will share a new email subscription widget that includes feedburner chicklet, facebook and a twitter button placed in it. It is a widget similar used in ProBlogger. The subscription form used in ProBlogger is aweber, so we change that to feedburner which mostly blogspot users use. If you want to use this email subscription widget, kindly follow the steps below.
[preview of the widget] |
Adding ProBlogger Clone Email Subscription Widget
1. Go to your blogger dashboard > Layout > Add gadget2. Select > HTML > Javascript
3. Paste below code and click save
<style>
#bgemailsub .subcount{margin:3px 0 0 0;float:right;}
#bgemailsub h5{color:#FFFFFF;font-size:16px;font-weight:bold;margin:0 0 5px 0;text-decoration:none;text-shadow:#2F4249 1px 1px;text-transform:none;line-height:20px;} #bgemailsub img{margin:0 5px 5px 0;}
#bgemailsub #text-8 img{margin:3px 5px 2px 5px;}#bgemailsub #text-10 img{margin:5px 5px 10px 0;} #bgemailsub .textwidget p{margin:0;padding:0;}
#bgemailsub .subscribe{background:#74868C;width:240px;height:190px;margin:10px 0 0 0;padding:10px 15px 10px 15px; z-index:99;}
#bgemailsub .subscribe-line{margin:0;padding:10px 0 10px 0;text-align:center;clear:both;}#bgemailsub .text_input, #bgemailsub .subscribe input.email{background:#FFFFFF url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEimqSnhL5zP_Y7i2tEeCkOMKE-paFvgWI7lm_eYQE3Xdk9Lxht_3ytgKvTwwNJ3_QB71Fj_JXeVuitpDRebT-7LkAQxCRh9jU4PbUGzk_oK1Szc2f5987ZBRxtjRQgI1fKYbpM1-fdmw3zr/s1600/subscribe-icon.png) left no-repeat;width:208px;color:#333333;font-family:Arial,Tahoma,Verdana;font-size:13px;padding:5px 0 4px 30px;margin:5px 5px 10px 0;border:1px solid #C5CFD5;}
</style>
<div id="bgemailsub" class="bgemailsub widget-area">
<div id="text-9" class="widget widget_text"><div class="widget-wrap"> <div class="textwidget"><div class="subscribe">
<h5>Subscribe to the Newsletter:</h5>
<form id="subscribe" action="http://feedburner.google.com/fb/a/mailverify" method="post" target="popupwindow" onsubmit="window.open( 'http://feedburner.google.com/fb/a/mailverify?uri=FromHobby2money', 'popupwindow', 'scrollbars=yes,width=550,height=520');return true">
<input class="text_input" type="text" value="Enter your email address …" id="subbox" onfocus="if ( this.value == 'Enter your email address …') { this.value = ''; }" onblur="if ( this.value == '' ) { this.value = 'Enter your email address …'; }" name="email" />
<input type="hidden" name="uri" value="FromHobby2money" />
<input type="hidden" name="loc" value="en_US" />
<input id="zoosbmt" type="image" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEh1BT-C_ycG_vaEjEpHcUcA_SZ0Kx73faQHgEGd2smVB-aLVxm2nJCTx01MplDwoJvChMEH03WSkKAIYNcebvqnopeLUWkiyQUTOmsnm_NBbgiYFroNoC2J3FRjYH5hWXzZY4u3SkqdQ-3G/s1600/subscribe-button.png" alt="Subscribe" class="subbutton"/>
<a href="http://feeds.feedburner.com/FromHobby2money"><img src="http://feeds.feedburner.com/~fc/FromHobby2money?bg=333333&fg=FFFFFF&anim=1" height="26" width="88" style="border:0" alt="" class="subcount"/></a>
</form>
<div class="subscribe-line">
<a href="http://feeds.feedburner.com/FromHobby2money"><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhOGsXfhYbhd8kdoK2wzl_hLAgnkBLpGEEmRRFaCgsSUEfVK3Jtd_fgzBFI9D7R_bjZ6iejvrm9SBIY_XH32ivArG59XhhdAAbXxxwE3dRnDYCeARN8whNgNTql5vTNBK2uXBzYulPr_A5D/s1600/subscribe-rss.png" alt="Subscribe to RSS"/></a><a href="http://www.facebook.com/FromHobby2Money"><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgjTMuSba7eieD3SWBDAuSd0ItQ4J0v4XqC0hvtHLXgr99uC8aLFtRuxgeD4FK1PEm_BH_s7C3UB8j6jMn8ysRP_F1FVJy-dLXKPgbTlECBFb7AOFsYuO25SoP3nqbylY04LBnewFeqtnJ_/s1600/subscribe-facebook.png" alt="Subscribe to Facebook"/></a><a href="http://www.twitter.com/dadhust"> <img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjJD7USACf3AKVQMT38VNvPsvC7KQs05b9prSsSKT0r6ypUuPoQMyl9UZGOqbmu5BAY5jSi_t_7ERba28iSmKzDnJ9M9Oh-JCfFJd9yullfxwpv-xYe09DIsW878e5QEbZGa4i4_K68wQ3j/s1600/subscribe-twitter.png" alt="Follow on Twitter"/></a>
<p align="center">Join Over <strong>2000</strong> Readers</p>
</div>
</div></div>
</div></div></div>
Customize
- Replace 2000 with your total subscriber count.
- Replace FromHobby2money with your feedburner ID.
- Replace dadhust with your twitter username.
- Replace FromHobby2Money with your facebook fan page username
- Change 74868C if you want to change the background. You can use my color code generator to decide which color you want. Click HERE.
Do you liked it?
Kindly share
Facebook Blogger Plugin: Bloggerized by
Bloggerpreneur
Enhanced by fromhobby2money.blogspot.com