Blue Color Social Subscription Widget for Blogger

In this post im gonna explicate how to add together Rss feed subscribe box for  blogger amongst social icons.hope
you lot volition similar it. By using this users tin subscribe your blog. So, it will  attention to teach the novel updates
past times emails. Im using CSS in addition to HTML for this widget.You tin banking company gibe it from below exhibit link.

In this post im gonna explicate how to add together Rss feed subscribe box for Blue Color Social Subscription Widget for Blogger

Add Blue Color Social Subscription Widget

1. Log inwards to blogger concern human relationship in addition to Click drib down.

In this post im gonna explicate how to add together Rss feed subscribe box for Blue Color Social Subscription Widget for Blogger

2. Now choose “Layout” Like Below.

3. Click Add Gadget in addition to select ‘HTML/Javascript

4. Paste below code.

<style> #sidebar-subscribe-box{width:300px;border:1px enterprise #aaa;border-radius:3px;padding:3px 0}  .sidebar-subscribe-box-wrapper{background:url(http://2.bp.blogspot.com/-Y3hbgki8hXE/UXZE9IlUi4I/AAAAAAAAAgI/gIGB-L-HKHo/s1600/background.png) repeat scroll 0 0 #f7f7f7;color:#111;font-size:14px;line-height:20px;padding:1px 20px 10px;text-align:center;text-transform:uppercase}  .sidebar-subscribe-box-form{clear:both;display:block;margin:10px 0}form.sidebar-subscribe-box-form{clear:both;display:block;margin:10px 0 0;width:auto}  .sidebar-subscribe-box-email-field{-moz-border-radius:4px;-webkit-border-radius:4px;background:#fff url(http://3.bp.blogspot.com/-DfHJzP9Mlh4/UXZE9ONhVnI/AAAAAAAAAgM/5xtMqb9biR4/s1600/icons.png) no-repeat 0 -27px;border:1px enterprise #ccc;border-radius:4px;color:#444;margin:0 0 15px;padding:10px 40px;width:68%}  .sidebar-subscribe-box-email-button{background:#09f;border:1px enterprise #007fff;box-shadow:0 1px 0 rgba(255,255,255,0.3) inset, 0 1px 0 transparent;color:#fff;cursor:pointer;font-family:verdana;font-weight:700;padding:10px;text-shadow:1px 1px 0 rgba(0,0,0,.4);text-transform:uppercase;width:100%}  .sidebar-subscribe-box-email-button:hover,.sidebar-subscribe-box-email-button:focus{background:#1ca4ff}  .sidebar-subscribe-box-email-button:active{-moz-box-shadow:0 1px 4px rgba(0,0,0,0.5) inset;-webkit-box-shadow:0 1px 4px rgba(0,0,0,0.5) inset;box-shadow:0 1px 4px rgba(0,0,0,0.5) inset;outline:0}iframe,object,embed,.yt-border iframe,.yt-border object,.yt-border embed,table{width:100%}embed{border-radius:3px;-moz-box-shadow:0 2px 4px rgba(0,0,0,0.2);-webkit-box-shadow:0 2px 4px rgba(0,0,0,0.2);background:#FFF;border:1px enterprise #ddd;box-shadow:0 2px 4px rgba(0,0,0,0.2);margin:0;padding:4px 4px 4px}  #footer-section{border-top:1px enterprise #aaa;box-shadow:inset 0 4px 6px -3px #aaa;font-family:cambria;font-size:14px;height:100px;margin:10px -30px 5px;padding:0 30px;text-align:center;width:100%} a.social-icons{margin-right: 5px;height:45px;width:45px;} a.social-icons:hover { opacity: .7; filter:alpha(opacity=70);} </style>  <div id="sidebar-subscribe-box"> <div class="sidebar-subscribe-box-wrapper">     <br/> <a class="social-icons" href="https://facebook.com/bloggertrix"><img src="http://2.bp.blogspot.com/-0UOzHUdczG4/USDjuyJCndI/AAAAAAAAAY8/5nN8AcBcvHs/s1600/Bloggertrix-facebook.png" /></a> <a class="social-icons" href="https://twitter.com/bloggertrix"><img src="http://2.bp.blogspot.com/-H-E4Ll7i2-0/USDjw3bxgVI/AAAAAAAAAZc/a2kMp8rGRVU/s1600/bloggertrix-twitter.png" /></a> <a class="social-icons" href="https://plus.google.com/userId"><img src="http://3.bp.blogspot.com/--KlnPhT6pRA/USDjvgwOluI/AAAAAAAAAZM/_O8TI0WivQk/s1600/Bloggertrix-Googleplus.png" /></a> <a class="social-icons" href="http://www.feedburner.com/bloggertrix"><img src="http://2.bp.blogspot.com/-kXhnrJzlA_A/USDju5hXjPI/AAAAAAAAAZA/x6NdMR0JFhQ/s1600/Bloggertrix-Rss.png" /></a> <p>Subscribe To Our Email Newsletter & Receive Updates Free</p> <div class="sidebar-subscribe-box-form"><form action="http://feedburner.google.com/fb/a/mailverify?uri=bloggertrix" class="sidebar-subscribe-box-form" method="post" onsubmit="window.open('http://feedburner.google.com/fb/a/mailverify?uri=bloggertrix', 'popupwindow', 'scrollbars=yes,width=550,height=520');return true" target="popupwindow"><input name="uri" type="hidden" value="bloggertrix" /> <input name="loc" type="hidden" value="en_US" /><input class="sidebar-subscribe-box-email-field" name="email" autocomplete="off" placeholder="Enter your electronic mail address here"/> <input class="sidebar-subscribe-box-email-button" title="Blue Color Social Subscription Widget for Blogger" type="submit" value="Subscribe Now !" /></form> </div></div></div> 

* Replace bloggertrix with your facebook username
* Replace bloggertrix  amongst your  twitter Username
* Replace UserId with Googleplus
* Replace bloggertrix amongst feedburner username
*
Replace Bloggertrix amongst your Feedburner ID

5. Now salve your HTML/Javascript’.You are done.
Hope this Blue Color Social Subscription Widget helps to brand your spider web log attractive.
Sumber http://www.bloggertrix.com/