Home All posts

Tuesday 5 June 2012

Recent Comments Widget For Blogger

Add Recent Comments Widget Display Last 5 Comments in Sidebar on your blog . To Add this comments widget follow the simple Procedure:


  • Go to your blog > Layout > Add A Gadget > Feeds




  • The Feed Gadget will ask you for Feed URL, you need to
  • http://YOURSITE.blogspot.com/feeds/comments/default




  • Click on continue




  • Change title with Recent Comments/Latest Comment and you're done by the way style of your recent comments widget depends on your blogger template :D for any help please comment and i'll try to help you out.

Recent Posts Widget For Blogger


Ok so recent posts widget is the one of the best widgets for blogger to show whats new on your blog and its so easy to add this you don't need any html or css coding just some simple steps to follow from the picture tutorial below.....


  • Go to your blog > Layout > Add A Gadget > Feed Widget



  • Enter the feed url of your blog and click on continue....




  • Almost done just change title to Recent Posts/Latest Posts and chose number of posts you want to show and click on save and we're done.....

How To Redirect Your Blogger Blog To Another Blog/URL


  • Go to your blog > Template > Edit Html and search for <head>
  • Just post the script just below <head>
<meta content="5;url=http://YOUR NEW URL HERE" http-equiv="refresh"/>
  • 5 is that number of seconds after redirection will begin and if you want to redirect your blog without any waiting and just change it's value to 0.
Thats it if any one is having any problem then just post it in comment section below and i'll try to help you out as soon as posible.

Monday 4 June 2012

Multi-Tab Widget For Blogger


Ok guys some days ago i found this tutorial on a blog call MBT so i thought i should share this with you first of all ....all rights of this tutorial goes to MBT visit his blog and thanks for posting this :D ok so here we go.....
  • Go to Blogger > Layout > Edit HTML
  • Search For </head>
  • And paste the code below just above it,
<script type='text/javascript'>
//<![CDATA[
document.write('<style type="text/css">.tabber{display:none;}<\/style>');
function tabberObj(argsObj)
{
  var arg;
  this.div = null;
  this.classMain = "tabber";
  this.classMainLive = "tabberlive";
  this.classTab = "tabbertab";
  this.classTabDefault = "tabbertabdefault";
  this.classNav = "tabbernav";
  this.classTabHide = "tabbertabhide";
  this.classNavActive = "tabberactive";
  this.titleElements = ['h2','h3','h4','h5','h6'];
  this.titleElementsStripHTML = true;
  this.removeTitle = true;
  this.addLinkId = false;
  this.linkIdFormat = '<tabberid>nav<tabnumberone>';
  for (arg in argsObj) { this[arg] = argsObj[arg]; }
  this.REclassMain = new RegExp('\\b' + this.classMain + '\\b', 'gi');
  this.REclassMainLive = new RegExp('\\b' + this.classMainLive + '\\b', 'gi');
  this.REclassTab = new RegExp('\\b' + this.classTab + '\\b', 'gi');
  this.REclassTabDefault = new RegExp('\\b' + this.classTabDefault + '\\b', 'gi');
  this.REclassTabHide = new RegExp('\\b' + this.classTabHide + '\\b', 'gi');
  this.tabs = new Array();
  if (this.div) {
    this.init(this.div);
    this.div = null;
  }
}
tabberObj.prototype.init = function(e)
{
  var
  childNodes,
  i, i2,
  t,
  defaultTab=0,
  DOM_ul,
  DOM_li,
  DOM_a,
  aId,
  headingElement;
  if (!document.getElementsByTagName) { return false; }
  if (e.id) {
    this.id = e.id;
  }
  this.tabs.length = 0;
  childNodes = e.childNodes;
  for(i=0; i < childNodes.length; i++) {
    if(childNodes[i].className &&
       childNodes[i].className.match(this.REclassTab)) {
      t = new Object();
      t.div = childNodes[i];
      this.tabs[this.tabs.length] = t;
      if (childNodes[i].className.match(this.REclassTabDefault)) {
    defaultTab = this.tabs.length-1;
      }
    }
  }
  DOM_ul = document.createElement("ul");
  DOM_ul.className = this.classNav;
  for (i=0; i < this.tabs.length; i++) {
    t = this.tabs[i];
    t.headingText = t.div.title;
    if (this.removeTitle) { t.div.title = ''; }
    if (!t.headingText) {
      for (i2=0; i2<this.titleElements.length; i2++) {
    headingElement = t.div.getElementsByTagName(this.titleElements[i2])[0];
    if (headingElement) {
      t.headingText = headingElement.innerHTML;
      if (this.titleElementsStripHTML) {
        t.headingText.replace(/<br>/gi," ");
        t.headingText = t.headingText.replace(/<[^>]+>/g,"");
      }
      break;
    }
      }
    }
    if (!t.headingText) {
      t.headingText = i + 1;
    }
    DOM_li = document.createElement("li");
    t.li = DOM_li;
    DOM_a = document.createElement("a");
    DOM_a.appendChild(document.createTextNode(t.headingText));
    DOM_a.href = "javascript:void(null);";
    DOM_a.title = t.headingText;
    DOM_a.onclick = this.navClick;
    DOM_a.tabber = this;
    DOM_a.tabberIndex = i;
    if (this.addLinkId && this.linkIdFormat) {
      aId = this.linkIdFormat;
      aId = aId.replace(/<tabberid>/gi, this.id);
      aId = aId.replace(/<tabnumberzero>/gi, i);
      aId = aId.replace(/<tabnumberone>/gi, i+1);
      aId = aId.replace(/<tabtitle>/gi, t.headingText.replace(/[^a-zA-Z0-9\-]/gi, ''));
      DOM_a.id = aId;
    }
    DOM_li.appendChild(DOM_a);
    DOM_ul.appendChild(DOM_li);
  }
  e.insertBefore(DOM_ul, e.firstChild);
  e.className = e.className.replace(this.REclassMain, this.classMainLive);
  this.tabShow(defaultTab);
  if (typeof this.onLoad == 'function') {
    this.onLoad({tabber:this});
  }
  return this;
};
tabberObj.prototype.navClick = function(event)
{
  var
  rVal,
  a,
  self,
  tabberIndex,
  onClickArgs;
  a = this;
  if (!a.tabber) { return false; }
  self = a.tabber;
  tabberIndex = a.tabberIndex;
  a.blur();
  if (typeof self.onClick == 'function') {
    onClickArgs = {'tabber':self, 'index':tabberIndex, 'event':event};
    /* IE uses a different way to access the event object */
    if (!event) { onClickArgs.event = window.event; }
    rVal = self.onClick(onClickArgs);
    if (rVal === false) { return false; }
  }
  self.tabShow(tabberIndex);
  return false;
};
tabberObj.prototype.tabHideAll = function()
{
  var i;
  for (i = 0; i < this.tabs.length; i++) {
    this.tabHide(i);
  }
};
tabberObj.prototype.tabHide = function(tabberIndex)
{
  var div;
  if (!this.tabs[tabberIndex]) { return false; }
  div = this.tabs[tabberIndex].div;
  if (!div.className.match(this.REclassTabHide)) {
    div.className += ' ' + this.classTabHide;
  }
  this.navClearActive(tabberIndex);
  return this;
};
tabberObj.prototype.tabShow = function(tabberIndex)
{
  var div;
  if (!this.tabs[tabberIndex]) { return false; }
  this.tabHideAll();
  div = this.tabs[tabberIndex].div;
  div.className = div.className.replace(this.REclassTabHide, '');
  this.navSetActive(tabberIndex);
  if (typeof this.onTabDisplay == 'function') {
    this.onTabDisplay({'tabber':this, 'index':tabberIndex});
  }
  return this;
};
tabberObj.prototype.navSetActive = function(tabberIndex)
{
  this.tabs[tabberIndex].li.className = this.classNavActive;
  return this;
};
tabberObj.prototype.navClearActive = function(tabberIndex)
{
  this.tabs[tabberIndex].li.className = '';
  return this;
};
function tabberAutomatic(tabberArgs)
{
  var
    tempObj,
    divs,
    i;
  if (!tabberArgs) { tabberArgs = {}; }
  tempObj = new tabberObj(tabberArgs);
  divs = document.getElementsByTagName("div");
  for (i=0; i < divs.length; i++) {
    if (divs[i].className &&
    divs[i].className.match(tempObj.REclassMain)) {
      tabberArgs.div = divs[i];
      divs[i].tabber = new tabberObj(tabberArgs);
    }
  }
  return this;
}
function tabberAutomaticOnLoad(tabberArgs)
{
  var oldOnLoad;
  if (!tabberArgs) { tabberArgs = {}; }
  oldOnLoad = window.onload;
  if (typeof window.onload != 'function') {
    window.onload = function() {
      tabberAutomatic(tabberArgs);
    };
  } else {
    window.onload = function() {
      oldOnLoad();
      tabberAutomatic(tabberArgs);
    };
  }
}
/* Run tabberAutomaticOnload() unless the "manualStartup" option was specified */
if (typeof tabberOptions == 'undefined') {
    tabberAutomaticOnLoad();
} else {
  if (!tabberOptions['manualStartup']) {
    tabberAutomaticOnLoad(tabberOptions);
  }
}
//]]>
</script>
  • Now search for ]]></b:skin>  and just above it paste this code,
/*---------- Tabber Start-------- */
.tabberlive{
margin:0;
padding:5px;
clear:both;
background:$tbbxbgcolor;
border:1px solid $tbbxbrcolor;
}
.tabbernav {
margin:0;
padding: 3px 0;
border-bottom: 1px solid $tbbxbrcolor;
font-family:Arial,Helvetica,sans-serif;
font-size:12px;
font-weight:bold;
}
.tabbernav li {
list-style:none;
margin:0;
display:inline;
}
.tabbernav li a {
padding:3px 0.5em;
margin-right:1px;
border:1px solid $tbbxbrcolor;
border-bottom:none;
background:$tbbxcolor2;
text-decoration:none;
color:$tbbxcolor1;
}
.tabbernav li a:hover {
color:$tbbxcolor2;
background:$tbbxcolor1;
border-color:$tbbxbrcolor;
text-decoration:none;
}
.tabbernav li.tabberactive a,
.tabbernav li.tabberactive a:hover {
background:$tbbxcolor1;
color:$tbbxcolor2;
border-bottom: 1px solid $tbbxcolor1;
}
.tabberlive .tabbertab {
padding:5px;
border:1px solid $tbbxbrcolor;
border-top:0;
background:$tbbxcolor1;
}
.tabberlive .tabbertab h2,
.tabberlive .tabbertabhide {
display:none;
}
.tabbertab .widget-content ul{
list-style:none;
margin:0 0 10px 0;
padding:0;
}
.tabbertab .widget-content li {
border-bottom:1px solid $tbbxbrcolor;
margin:0 5px;
padding:2px 0 5px 0;
}
/*------- Tabber End--------*/

  • Don’t save your template. Now search for Variable definitions and paste this code with other variable definitions,
<Variable name="tbbxbgcolor" description="Tab box Background Color" type="color" default="#f8f8f8" value="#f8f8f8">
<Variable name="tbbxbrcolor" description="Tab box Border Color" type="color" default="#dcdcdc" value="#dcdcdc">
<Variable name="tbbxcolor1" description="Tab box Color 1" type="color" default="#ffffff" value="#ffffff">
<Variable name="tbbxcolor2" description="Tab box Color 2" type="color" default="#5588aa" value="#5588aa">
  • If you can’t find Variable definitions  then search for #navbar-iframe and paste this code below #navbar-iframe { Some text here }
/* Variable definitions
   ====================
<Variable name="tbbxbgcolor" description="Tab box Background Color" type="color" default="#f8f8f8" value="#f8f8f8">
<Variable name="tbbxbrcolor" description="Tab box Border Color" type="color" default="#dcdcdc" value="#dcdcdc">
<Variable name="tbbxcolor1" description="Tab box Color 1" type="color" default="#ffffff" value="#ffffff">
<Variable name="tbbxcolor2" description="Tab box Color 2" type="color" default="#5588aa" value="#5588aa">
*/
  • Now the final part. Search for <div id='sidebar-wrapper'> and paste this code just below it,
<div style='clear:both;'/>
<div class='tabber'>
<b:section class='tabbertab' id='tab1' maxwidgets='1'/>
<b:section class='tabbertab' id='tab2' maxwidgets='1'/>
<b:section class='tabbertab' id='tab3' maxwidgets='1'/>
<b:section class='tabbertab' id='tab4' maxwidgets='1'/>
</div>
  • Finally save your template and visit Layout > Page Elements to start adding widgets to the tabs! 
You can change number of the tabs by changing last code just add tab5 or delete tab4 :D
 for any type of help comment.

Sunday 3 June 2012

Hex Color Code Generator

Saturday 2 June 2012

Disable Copy Content Of Your Blogger


A guy on fb started a blog on WWE just like me and he just copy and paste all news from my site and i hated that so much so then i hacked his all gmail accounts and deleted all of them damn he had over seven gmail it was so hard to know from which one the blog is running :p but it was so hard to know his mails and hack them so for future i wanted to secure content from my site so i searched on google and found a solution about it......so if you want to block/disable copying content from your site then just this code from below on your blogger.....please don't change anything from the code or it won't work thanks


  • Just add this widget on your blogger and we're done : 

Wednesday 30 May 2012

Stylish Round Cornered CSS Menu For Blogger


Go To Blog > Layout > Add A Gadget > HTML/Java Script > Paste The Script From Below On It


<style type="text/css">
#menu-bar {
  margin: 0px 0px 0px 0px;
  padding: 8px 4px 1px 6px;
  height: 32px;
  line-height: 100%;
  border-radius: 50px;
  -webkit-border-radius: 50px;
  -moz-border-radius: 50px;
  box-shadow: 2px 2px 3px #666666;
  -webkit-box-shadow: 2px 2px 3px #666666;
  -moz-box-shadow: 2px 2px 3px #666666;
  background: #E67074;
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr=#A9A6A6, endColorstr=#7A7A7A);
  background: -webkit-gradient(linear, left top, left bottom, from(#A9A6A6), to(#7A7A7A));
  background: -moz-linear-gradient(top,  #A9A6A6,  #7A7A7A);
  border: solid 0px #6D6D6D;
}
#menu-bar li {
  margin: 0px 6px 0px 6px;
  padding: 0px 0px 6px 0px;
  float: left;
  position: relative;
  list-style: none;
}
#menu-bar a {
  font-weight: bold;
  font-family: arial;
  font-style: normal;
  font-size: 13px;
  color: #E7E5E5;
  text-decoration: none;
  display: block;
  padding: 9px 20px 8px 20px;
  margin: 0;
  border-radius: 50px;
  -webkit-border-radius: 50px;
  -moz-border-radius: 50px;
  text-shadow: 2px 2px 3px #000000;
}
#menu-bar .current a, #menu-bar li:hover > a {
  background: #0399D4;
  filter:  progid:DXImageTransform.Microsoft.gradient(startColorstr=#EBEBEB, endColorstr=#A1A1A1);
  background: -webkit-gradient(linear, left top, left bottom, from(#EBEBEB), to(#A1A1A1));
  background: -moz-linear-gradient(top,  #EBEBEB,  #A1A1A1);
  color: #444444;
  -webkit-box-shadow: 0 1px 1px rgba(0, 0, 0, .2);
  -moz-box-shadow: 0 1px 1px rgba(0, 0, 0, .2);
  box-shadow: 0 1px 1px rgba(0, 0, 0, .2);
  text-shadow: 1px 2px 21px #FFFFFF;
}
#menu-bar ul li:hover a, #menu-bar li:hover li a {
  background: none;
  border: none;
  color: #666;
  -box-shadow: none;
  -webkit-box-shadow: none;
  -moz-box-shadow: none;
}
#menu-bar ul a:hover {
  background: #0399D4 !important;
  filter:  progid:DXImageTransform.Microsoft.gradient(startColorstr=#04ACEC, endColorstr=#0186BA);
  background: -webkit-gradient(linear, left top, left bottom, from(#04ACEC), to(#0186BA)) !important;
  background: -moz-linear-gradient(top,  #04ACEC,  #0186BA) !important;
  color: #FFFFFF !important;
  border-radius: 0;
  -webkit-border-radius: 0;
  -moz-border-radius: 0;
  text-shadow: 2px 2px 3px #FFFFFF;
}
#menu-bar ul {
  background: #DDDDDD;
  filter:  progid:DXImageTransform.Microsoft.gradient(startColorstr=#FFFFFF, endColorstr=#CFCFCF);
  background: -webkit-gradient(linear, left top, left bottom, from(#FFFFFF), to(#CFCFCF));
  background: -moz-linear-gradient(top,  #FFFFFF,  #CFCFCF);
  display: none;
  margin: 0;
  padding: 0;
  width: 185px;
  position: absolute;
  top: 30px;
  left: 0;
  border: solid 1px #B4B4B4;
  border-radius: 10px;
  -webkit-border-radius: 10px;
  -moz-border-radius: 10px;
  -webkit-box-shadow: 2px 2px 3px #222222;
  -moz-box-shadow: 2px 2px 3px #222222;
  box-shadow: 2px 2px 3px #222222;
}
#menu-bar li:hover > ul {
  display: block;
}
#menu-bar ul li {
  float: none;
  margin: 0;
  padding: 0;
}
#menu-bar ul a {
  padding:10px 0px 10px 15px;
  color:#424242 !important;
  font-size:12px;
  font-style:normal;
  font-family:arial;
  font-weight: normal;
  text-shadow: 2px 2px 3px #FFFFFF;
}
#menu-bar ul li:first-child > a {
  border-top-left-radius: 10px;
  -webkit-border-top-left-radius: 10px;
  -moz-border-radius-topleft: 10px;
  border-top-right-radius: 10px;
  -webkit-border-top-right-radius: 10px;
  -moz-border-radius-topright: 10px;
}
#menu-bar ul li:last-child > a {
  border-bottom-left-radius: 10px;
  -webkit-border-bottom-left-radius: 10px;
  -moz-border-radius-bottomleft: 10px;
  border-bottom-right-radius: 10px;
  -webkit-border-bottom-right-radius: 10px;
  -moz-border-radius-bottomright: 10px;
}
#menu-bar:after {
  content: ".";
  display: block;
  clear: both;
  visibility: hidden;
  line-height: 0;
  height: 0;
}
#menu-bar {
  display: inline-block;
}
  html[xmlns] #menu-bar {
  display: block;
}
* html #menu-bar {
  height: 1%;
}
</style>




<ul id="menu-bar">
 <li class="current"><a href="#">Home</a></li>
 <li><a href="#">Products</a>
  <ul>
   <li><a href="#">Products Sub Menu 1</a></li>
   <li><a href="#">Products Sub Menu 2</a></li>
   <li><a href="#">Products Sub Menu 3</a></li>
   <li><a href="#">Products Sub Menu 4</a></li>
  </ul>
 </li>
 <li><a href="#">Services</a>
  <ul>
   <li><a href="#">Services Sub Menu 1</a></li>
   <li><a href="#">Services Sub Menu 2</a></li>
   <li><a href="#">Services Sub Menu 3</a></li>
   <li><a href="#">Services Sub Menu 4</a></li>
  </ul>
 </li>
 <li><a href="#">About</a></li>
 <li><a href="http://widcraft.blogspot.com">Get This</a></li>
</ul>


Change # with page/post url and names with custom names.....Thats It.....Leave Questions And Requests Below :D

Stylish CSS Menu For Blogger




Go To Blog > Layout > Add A Gadget > HTML/Java Script > Paste The Script From Below On It

**Note : Due to some errors we removed search bar thanks :D**


<style type="text/css">
.invertedshiftdown{
padding: 0;
width: 100%;
border-top: 5px solid #D10000; /*Red color theme*/
background: transparent;
voice-family: "\"}\"";
voice-family: inherit;
}
.invertedshiftdown ul{
margin:0;
margin-left: 40px; /*margin between first menu item and left browser edge*/
padding: 0;
list-style: none;
}
.invertedshiftdown li{
display: inline;
margin: 0 2px 0 0;
padding: 0;
text-transform:uppercase;
}
.invertedshiftdown a{
float: left;
display: block;
font: bold 12px Arial;
color: black;
text-decoration: none;
margin: 0 1px 0 0; /*Margin between each menu item*/
padding: 5px 10px 9px 10px; /*Padding within each menu item*/
background-color: white; /*Default menu color*/
/*BELOW 4 LINES add rounded bottom corners to each menu item.
  ONLY WORKS IN FIREFOX AND FUTURE CSS3 CAPABLE BROWSERS
  REMOVE IF DESIRED*/
-moz-border-radius-bottomleft: 5px;
border-bottom-left-radius: 5px;
-moz-border-radius-bottomright: 5px;
border-bottom-right-radius: 5px;
}
.invertedshiftdown a:hover{
background-color: #D10000; /*Red color theme*/
padding-top: 9px; /*Flip default padding-top value with padding-bottom */
padding-bottom: 5px; /*Flip default padding-bottom value with padding-top*/
color: white;
}
.invertedshiftdown .current a{ /** currently selected menu item **/
background-color: #D10000; /*Red color theme*/
padding-top: 9px; /*Flip default padding-top value with padding-bottom */
padding-bottom: 5px; /*Flip default padding-bottom value with padding-top*/
color: white;
}
#myform{ /*CSS for sample search box. Remove if desired */
float: right;
margin: 0;
margin-top: 2px;
padding: 0;
}
#myform .textinput{
width: 190px;
border: 1px solid gray;
}
#myform .submit{
font: normal 12px Verdana;
height: 22px;
border: 1px solid #D10000;
background-color: black;
color: white;
}
</style>
<div class="invertedshiftdown">
<ul>
<li class="current"><a href="#" title="Home">Home</a></li>
<li><a href="#" title="New">New</a></li>
<li><a href="#" title="Revised">Revised</a></li>
<li><a href="#" title="Tools">Tools</a></li>
<li><a href="#" title="CSS">CSS</a></li>
<li><a href="http://www.widcraft.blogspot.com.com/forums/" title="WidCraft">Get This</a></li>
</ul>          
                                       
</div>
<br style="clear: both;" />


Change # with page/post url and names with custom names.....Thats It.....Leave Questions And Requests Below :D

Monday 28 May 2012

Cool Email Subscribing Box Widget For Blogger

Add this widget :
  • Go To Blogger > Layout > Add New > HTML/Java Script
<style type="text/css">
#bleft {
-webkit-border-radius: 10px 10px 0 0;
-moz-border-radius: 10px 10px 0 0;
border-radius: 10px 10px 0 0;
-webkit-box-shadow: 0 0 25px
rgba(0, 0, 0, 0.1) inset;
-moz-box-shadow: 0 0 25px rgba(0, 0, 0, 0.1) inset;
box-shadow: 0 0 25px
rgba(0, 0, 0, 0.1) inset;
background: none repeat scroll 0 0
#EEE;
height: 160px;
width: 307px;
position: relative;
border: 1px solid
#CCC;
border-bottom: 1px solid
#BBB;
}
#bleft .icon {
display: block;
float: left;
margin: 18px;
}


#bleft .sbox {
-webkit-box-shadow: 0 2px 4px
rgba(0, 0, 0, 0.3) inset;
-moz-box-shadow: 0 2px 4px rgba(0, 0, 0, 0.3) inset;
box-shadow: 0 2px 4px
rgba(0, 0, 0, 0.3) inset;
border: 1px solid
#999;
float: left;
width: 160px;
padding: 6px 5px;
background:
#fff;
font-family: Arial,Helvetica,sans-serif;
font-size: 14px;
margin: 0 4px 0 0;
}
</style>

<br />
<div id="bleft">
<div class="icon">
<img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgoYQIusYlxlkznbMjbt6aWmb7coqneWUPNjdhJxwyF8sMRwXob5bwGBn2y_U8_TIehCS8o1zGvbe6faPuIzlA6ppU9X4-sh8-cLt_i7-tdmnwiQqEXOBiHd6z-53YJHkiJdBWzBxTyDC8/s1600/email-up.png" /></div>
<form action="http://feedburner.google.com/fb/a/mailverify" method="post" onsubmit="window.open('http://feedburner.google.com/fb/a/mailverify?WWEFansNation', 'popupwindow', 'scrollbars=yes,width=550,height=520');return true" target="popupwindow">
<input class="sbox" name="email" onblur="if (this.value == this.defaultValue ||
this.value == '') {this.value = this.defaultValue;this.style.color='#999';}" onfocus="if (this.value ==
this.defaultValue) {this.value = '';this.style.color='#000';}" type="text" value="Your email address..." />
<input name="uri" type="hidden" value="WWEFansNation" />
<input name="loc" type="hidden" value="en_US" /><input alt="Submit button" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjhHyiUhECL2f067a0g0mEnpoFMJiBQhwnCOY51_pSsP7TrInzQg9MdrNZD_OWboTkA8O4md2zeo85dKJfAVCj_-QPIMhfE13BYfbZH4AIGxmPBwnBn3BY0I_l5iwv3haQpLm-WzwWxSdU/s1600/button_get_upd_subscribe.png" type="image" />
</form>
<div class="icon">
<table><tbody>
<tr><td><div id="___plusone_1" style="background-color: transparent; background-position: initial initial; background-repeat: initial initial; border-style: none; display: inline-block; float: none; font-size: 1px; height: 24px; line-height: normal; margin: 0px; padding: 0px; text-indent: 0px; vertical-align: baseline; width: 106px;">
<iframe allowtransparency="true" frameborder="0" hspace="0" id="I2_1338231382169" marginheight="0" marginwidth="0" name="I2_1338231382169" scrolling="no" src="YOUR GOOGLE +1 URL" style="border-style: none; height: 24px; left: 0px; margin: 0px; position: static; top: 0px; visibility: visible; width: 106px;" tabindex="0" title="+1" vspace="0" width="100%"></iframe></div>
</td><td><span style="color: #555555; font-family: arial, helvetica, sans-serif; font-size: 150%; font-weight: bold; text-shadow: rgb(255, 255, 255) 1px 1px;"> ← Give us +1</span></td></tr>
</tbody></table>
</div>
</div>

  • Change WWEFansNation with your RSS feed code. For Example -  If your feed code is http://feeds.feedburner.com/WidgetCraft then replace it with WidgetCraft


And YOUR GOOGLE +1 URL with your +1 URL to get your +1 url follow these instruction -

 1.Go To Your Blog > Layout > Add Widget > +1 Button

2.Now Right Click on +1 Button > View Frame Source

3. A new window will open now click on new window's address bar and copy address 

4. Now remove view-source or any other text your browser show just copy url from https://


5. And replace YOUR GOOGLE +1 URL with this url. 
Thats It!!

Thursday 17 May 2012

Stylish Social Subscription Box For Blogger - Version 2.0


This attractive widget will surely help you to gain some subscribers and also navigate them on your social accounts like twitter and facebook.....version 2.0 
  • Go To Blogger > Layout > Add New > HTML/JavaScript
<style type='text/css'>
.mbt a{
    color: #6e6e6e;
    font: bold 12px Helvetica, Arial, sans-serif;
    text-decoration: none;
    padding: 7px 12px;
    position: relative;
    display: inline-block;
    text-shadow: 0 1px 0 #fff;
    -webkit-transition: border-color .218s;
    -moz-transition: border .218s;
    -o-transition: border-color .218s;
    transition: border-color .218s;
    background: #f3f3f3;
    background: -webkit-gradient(linear,0% 40%,0% 70%,from(#F5F5F5),to(#F1F1F1));
    background: -moz-linear-gradient(linear,0% 40%,0% 70%,from(#F5F5F5),to(#F1F1F1));
    border: solid 1px #dcdcdc;
    border-radius: 2px;
    -webkit-border-radius: 2px;
    -moz-border-radius: 2px;
}
.mbt a:hover {
    color: #333;
    border-color: #999;
    -moz-box-shadow: 0 2px 0 rgba(0, 0, 0, 0.2)
    -webkit-box-shadow:0 2px 5px rgba(0, 0, 0, 0.2);
    box-shadow: 0 1px 2px rgba(0, 0, 0, 0.15);
}
.mbt a:active {
    color: #000;
    border-color: #444;
}
.mbtbar{ width:280px; float: left; margin-left:3px; margin-top:5px; padding:0;}
.mbtbar .emailsub{border-bottom: 0px solid #e6e6e6; padding: 0px 0 15px 0; float: left; width: 100%; font-family: Helvetica, Arial;}
.mbtbar .emailsub .emailupdatesform{width: 100%; float: right; padding:0px;}
.mbtbar .emailsub .emailupdatesform input.emailupdatesinput{background: #F3F3F3;  float: left; border: 1px solid #dcdcdc; padding: 0px 8px; color: #989898; font-size: 14px;  width: 130px; height:30px;   border-radius: 2px;
    -webkit-border-radius: 2px;
    -moz-border-radius: 2px;}
.mbtbar .emailsub .emailupdatesform input.emailupdatesinput:hover{
border-color: #999;
    -moz-box-shadow: 0 2px 0 rgba(0, 0, 0, 0.2)
    -webkit-box-shadow:0 2px 5px rgba(0, 0, 0, 0.2);
    box-shadow: 0 1px 2px rgba(0, 0, 0, 0.15);
}
.mbtbar .emailsub .emailupdatesform input.joinemailupdates:hover{ border-color: #666;
    -moz-box-shadow: 0 2px 0 rgba(0, 0, 0, 0.2)
    -webkit-box-shadow:0 2px 5px rgba(0, 0, 0, 0.2);
    box-shadow: 0 1px 2px rgba(0, 0, 0, 0.15); cursor:pointer;
}
.mbtbar .emailsub .emailupdatesform input.joinemailupdates{
border: solid 1px #dcdcdc;
    background: #F3F3F3;
   font-family:Helvetica, Arial;
text-transform: none; color: #989898; height: 25px; padding: 0 10px; margin: 0 0 0 5px; font-weight:bold; font-size:14px; height:30px;
  border-radius: 2px;
    -webkit-border-radius: 2px;
    -moz-border-radius: 2px;
}
.mbtbar .emailsub .emailupdatesform input.emailupdatesinput{background: #F3F3F3;  float: left; border: 1px solid #dcdcdc; padding: 0px 8px; color: #989898; font-size: 14px;  width: 145px; height:28px;   border-radius: 2px;
    -webkit-border-radius: 2px;
    -moz-border-radius: 2px;}
.mbtbar .emailsub .emailupdatesform input.joinemailupdates{
border: solid 1px #dcdcdc;
    background: #F3F3F3;
   font-family:Helvetica, Arial;
text-transform: none; color: #989898; height: 25px; padding: 0 0px; margin: 0 0 0 5px; font-weight:bold; font-size:14px; height:30px;
  border-radius: 2px;
    -webkit-border-radius: 2px;
    -moz-border-radius: 2px;
}
</style>
<!--[if IE 8]> <style>
.mbtbar .emailsub .emailupdatesform input.emailupdatesinput{background: #F3F3F3;  float: left; border: 1px solid #dcdcdc; padding: 5px 10px; color: #989898; font-size: 12px;  width: 130px; height:18px;   border-radius: 2px;
    -webkit-border-radius: 2px;
    -moz-border-radius: 2px;}
.mbtbar .emailsub .emailupdatesform input.joinemailupdates{
border: solid 1px #dcdcdc;
    background: #F3F3F3;
   font-family:Helvetica, Arial;
text-transform: none; color: #989898; height: 25px; padding: 0 5px; margin: 0 0 0 5px; font-weight:bold; font-size:14px; height:30px;
  border-radius: 2px;
    -webkit-border-radius: 2px;
    -moz-border-radius: 2px;
}

</style> <![endif]-->

<div class="mbt" style="padding: 0pt 0pt 0pt 5px;">
<table><tbody><tr>
<td>
<a   href="ADD-FEEDBURNER-LINK-HERE" rel="nofollow" target="_blank"><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjc1J3Ddj3YD36i5c6fiDYM4rpp8Vznhq7RSLAifqDEbd1rltxzA-3cQitwb2Rz1ky9Wx_18GoqzjoAndBobqtHFdPp_60BKJXyN93oy4DyeUGLeTs4BRla9gTY2Pq-7MCCq9_aHDlJ6s0/s1600/rss.png" border="0"></a>
</td>
<td>
<a style="margin-left:5px;"href="ADD-TWITTER-FAN-PAGE-LINK-HERE" rel="nofollow" target="_blank"><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEi4eeRV9ieUIyS_U7VIoE__6D3kfY8TtfeQJ-mIk22yauH9xqLS36SDsyK4t9fcXlv6KnpHIKAQxBp3mIqbhvpMk0xpErtevXUJX5zTDjT_IrwBosn8fkQiVPqnGzocF61wOPgOMSpCMrY/s1600/twitter.png" border="0"></a>
</td>
<td>
<a style="margin-left:5px;"href="ADD-FACEBOOK-FAN-PAGE-LINK-HERE" rel="nofollow" target="_blank"><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEh28tCpL1qSCHf8GThBgW006E4uMnoGjaR7IaLUUkCHVI-OG446abFe6FsZC0Syth2zeBc3na8xAia4cZkasA1aVL-0fPm7XB0BWyRiti9cWqpTmZBb0pcByK-QeZx4NBlwG9Ay7wqJUP0/s1600/facebook.png" border="0"></a>
</td>
</tr></tbody></table>
<table><tbody><tr>
<td>
<a   href="ADD-YOUR-GOOGLE-PLUS-LINK-HERE" rel="nofollow" target="_blank"><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEj3g8zMTj2umAFTYuXFULnjssP_0WJTTca6IdsL9jGFtkOeQzXN7yZr4-65yOsW_yZP6LH2ca13USsIaI9zMupEYxAskZvrhtJxCC_1IzX74_-_cpBHV4FayII_sKi9NrdQPLDJAflOiU0/s1600/+1.png" border="0"></a>
</td>
<td>
<a style="margin-left:5px;"href="ADD-PICASA-LINK-HERE" rel="nofollow" target="_blank"><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjpcgGRnIYRH6CxAiEgZPhwtsUvEGhUEhq1b4t-H5_i3tr9dDL1e9Fv-OqIyTyt0iV89MQmmpQwcgddo2pXaFBbeVSW6GHq9LFUdALHfYCJfvahZ3zm-BUbx7svnTT714cCNbAQKSafLUk/s1600/picasa.png" border="0"></a>
</td>
<td>
<a style="margin-left:5px;"href="ADD-YOUTUBE-LINK-HERE" rel="nofollow" target="_blank"><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhcgwgBJ28poG-aIyecKDEWPBmdv7mB5tlho9RZAYw2MFkw6J7tcO9W62FeW-154vQ64wctMmCdzQG6p7MnujpJPnL6qnC8S5e-e_d1VSWwx51dIEXrXYP854j8MBv0wiASTEscL2scfXw/s1600/youtube.png" border="0"></a>
</td>
</tr></tbody></table>
<div class="mbtbar">
<div class="emailsub">
<div class="emailupdatesform">
<form action="http://feedburner.google.com/fb/a/mailverify" method="post" target="popupwindow" onsubmit="window.open('http://feedburner.google.com/fb/a/mailverify?uri=WWFansNation', 'popupwindow', 'scrollbars=yes,width=550,height=520');return true"><input gtbfieldid="10" class="emailupdatesinput" name="email" value="Submit email..." onblur="if (this.value == &#39;&#39;) {this.value = &#39;Submit email...&#39;;}" onfocus="if (this.value == &#39;Submit email...&#39;) {this.value = &#39;&#39;;}" type="text" /><input value="WWFansNation" name="uri" type="hidden" /><input value="Subscribe" class="joinemailupdates" type="submit" /></form></div></div></div></div>
</div>
  • Change RSS/Facebook/Twitter/Google+/Picasa/Youtube links with your account links and Change WWEFansNation with your RSS feed code. For Example -   If your feed code is http://feeds.feedburner.com/WidgetCraft then replace it   with WidgetCraft
Subscribe to: Posts (Atom)

Popular Posts

 
Powered by Blogger.