Sunday 25 November 2012

Complete Subscription Box For Blogger

 I am sharing a full featured subscription box for Blogger users. As you can see from figure it contains links to your Facebook fan page,Google+ page and twitter follow button, RSS and most importantly an attractive subscription forum that will further increase the number of subscriber list. 

How to Add Subscription Box to Blogger:-




<!-- Widget By Shahbaz Malik on http://internetricks4u.blogspot.in -->         
<style type="text/css">                                                        
.abtbar{width:300px;float:left;background:#FFF top no-repeat;margin:0 0 10px;padding:10px;border:0px solid #DDD;}.abtbar .abt-credit{}.abtbar .abt-credit a{float:right;font-size:10px;font-weight:bold;text-shadow:1px 1px white;color:#1E598E;text-decoration:none;}.abtbar h2{background:URLundefinedhttps://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEi0iwoBtNpIdlB5YvW6bWsIO9nBUyTtK-JaNkj5jGDPGrbmUYpr1pqZjEpVOFQivlc6BW6CVYownd4uPd968WHF1OseRtpjhVJZR6VQ3_TnYWkqaJp0SA3c6PUtNFi2-tU9VeFDFbu35zM/s1600/%5Bwww.internetricks4u.blogspot.in%5DSUBSCRIBE.gif) no-repeat;height:50px;margin:0px 0 0px 0;padding:0px 20px 0px 0px;font-size:0px;font-family:Sans-serif, Arial, Helvetica;font-weight:bold;text-transform:uppercase;color:#ffffff;text-shadow:0 1px 0 #fff;}.abtbar .count{color:#F17C18;font-size:14px;font-weight:bold;font-family:Helvetica, Arial;height:40px;line-height:40px;vertical-align:middle;width:310px;padding:0 0px 0 4px;margin:0;}.abtbar .count span.bigcount{color:#F17C18;font-size:24px;font-family:Helvetica, Arial;line-height:39px;vertical-align:middle;margin:0px;padding:10px 0px 0px 0;}.abtbar .subicons{border-bottom:1px solid #e6e6e6;margin:0px 0 0px 0;float:left;width:300px;font-family:Helvetica, Arial;font-size:12px;}.abtbar .subicons a{text-decoration:none;color:#333333;}.abtbar .subicons a:hover{text-decoration:underline;color:#333333;}.abtbar .subicons .rssicon{border-right:1px solid #e6e6e6;background:urlundefinedhttps://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgG98BPLbMLMrumtbVrNW0O8KmDDp2gNQ67o8WRGT9nGk1WEgnQ60FWAOcecjeIHhD7hDyh9A4sbYjcjacDrsRHXR2dqiQ92xbTMJsJxjeZnMdatZWWc0Eq214xUpZFY0204d5H5PizfdI/s1600/Widget_icon.png) no-repeat;background-position:0px 5px;min-width:2px;height:48px;line-height:57px;vertical-align:middle;float:left;padding:0px 10px 0px 30px;margin:0 0 0 5px;}.abtbar .subicons .googleicon{border-right:1px solid #e6e6e6;background:urlundefinedhttps://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgG98BPLbMLMrumtbVrNW0O8KmDDp2gNQ67o8WRGT9nGk1WEgnQ60FWAOcecjeIHhD7hDyh9A4sbYjcjacDrsRHXR2dqiQ92xbTMJsJxjeZnMdatZWWc0Eq214xUpZFY0204d5H5PizfdI/s1600/Widget_icon.png) no-repeat;background-position:0px -37px;min-width:2px;height:48px;line-height:57px;vertical-align:middle;float:left;padding:0px 10px 0px 30px;margin:0 0 0 5px;}.abtbar .subicons .fbicon{border-right:1px solid #e6e6e6;background:urlundefinedhttps://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgG98BPLbMLMrumtbVrNW0O8KmDDp2gNQ67o8WRGT9nGk1WEgnQ60FWAOcecjeIHhD7hDyh9A4sbYjcjacDrsRHXR2dqiQ92xbTMJsJxjeZnMdatZWWc0Eq214xUpZFY0204d5H5PizfdI/s1600/Widget_icon.png) no-repeat;background-position:0px -79px;min-width:20px;height:48px;line-height:57px;vertical-align:middle;float:left;padding:0px 10px 0px 30px;margin:0 0 0 5px;}.abtbar .subicons .twittericon{background:urlundefinedhttps://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgG98BPLbMLMrumtbVrNW0O8KmDDp2gNQ67o8WRGT9nGk1WEgnQ60FWAOcecjeIHhD7hDyh9A4sbYjcjacDrsRHXR2dqiQ92xbTMJsJxjeZnMdatZWWc0Eq214xUpZFY0204d5H5PizfdI/s1600/Widget_icon.png) no-repeat;background-position:0px -121px;min-width:20px;height:48px;line-height:57px;vertical-align:middle;float:left;padding:0px 10px 0px 30px;margin:0 0 0 5px;}.abtbar .emailsub{border-bottom:0px solid #e6e6e6;padding:15px 0 0px 0;float:left;width:100%;font-family:Helvetica, Arial;}.abtbar .emailsub .emailicon{background:urlundefinedhttp://www.fordfarmhouse.com/images/email.png) no-repeat 0 2px;float:left;padding:0px 15px 0px 50px;margin:0 0 0 5px;width:300px;line-height:20px;vertical-align:middle;font-size:14px;color:#333;}.abtbar .emailsub .emailupdatesform{margin:15px 0 5px 5px;width:300px;float:left;}.abtbar .emailsub .emailupdatesform input.emailupdatesinput{background:#fff !important;float:left;border:1px solid #d2d2d2;padding:0px 8px 0px 8px;color:#a19999;font-size:12px;height:25px;width:185px;/*border-radius*/-webkit-border-radius:5px;-moz-border-radius:5px;border-radius:5px;}.abtbar .emailsub .emailupdatesform input.joinemailupdates{/*linear-gradient*/background:-webkit-gradientundefinedlinear,left top,left bottom,color-stopundefined#F9EAD4,0),color-stopundefined#F9780E,1));background:-webkit-linear-gradientundefinedtop,#F9EAD4 0%,#F9780E 100%);background:-moz-linear-gradientundefinedtop,#F9EAD4 0%,#F9780E 100%);background:-o-linear-gradientundefinedtop,#F9EAD4 0%,#F9780E 100%);background:linear-gradientundefinedtop,#F9EAD4 0%,#F9780E 100%);background:-webkit-gradientundefinedlinear,left top,left bottom,fromundefined#57ABFE),toundefined#F9780E));border:1px solid #F9780E;text-transform:none;font:bold 12px arial;color:#fff;height:25px;padding:0 12px 0 12px;margin:0 0 0 5px;/*border-radius*/-webkit-border-radius:5px;-moz-border-radius:5px;border-radius:5px;cursor:pointer;}
</style><div class="abtbar">
<h2 class="title">
Subscribe Now!</h2>
<div class="count">
<span class="bigcount"></span>Learn Free Pro Tricks daily </div>
<div class="subicons">
<div class="rssicon">
&nbsp;<a href="http://feeds.feedburner.com/DanishMir" rel="nofollow" target="_blank">  RSS</a></div>
<div class="googleicon">
&nbsp;<a href="https://plus.google.com/102988409875186322276" rel="author" target="_blank"> G+</a></div>
<div class="fbicon">
&nbsp;<a href="http://www.facebook.com/Danishmir.blogspot" rel="nofollow" target="_blank">FB</a></div>
<div class="twittericon">
&nbsp;<a href="https://twitter.com/danishmir178" rel="nofollow" target="_blank">Twitter</a></div>
</div>
<div class="emailsub">
<div class="emailicon">
<div style="color: #3a3a3a; font-family: Helvetica, Arial; font-size: 13px; font-weight: normal; margin: 0; padding: 0; width: 270px;">
Receive Our All Updates  In Your Inbox by &nbsp; &nbsp; submitting your Email ID below.</div>
</div>
<div class="emailupdatesform">
<form action="http://feedburner.google.com/fb/a/mailverify" method="post" onsubmit="window.openundefined'http://feedburner.google.com/fb/a/mailverify?uri=DanishMir', 'popupwindow', 'scrollbars=yes,width=550,height=520');return true" target="popupwindow">
<input class="emailupdatesinput" gtbfieldid="10" name="email" onblur="if undefinedthis.value == '') {this.value = 'Enter your email here...';}" onfocus="if undefinedthis.value == 'Enter your email here...') {this.value = '';}" type="text" placeholder="Enter your email here..." /><input name="uri" type="hidden" value="DanishMir" /><input class="joinemailupdates" type="submit" value="Submit" /></form>
<span class="abt-credit" style="font-family: Arial,Helvetica,sans-serif;"></span></div>
</div>
</div>


Note:-Make Following Modification

Replace 102988409875186322276 with your Google+ profile.
Change Danishmir.blogspot to your Facebook fan page.
Change danishmir178 to your Twitter profile.
Replace DanishMir to your feedburner ID.

No comments:

Post a Comment