Tags:

Add A Beautiful Subscribe Box In Blogger !

By Muhammad Meer → Friday, December 6, 2013
Add A Beautiful Subscribe Box In Blogger !
Subscribe Box is extremely vital to through the traffic and conjointly your alternative pages. nowadays I�ll show you the way to feature a fine looking Subscribe hold in Blogger. This box contains your Facebook Page, your RSS Feed, your Google + Account, Twitter Account, which may facilitate the guests to subscribe your web site. This subscribe box have a fine looking look as I�m conjointly victimisation this one....



How To Add This Widget In Blogger ?

  1. First Go to Blogger Dashboard > Layout.
  2. Add a HTML / JavaScript Gadget.
  3. Paste the following code in it.
<div dir="ltr" style="text-align: center;" trbidi="on"><div style="text-align: -webkit-auto;"><span style="background-color: white;"><img alt="button_subscribenow.png (314�89)" height="60" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEidje__A6gmvriqYdZLJ5i-rlI9cbfbar6-1EnAfe6xLysbhHAm4ojUKHKvbU8yNVz2cnMNVZLSTqy-24UzfP3Hq2Sqr7JZV9zLhk9SjBqmIVma8tGV6eBL7ryRYt8sKceBUiuJuSgZmhNC/s1600/1.gif" width="300" /></span></div></div><b></b><div class="subicons" style="background-color: white; border-bottom-color: rgb(230, 230, 230); border-bottom-style: solid; border-bottom-width: 1px; color: #666666; float: left; font-family: Helvetica, Arial; font-size: 12px; line-height: 18px; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; text-align: -webkit-auto; width: 300px;"><div class="rssicon" style="background-attachment: initial; background-clip: initial; background-color: initial; background-image: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgJ_z1chKtHLYfpO2OVSjiiUA5w0p7-8aoUcp30_SiMfCnO8L0K6KFuGPrA3gikRcjjgS-evNu9KiqsRPF4jgL8oAqZVUS4h04se_BDAHoQfcywlZ3cBCpLcXsuVwHbTMhjF2AmGFcld2Eh/s400/rsssprite.png); background-origin: initial; background-position: 0px 5px; background-repeat: no-repeat no-repeat; border-right-color: rgb(230, 230, 230); border-right-style: solid; border-right-width: 1px; float: left; height: 48px; line-height: 57px; margin-bottom: 0px; margin-left: 5px; margin-right: 0px; margin-top: 0px; min-width: 2px; padding-bottom: 0px; padding-left: 30px; padding-right: 10px; padding-top: 0px; vertical-align: middle;"><b>&nbsp;<a href="http://feeds.feedburner.com/utpakistan" rel="nofollow" style="color: #333333; text-decoration: none;" target="_blank">&nbsp;RSS</a></b></div> <div class="googleicon" style="background-attachment: initial; background-clip: initial; background-color: initial; background-image: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgJ_z1chKtHLYfpO2OVSjiiUA5w0p7-8aoUcp30_SiMfCnO8L0K6KFuGPrA3gikRcjjgS-evNu9KiqsRPF4jgL8oAqZVUS4h04se_BDAHoQfcywlZ3cBCpLcXsuVwHbTMhjF2AmGFcld2Eh/s400/rsssprite.png); background-origin: initial; background-position: 0px -37px; background-repeat: no-repeat no-repeat; border-right-color: rgb(230, 230, 230); border-right-style: solid; border-right-width: 1px; float: left; height: 48px; line-height: 57px; margin-bottom: 0px; margin-left: 5px; margin-right: 0px; margin-top: 0px; min-width: 2px; padding-bottom: 0px; padding-left: 30px; padding-right: 10px; padding-top: 0px; vertical-align: middle;"> <b>&nbsp;<a href="https://plus.google.com/u/0/107458552955931931823" rel="author" style="color: #333333; text-decoration: none;" target="_blank">&nbsp;G+</a></b></div> <div class="fbicon" style="background-attachment: initial; background-clip: initial; background-color: initial; background-image: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgJ_z1chKtHLYfpO2OVSjiiUA5w0p7-8aoUcp30_SiMfCnO8L0K6KFuGPrA3gikRcjjgS-evNu9KiqsRPF4jgL8oAqZVUS4h04se_BDAHoQfcywlZ3cBCpLcXsuVwHbTMhjF2AmGFcld2Eh/s400/rsssprite.png); background-origin: initial; background-position: 0px -79px; background-repeat: no-repeat no-repeat; border-right-color: rgb(230, 230, 230); border-right-style: solid; border-right-width: 1px; float: left; height: 48px; line-height: 57px; margin-bottom: 0px; margin-left: 5px; margin-right: 0px; margin-top: 0px; min-width: 20px; padding-bottom: 0px; padding-left: 30px; padding-right: 10px; padding-top: 0px; vertical-align: middle;"> <b>&nbsp;<a href="https://www.facebook.com/pages/utpakistan" rel="nofollow" style="color: #333333; text-decoration: none;" target="_blank">FB</a></b></div> <div class="twittericon" style="background-attachment: initial; background-clip: initial; background-color: initial; background-image: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgJ_z1chKtHLYfpO2OVSjiiUA5w0p7-8aoUcp30_SiMfCnO8L0K6KFuGPrA3gikRcjjgS-evNu9KiqsRPF4jgL8oAqZVUS4h04se_BDAHoQfcywlZ3cBCpLcXsuVwHbTMhjF2AmGFcld2Eh/s400/rsssprite.png); background-origin: initial; background-position: 0px -121px; background-repeat: no-repeat no-repeat; float: left; height: 48px; line-height: 57px; margin-bottom: 0px; margin-left: 5px; margin-right: 0px; margin-top: 0px; min-width: 20px; padding-bottom: 0px; padding-left: 30px; padding-right: 10px; padding-top: 0px; vertical-align: middle;"> <b>&nbsp;<a href="https://twitter.com/utpakistant" rel="nofollow" style="color: #333333; text-decoration: none;" target="_blank">Twitter</a></b><br /> <br /></div></div> <div class="emailsub" style="background-color: white; border-bottom-color: rgb(230, 230, 230); border-bottom-style: solid; border-bottom-width: 0px; color: #666666; float: left; font-family: Helvetica, Arial; font-size: 12px; line-height: 18px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 15px; text-align: -webkit-auto; width: 300px;"> <div class="emailicon" style="background-attachment: initial; background-clip: initial; background-color: initial; background-image: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjloHwt7mOhZ6Cr62zcSuNKyloZkusEmprIBTD4oM6UvEG4xXUKNV8Vf9YPia4UC-PgxyfpZdiO3GbrjduVY_gz7RHYCtB1odp2h9pZoTZWBslD86Co-SptOWrsRr_zbTrRU7cHxl-I2jY/s400/email.png); background-origin: initial; background-position: 0px 2px; background-repeat: no-repeat no-repeat; color: #333333; float: left; font-size: 14px; line-height: 20px; margin-bottom: 0px; margin-left: 5px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 40px; padding-right: 15px; padding-top: 0px; vertical-align: middle; width: 300px;"> <div style="color: #3a3a3a; font-size: 13px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; width: 270px;"> Receive Quality Updates Straight in your &nbsp;&nbsp; Inbox by submitting your Email ID below<b>.</b></div></div> <div class="emailupdatesform" style="float: left; margin-bottom: 5px; margin-left: 5px; margin-right: 0px; margin-top: 15px; width: 300px;"> <form action="http://feedburner.google.com/fb/a/mailverify?uri=blogspot/ImmjQ" method="post" target="popupwindow"> <b><input class="emailupdatesinput" gtbfieldid="10" name="email" style="background-attachment: initial !important; background-clip: initial !important; background-color: rgb(255, 255, 255) !important; background-image: initial !important; background-origin: initial !important; border-bottom-color: rgb(210, 210, 210); border-bottom-left-radius: 5px; border-bottom-right-radius: 5px; border-bottom-style: solid; border-bottom-width: 1px; border-left-color: rgb(210, 210, 210); border-left-style: solid; border-left-width: 1px; border-right-color: rgb(210, 210, 210); border-right-style: solid; border-right-width: 1px; border-top-color: rgb(210, 210, 210); border-top-left-radius: 5px; border-top-right-radius: 5px; border-top-style: solid; border-top-width: 1px; color: #a19999; float: left; height: 25px; padding-bottom: 0px; padding-left: 8px; padding-right: 8px; padding-top: 0px; width: 185px;" type="text" value="Enter your email here..." /><input class="joinemailupdates" style="background-attachment: initial; background-clip: initial; background-color: initial; background-image: -webkit-gradient(linear, 0% 0%, 0% 100%, from(rgb(87, 171, 254)), to(rgb(32, 144, 254))); background-origin: initial; border-bottom-color: rgb(32, 144, 254); border-bottom-left-radius: 5px; border-bottom-right-radius: 5px; border-bottom-style: solid; border-bottom-width: 1px; border-left-color: rgb(32, 144, 254); border-left-style: solid; border-left-width: 1px; border-right-color: rgb(32, 144, 254); border-right-style: solid; border-right-width: 1px; border-top-color: rgb(32, 144, 254); border-top-left-radius: 5px; border-top-right-radius: 5px; border-top-style: solid; border-top-width: 1px; color: white; cursor: pointer; font-family: arial; font-weight: bold; height: 25px; margin-bottom: 0px; margin-left: 5px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 12px; padding-right: 12px; padding-top: 0px; text-transform: uppercase;" type="submit" value="Submit" /></b></form></div></div><b></b>

Customization ?

  • Now replace this http://feeds.feedburner.com/utpakistan  with your RSS Feed address...
  • Rplace this https://plus.google.com/u/0/107458552955931931823 with your Google Plus Address..

  • Replace this https://www.facebook.com/pages/utpakistan  with your Facebook Page Address..

  • Replace this https://twitter.com/utpakistan   with your Twitter Address..

Finnally you are done ! Share with your Friends and if you face any problem then leave a comment...

Post Tags:

Jillur Rahman

I'm Jillur Rahman. A full time web designer. I enjoy to make modern template. I love create blogger template and write about web design, blogger. Now I'm working with Themeforest. You can buy our templates from Themeforest.

Website: http://masala-portfolio-jr.blogspot.com/
Posted by Muhammad Meer at 3:13 PM
Labels:

No Comment to " Add A Beautiful Subscribe Box In Blogger ! "

Subscribe to: Post Comments ( Atom )