Browsing Category "Blogger Widgets"

Browsing "Older Posts"

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...
Tags:

Add A Beautiful Subscribe Box In Blogger !

By Muhammad Meer → Friday, December 6, 2013
Posted by Muhammad Meer at 3:13 PM 0 comments
Labels:
Beautiful About Author Widget For Blogger !
To build  a straightforward  and enticing templet style  of blogger  is  to  add  low however helpful  widgets  in  blogger templet.  And concerning The Author gizmo is nice plan to inform your guests concerning yourself and your skills, therefore just for this purpose we have a tendency to solely show helpful gizmos for your blogger templet and nowadays we have a tendency to introduce �About Author� widget for blogger users that is extremely straightforward and enticing, therefore you'll use it on footer in your blogger templet therefore let�s go - See more at: utpakistan...

your blogger template so let�s go

To add this widget follow these simple steps:-
  1. First log in to your Blogger Account
  2. Go to Layout and click on add a gadget
  3. Now add HTML / JavaScript gadget
  4. Now paste the below code in HTML / JavaScript gadget
<!--[if !IE]> --> <style> #profile{ border:2px solid #888; margin:2px 5px 0px 0px; padding:2px; } #profile:hover { border:2px solid #ccc; cursor:pointer; } .opacity  { opacity: 0.5; margin-left: 50px; -moz-transition: all 0.5s ease-out;  -o-transition: all 0.5s ease-out;  -webkit-transition: all 0.5s ease-out;  -ms-transition: all 0.5s ease-out;  transition: all 0.5s ease-out; -moz-transform: rotate(7deg);  -o-transform: rotate(7deg);  -webkit-transform: rotate(7deg);  -ms-transform: rotate(7deg);  transform: rotate(7deg);  filter: progid:DXImageTransform.Microsoft.Matrix(                     M11=0.9961946980917455, M12=-0.08715574274765817, M21=0.08715574274765817, M22=0.9961946980917455, sizingMethod='auto expand'); zoom: 1;  } .opacity:hover  { opacity: 1; margin-left: 0px; -moz-transform: rotate(0deg);  -o-transform: rotate(0deg);  -webkit-transform: rotate(0deg);  -ms-transform: rotate(0deg);  transform: rotate(0deg);  filter: progid:DXImageTransform.Microsoft.Matrix(                     M11=1, M12=0, M21=0, M22=1, sizingMethod='auto expand'); zoom: 1; -moz-box-shadow: 1px 1px 4px #000; -webkit-box-shadow: 1px 1px 4px #000; box-shadow: 1px 1px 4px #000; } </style>    <![endif]--> <style> #profile{ border:2px solid #888; margin:2px 5px 0px 0px; padding:2px; } #profile:hover { border:2px solid #ccc; cursor:pointer; } .opacity  { opacity: 0.5; -moz-transition: all 0.5s ease-out;  -o-transition: all 0.5s ease-out;  -webkit-transition: all 0.5s ease-out;  -ms-transition: all 0.5s ease-out;  transition: all 0.5s ease-out; zoom: 1;  } .opacity:hover  { opacity: 1; zoom: 1; -moz-box-shadow: 1px 1px 4px #000; -webkit-box-shadow: 1px 1px 4px #000; box-shadow: 1px 1px 4px #000; } </style>

and thanks and enjoy!!!!!
Tags:

Beautiful About Author Widget For Blogger !

By Muhammad Meer →
Posted by Muhammad Meer at 1:53 PM 0 comments
Labels:
Subscribe to: Comments ( Atom )