Home »

Add New Subscribe Box For Blogger

Thursday, January 2, 2014
 

Add Subscribe by email professionally add very fantastic  Because they contain important features. additions to add one which saves you look at all the add-on unit as it does not take a great deal of coordination Blog Therefore, this addendum is considered important for all bloggers and developers.

How To Add New Subscribe Box For Blogger


Written explanation 

 1) Go to Blogger Dashboard → Layout → Page Elements.
2) Add a HTML/JavaScript Gadget.
3) Paste below code in it.  
<style type='text/css'>
#sidebar-subscribe-box{background:#9df !important;padding:3px 0;margin-top:-6px;
margin-bottom:-17px;}
.sidebar-subscribe-box-wrapper{
background-color:#93d1ea;
background: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhNGtKHe-iPFI7IE8EozFMIwBy4znfdMCD6DDq0WMySk1HUWT6rSoFPwMPQuQhfnymyJJ4QPr8ojq7l5rzSNa4jddYRlwYrKqPOufUMsZLdLgnI4BEhgjDb_Y85SpVDPSWpt1e63DgCFKs/s1600/mail_s.png) right 20px no-repeat;color:#fff;
text-shadow: 0px 1px 1px rgba(0,0,0,0.3);
line-height:20px;
padding:1px 20px 10px;text-align:left;}
.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(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgQb1oICDsZXQ9t0VEGpNxzZxveTQqwF-W1ublRKu2Es-tAGU5K46TI-aiXCQkobZ4EPnj7D5ghBMQtJF1hSPRs8Bds81HBHTfi_jioFf9jQ_XzSyFvSjJt9Gi0foUMNG_IvYLYG9DunWA/s1600/sprites.png) no-repeat 0 -27px;border:1px solid #ccc;border-radius:4px;color:#444;margin:0 0 15px;padding:10px 40px;width:48%;margin-right:-3px;}
.sidebar-subscribe-box-email-button{
box-shadow:none!important;
margin-left:8px;
border-radius: 6px;
width:40px !important;
background:#333;
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;
padding-left:10px;padding-left:1px}
.sidebar-subscribe-box-email-button:hover,.sidebar-subscribe-box-email-button:focus{background:#333}.sidebar-subscribe-box-email-button:active{iframe,object,embed,.yt-border iframe,.yt-border object,.yt-border embed,table{width:20%}embed{border-radius:3px;background:#FFF;border:1px solid #ddd;margin:0;padding:4px 4px 4px}#footer-section{background:#f5f5f5 url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEitG-BunscsUjS0wXFCBKydO8NrqP0zXHoMJsquD7HmVBMY8RsW_NJ06j3O-4xNpjxQ2KFY7psmDaxVjwW1g5K2y4Pk7tAImYC0wj88uQOXqv5rUS_Dpn9OWK7kO-XZDfAmrVEIJ0Eg_wA/h120/bg-pattern.png) repeat top left;border-top:1px solid #aaa;font-family:cambria;font-size:14px;height:100px;margin:10px -30px 5px;padding:0 30px;text-align:center;width:100%}
.border_b {
background: url(http://themes.presslayer.com/Place/wp-content/themes/Place/images/mail_border.png)repeat-x;
z-index:1;
}
.top-border{
margin-bottom:-100px;
}
</style>
<div class="top-border">
<img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiY8siGT21gm_zVRpL8sGP0xmlBvXRIDd8Bdlbhj5CwEVUrIovORHlXEMvCF_srvON7ckzi2VCEStWHy-EqCNkKIAEpiwWd_Hw1_nxthxecJKLq9XVYAl-LW9B1sNcUwUP6CDy0lZJuFPI/s1600/mail_border.png" width="100%" height="3"/>
</div>
<div id="sidebar-subscribe-box"><div class="sidebar-subscribe-box-wrapper">
<br/>
<p><font size="5">Newsletter</font></p>
<br/>
<p>Sign up to receive email updates and to hear what's going on with our company!</p>
<br/>
<div class="sidebar-subscribe-box-form"><form action="http://feedburner.google.com/fb/a/mailverify?uri=USERNAME1" class="sidebar-subscribe-box-form" method="post" onsubmit="window.open('http://feedburner.google.com/fb/a/mailverify?uri=USERNAME1', 'popupwindow', 'scrollbars=yes,width=550,height=520');return true" target="popupwindow"><input name="uri" type="hidden" value="USERNAME1'" /><input name="loc" type="hidden" value="en_US" /><input class="sidebar-subscribe-box-email-field" name="email" autocomplete="off" placeholder="Your email address :)"/><input class="sidebar-subscribe-box-email-button" title="" type="submit" value="OK" /></form></div></div>
</div>
<img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjAYtAmGtuCeNCr_ja7A_3S11jv9yxUzN-AskoP4XuVCzVO220O3l28tjoofiXukhGKlBVfbIjqbZaMQJELPaZNh0qcuPAuaQPjMuu1lm5oJkjRMB3u014lm5r0r5A4rLnLjKpYPe_1wlA/s1600/mail_border+(1).png" width="100%" height="3"/>
4) Customize your setting.Find any word click F3 or Ctrl+F. 
Replace it USERNAME1 with your Feedburner Username. 
5) Save your Widget.





Share On Google+Add This To DeliciousTweet/ReTweet ThisShare on FacebookStumbleUpon ThisDigg This

name is full abdelali tibicht, my country is morocco, care techniques and the development of blogging, my goal through this blog, is to help bloggers develop their blogs through my modest experience gained during my career blogging can.

Follow Me On Twitter Or Facebook

Subscribe to Get Free Blogging Tips And Quality Tutorials Straight in Your Inbox.


Did you like Thread ؟
Tags: