Hey bloggers whats up,So you want new blogging widget I am having very excellent blogger widget by which you will get lot of subscribers.I already show you how to make pop up email subscription box for blogger but it is very different,it will not automatically open by which visitors will not get irritated.I made it with the help of jquery.
Follow below steps to add this gadget to your blog-
- Go to Blogger Dashboard > Template
- Now find </head> tag in your template
- Add below code just before </head> tag.
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js"></script>
Now we need to add gadget -
- Go to blogger dashboard>layout
- Now add html/javascript.
- Paste the following code there and save it.
<style type="text/css"> #subscribe-button{float: left;position: fixed;bottom: 5%;left: 0;z-index: 999;}#subscribe-widget{display:none;}/* Overlay */ #hb-overlay{background-color:#000;}/* Container */ #hb-container{min-height:350px;min-width:500px;color:#222;background-color:#fff;border:4px solid #ddd;}#hb-container .hb-data{padding:8px;}#hb-container a.hbCloseImg{background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEi3w-IMy7iGQVijwcXaoME7SiKHtFxo4rsYyRrg4NCYC3K2bOghDJzTGPonX_Vu0aLRKSWNMbZ_FkJCjP62smQNB_3SBUr2eWexRmR3ooXhFVNretWMbzdP3R7mdP3lnPL51mSXlZIzRo8x/s1600/hb-close-button.png) no-repeat;width:25px;height:29px;display:inline;z-index:3200;position:absolute;top:-15px;right:-16px;cursor:pointer;}#description{color: #AAAAAA;font-family: times New Roman;font-size: 25px;font-style: italic;}#description img{float: left;height: 80px;padding: 0 25px 0 10px;width: 80px;}#hbfollowForm{padding: 15px;}#hbfollowForm p{margin: 0 0 10px;}#hbfollowForm input:not([type="checkbox"]){width: 93%;margin-top: 4px;margin-bottom: 20px;padding: 10px 5px 10px 25px;border: 1px solid rgb(178, 178, 178);-webkit-appearance: textfield;-webkit-box-sizing: content-box;-moz-box-sizing : content-box;box-sizing : content-box;-webkit-border-radius: 3px;-moz-border-radius: 3px;border-radius: 3px;-webkit-box-shadow: 0px 1px 4px 0px rgba(168, 168, 168, 0.6) inset;-moz-box-shadow: 0px 1px 4px 0px rgba(168, 168, 168, 0.6) inset;box-shadow: 0px 1px 4px 0px rgba(168, 168, 168, 0.6) inset;-webkit-transition: all 0.2s linear;-moz-transition: all 0.2s linear;-o-transition: all 0.2s linear;transition: all 0.2s linear;}#hbfollowForm input:not([type="checkbox"]):active, #hbfollowForm input:not([type="checkbox"]):focus{border: 1px solid rgba(91, 90, 90, 0.7);background: rgba(238, 236, 240, 0.2);-webkit-box-shadow: 0px 1px 4px 0px rgba(168, 168, 168, 0.9) inset;-moz-box-shadow: 0px 1px 4px 0px rgba(168, 168, 168, 0.9) inset;box-shadow: 0px 1px 4px 0px rgba(168, 168, 168, 0.9) inset;}#hbfollowForm .button input{background: none repeat scroll 0 0 #3D9DB3;border: 1px solid #1C6C7A;border-radius: 3px 3px 3px 3px;box-shadow: 0 1px 6px 4px rgba(0, 0, 0, 0.07) inset, 0 0 0 3px #FEFEFE, 0 5px 3px 3px #D2D2D2;color: #FFFFFF;cursor: pointer;font-family:'Arial Narrow', Arial, sans-serif;font-size: 24px;margin-bottom: 10px;padding: 8px 5px;text-shadow: 0 1px 1px rgba(0, 0, 0, 0.5);width: 30%;float: right;}#hbfollowForm .button input:hover{background: #4ab3c6;text-decoration: none;}#hbfollowForm .button input:active, #hbfollowForm .button input:focus{background: rgb(40, 137, 154);position: relative;top: 1px;border: 1px solid rgb(12, 76, 87);-webkit-box-shadow: 0px 1px 6px 4px rgba(0, 0, 0, 0.2) inset;-moz-box-shadow: 0px 1px 6px 4px rgba(0, 0, 0, 0.2) inset;box-shadow: 0px 1px 6px 4px rgba(0, 0, 0, 0.2) inset;}.hbFollowFooter{text-align: center;font: 10px Tahoma, Helvetica, Arial, Sans-Serif;padding: 7px 0;margin-top: 80px;text-shadow: 0px 2px 3px #555;position: absolute;width: 500px;}.hbFollowFooter a{color: #222;text-decoration: none;}.hbFollowFooter a:hover{color: #fff;}<!--[if lt IE 7]> #hb-container a.hbCloseImg{background:none;right:-14px;width:22px;height:26px;filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEi3w-IMy7iGQVijwcXaoME7SiKHtFxo4rsYyRrg4NCYC3K2bOghDJzTGPonX_Vu0aLRKSWNMbZ_FkJCjP62smQNB_3SBUr2eWexRmR3ooXhFVNretWMbzdP3R7mdP3lnPL51mSXlZIzRo8x/s1600/hb-close-button.png', sizingMethod='scale');}#hbfollowForm input{padding: 10px 5px 10px 32px;width: 93%;}#hbfollowForm input[type=checkbox]{width: 10px;padding: 0;}<![endif]--></style><div id="subscribe-button"><a class="subscribe" href="#"><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgM24IJLm1CwYMxT-bzFw3rzREPq6GN3U-7U5L4nKdZtU-o9-kKa_ecs2fi7rxDCufl6QAwpLIBtbm14LMR-2lSd0_Jx1F9VEH17v1UBbxIhWclooqdwQ1nsrpQLYu3i4Ifbf_yo_jMbJU/s1600/20120512043540937_easyicon_cn_72.png" alt="subscribe" /></a></div><div id="subscribe-widget"><div id="hbfollowForm"><img alt="Subscribe" border="0" float="center" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEh7MP5qbWY5VIhuWEZmUuSOMT3ko_WpLC1cfS3z8DM9X-vD_g7btTEXORgBfYpqdd3S-Qn7MA8ONM-6otNag6M9aby1jkFRxuYAovxKgfmXrRojTnGqvuBVmEHPbMNEAda_ZLlxbbACvEEG/s1600/hb-subscribe-via-email.PNG" /><div id='description'><img alt="email" border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEh3S7JDGuB2ae_lMkp1OdcqYdu56aa4YOH5h6pH2HmvpB2Jhl93C-3NqzXFUJcj8fDnwmb8DnLm-acNmlQbg6zTfmy5-a9divn6QHVV0GWpOFY8EznVSt8E__OLVPhtR5R_SFYhz8T16do/s1600/Email_icon_crystal.png" />Subscribe to our mailing list to get the updates to your email inbox...</div><form action="http://feedburner.google.com/fb/a/mailverify" method="post" onsubmit="window.open('http://feedburner.google.com/fb/a/mailverify?uri=lordhtml', 'popupwindow', 'scrollbars=yes,width=550,height=520');return true" target="popupwindow"><input name="email" placeholder="Enter Your Email..." required="required" type="text" /><input name="uri" type="hidden" value="lordhtml" /><input name="loc" type="hidden" value="en_US" /><div class="button"><input type="submit" value="Subscribe" /></div></form></div><div class="hbFollowFooter">Delivered by <a href="http://feedburner.google.com/" target="_blank">FeedBurner</a>| Powered by <a href="http://www.lordhtml.blogspot.com" rel="dofollow" target="_blank">Blogger Widgets</a></div></div><script src="http://helperblogger.x10.mx/scripts/jquery-popup.js"type="text/javascript"></script><script type="text/javascript">jQuery(function(a){a("#subscribe-button .subscribe").click(function(b){a("#subscribe-widget").modal();return false})})</script>
Now replace lordhtml with your feedburner username.
0 comments:
Post a Comment