A colorful and trendy Subscription box 

A subscription box usually contains a dialog to attract your visitors to subscribe and Email form where visitors can submit their Email to receive update from your blog. a Blog without subscription form makes no sense. Subscribers make your Blog Success. The more readership you have the stronger you get. People subscribe to your Feeds only when you publish high quality and relevant content. The most important thing is positioning the subscribe form in near the top of the sidebar and below post.
Therefore to help you with your readership, I will help you creating a Beautiful subscribe box to attract your visitors ;)




Install it To Your Blogger


1. Go to Blogger > Design > Edit HTML 
2. Remember to backup your template  
3. Now Go to Layout > Add a Gadget > Select The HTML/Javascript
4. Paste This code:





<style>.btsubscribe1 {padding: 8px;background-color:#fa6121;background-position:center;background-size:100%;background-repeat:no-repeat;-webkit-transition: all 0.5s ease-in-out;-moz-transition: all 0.5s ease-in-out;-ms-transition: all 0.5s ease-in-out;-o-transition: all 0.5s ease-in-out;transition: all 0.5s ease-in-out;}
.btsubscribe2 {padding: 8px;padding-top:0px;background-color:#ffb739;background-position:center;background-size:100%;background-repeat:no-repeat;-webkit-transition: all 0.5s ease-in-out;-moz-transition: all 0.5s ease-in-out;-ms-transition: all 0.5s ease-in-out;-o-transition: all 0.5s ease-in-out;transition: all 0.5s ease-in-out;text-align:center;}
.buttonSubHomepage2 { height:24px; width:80px; border:solid; border-color:white; font-family:arial black; font-size:14px;  padding-bottom:21px; color:white; background-color:#ffb739; -webkit-border-top-left-radius: 0px;                 -webkit-border-top-right-radius: 0px;                 -webkit-border-bottom-right-radius: 25px;                 -webkit-border-bottom-left-radius: 25px;
                 -moz-border-radius-topleft: 0px;                 -moz-border-radius-topright: 0px;                 -moz-border-radius-bottomright: 25px;                 -moz-border-radius-bottomleft: 25px;
                 border-top-left-radius: 0px;                 border-top-right-radius: 0px;                 border-bottom-right-radius: 25px;                 border-bottom-left-radius: 25px; } .buttonSubHomepage2:hover { background-color:#EA9500; }</style><link href='http://fonts.googleapis.com/css?family=Oswald' rel='stylesheet' type='text/css' /><div class='btsubscribe1' align="center"><div style='color: #FFFFFF; font-weight: bold; font: 22px Oswald; margin: 0px 0px 10px 15px;'>Subscribe Now Free</div><div style='color: #FFFFFF; font-weight: bold; font: 16px Calibri, cursive; margin: 0px 0px 10px 15px;'>Enter your email to get <span style="color:#000000;"><u>FREE</u></span> Tips Daily.</div><div style='margin: 10px 0 0 6px;'><!--Subscription Box--><form action='http://feedburner.google.com/fb/a/mailverify' class='emailform'method='post' onsubmit='window.open(&apos;http://feedburner.google.com/fb/a/mailverify?uri=MyBlogtrick4u&apos;, &apos;popupwindow&apos;, &apos;scrollbars=yes,width=550,height=520&apos;);return true'style='margin: 0pt;' target='popupwindow'><input  name='uri' type='hidden' value='MyBlogtrick4u' /><input name='loc' type='hidden' value='en_US' /><input style="height:24px;width:200px;border:solid;border:hidden;border-radius:5px;font-size:12px;" class='btmailbox' name='email' onblur='if (this.value == &quot;&quot;) {this.value = &quot;Enter your email...&quot;;}'onfocus='if (this.value == &quot;Enter your email...&quot;) {this.value = &quot;&quot;}'type='text' value='Enter your email...' /><br/><input class="buttonSubHomepage2" alt='' title='' type='submit' value='Submit'/></form></div></div><div class="btsubscribe2"><div style='color: #FFFFFF; font-weight: bold; font: 22px Oswald; margin: 0px 0px 10px 15px;'>Follow us on</div><div style=''><!--Facebook URL--><a href='http://www.facebook.com/all-coder.blogspot.in' target='_blank' title='Join us on Facebook'><img src='http://3.bp.blogspot.com/-ChHaXU5VfIE/UJkIg5tptTI/AAAAAAAABEg/kzXjQ2QxEPo/s1600/facebook.png' alt='facebook'/></a><!--Twitter URL--><a href='http://twitter.com/hiteshkatara' rel='nofollow' target='_blank'title='Follow us on Twitter'><img src='http://3.bp.blogspot.com/-aG-POFOiBHc/UJkIkayVTGI/AAAAAAAABE4/hhun4Hjaudw/s1600/twitter.png' alt='twitter'/></a><!--Google+ URL--><a rel="publisher" href='https://plus.google.com/104444597478936840929' target='_blank'title='Follow us on Google+'><img src='http://2.bp.blogspot.com/-gxpckVUYzWI/UJkIh5kHQ5I/AAAAAAAABEo/IlR9Bt-FVBE/s1600/googleplus.png' alt='gplus'/></a><!--LinkedIn URL--><a href='http://in.linkedin.com/pub/Hiteshkatara' rel='nofollow' target='_blank'title='Follow us on LinkedIn'><img src='http://1.bp.blogspot.com/-c7m7fLXHewI/UJPaWsVTZ6I/AAAAAAAAA-M/uvdMMglb8fE/s1600/linkedin-circle-2.png' alt='linkedin'/></a><!--RSS URL--><a href='http://feeds.feedburner.com/MYblogtrick4u' rel='nofollow' target='_blank'title='Subscribe to RSS'><img src='http://4.bp.blogspot.com/-aN0dAN4mIno/UJkIje-dmSI/AAAAAAAABEw/gyK0zwpvjdE/s1600/rss.png' alt='rss'/></a><br/>
</div></div>






Customization:


  • You could edit the title highlighted in YELLOW text
  • To Edit the dialog box, Change the text highlighted in GREEN text
  • Replace the BLUE text with your Feedburner title.
We hoped your blog readership has increased :) If you have a trouble or having an issue with the customization, just use the comment form below ;)






Axact

Axact

Vestibulum bibendum felis sit amet dolor auctor molestie. In dignissim eget nibh id dapibus. Fusce et suscipit orci. Aliquam sit amet urna lorem. Duis eu imperdiet nunc, non imperdiet libero.

Post A Comment:

0 comments: