Blogger Tips | Tricks | SEO | Widgets - Way2bloggerz

Animated Social Subscribing icons for Blogger

2012-04-22T01:37:00.000-07:00

We have already provided you post on how you can add social sharing buttons for blog post but in this post we are providing you a brand new social subscribing buttons which you can be used as a sidebar widget for your blog this widget contain three most usefull sharing buttons i.e. Google+, Twitter, Facebook and its very simple to add it to your blog

STEPS

1,Go to Blogger Dashbord>Layout>Add a Gadget.

2.Now choose HTML/Javascript.

We are providing this widget in four different styles.

3.Now paste the code of any style provided below in content box of HTML/javascript(Customize the code before saving customizations given at the bottom of post)

STYLE 1

<style type="text/css">.md-wrapper{padding:0;width:435px;height:70px;margin:80px auto 30px auto;}.md-wrapper li{float:left;}.md-wrapper ol,ul{list-style:none;}.md-wrapper li a{display:block;width:68px;height:70px;margin:0 2px;outline:none;background:transparent urlundefinedhttps://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgKlH6tAlxp6npD3znXDx01EGP-40KxzYe1QopyrvV-4ke3Ql3jnxhF9fhGxt2VzeQSqi4PxbVl6C9q7rPkqqy7Me5rGs1WhpLTy9NbmdzdIOsUdIusjrDa0LO9QgyVzfAII2QgM_2t7j1i/s1600/%255Bwww.gj37765.blogspot.com%255D_social_gunman_icons.png) no-repeat top left;text-indent:-9000px;position:relative;}.md-wrapper li .md-gplus{background-position:0px 0px;}.md-wrapper li .md-twitter{background-position:-68px 0px;}.md-wrapper li .md-facebook{background-position:-204px 0px;}.md-wrapper li a span{width:100px;height:auto;line-height:20px;padding:10px;left:50%;margin-left:-64px;font-family:'Alegreya SC', Georgia, serif;font-weight:400;font-style:italic;font-size:14px;color:#719DAB;text-shadow:1px 1px 1px rgbaundefined0, 0, 0, 0.1);text-align:center;border:4px solid #fff;background:rgbaundefined255,255,255,0.3);text-indent:0px;/*border-radius*/-webkit-border-radius:5px;-moz-border-radius:5px;border-radius:5px;position:absolute;pointer-events:none;bottom:100px;opacity:0;/*box-shadow*/-webkit-box-shadow:1px 1px 2px rgbaundefined0,0,0,0.1);-moz-box-shadow:1px 1px 2px rgbaundefined0,0,0,0.1);box-shadow:1px 1px 2px rgbaundefined0,0,0,0.1);/*transition*/-webkit-transition:all 0.3s ease-in-out;-moz-transition:all 0.3s ease-in-out;-o-transition:all 0.3s ease-in-out;transition:all 0.3s ease-in-out;}.md-wrapper li a span:before,.md-wrapper li a span:after{content:'';position:absolute;bottom:-15px;left:50%;margin-left:-9px;width:0;height:0;border-left:10px solid transparent;border-right:10px solid transparent;border-top:10px solid rgbaundefined0,0,0,0.1);}.md-wrapper li a span:after{bottom:-14px;margin-left:-10px;border-top:10px solid #fff;}.md-wrapper li a:hover span{opacity:0.9;bottom:70px;}.md2-wrapper{padding:0;width:435px;height:70px;margin:80px auto 30px auto;}.md2-wrapper li{float:left;}.md2-wrapper ol,ul{list-style:none;}.md2-wrapper li a{display:block;width:68px;height:70px;margin:0 2px;outline:none;position:relative;z-index:2;background:transparent urlundefinedhttps://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgKlH6tAlxp6npD3znXDx01EGP-40KxzYe1QopyrvV-4ke3Ql3jnxhF9fhGxt2VzeQSqi4PxbVl6C9q7rPkqqy7Me5rGs1WhpLTy9NbmdzdIOsUdIusjrDa0LO9QgyVzfAII2QgM_2t7j1i/s1600/%255Bwww.gj37765.blogspot.com%255D_social_gunman_icons.png) no-repeat top left;text-indent:-9000px;}.md2-wrapper li .tt-gplus{background-position:0px 0px;}.md2-wrapper li .md2-twitter{background-position:-68px 0px;}.md2-wrapper li .md2-facebook{background-position:-204px 0px;}.md2-wrapper li a span{width:80px;height:80px;line-height:80px;padding:10px;left:50%;margin-left:-55px;font-family:'Alegreya SC', Georgia, serif;font-weight:400;font-style:italic;font-size:14px;color:#719DAB;text-shadow:1px 1px 1px rgbaundefined0, 0, 0, 0.1);text-align:center;border:5px solid #fff;background:rgbaundefined255,255,255,0.5);text-indent:0px;position:absolute;pointer-events:none;/*border-radius*/-webkit-border-radius:50%;-moz-border-radius:50%;border-radius:50%;bottom:-40px;opacity:0;/*box-shadow*/-webkit-box-shadow:0px 3px 8px rgbaundefined0,0,0,0.1);-moz-box-shadow:0px 3px 8px rgbaundefined0,0,0,0.1);box-shadow:0px 3px 8px rgbaundefined0,0,0,0.1);/*transform*/-webkit-transform:scaleundefined0.2);-moz-transform:scaleundefined0.2);-ms-transform:scaleundefined0.2);-o-transform:scaleundefined0.2);transform:scaleundefined0.2);/*transition*/-webkit-transition:all 0.3s ease-in-out;-moz-transition:all 0.3s ease-in-out;-o-transition:all 0.3s ease-in-out;transition:all 0.3s ease-in-out;}.md2-wrapper li a:hover span{opacity:0.9;bottom:50px;/*transform*/-webkit-transform:scaleundefined1);-moz-transform:scaleundefined1);-ms-transform:scaleundefined1);-o-transform:scaleundefined1);transform:scaleundefined1);}.md3-wrapper{padding:0;width:435px;height:70px;margin:80px auto 30px auto;}.md3-wrapper li{float:left;}.md3-wrapper ol,ul{list-style:none;}.md3-wrapper li a{display:block;width:68px;height:70px;margin:0 2px;outline:none;position:relative;z-index:2;background:transparent urlundefinedhttps://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgKlH6tAlxp6npD3znXDx01EGP-40KxzYe1QopyrvV-4ke3Ql3jnxhF9fhGxt2VzeQSqi4PxbVl6C9q7rPkqqy7Me5rGs1WhpLTy9NbmdzdIOsUdIusjrDa0LO9QgyVzfAII2QgM_2t7j1i/s1600/%255Bwww.gj37765.blogspot.com%255D_social_gunman_icons.png) no-repeat top left;text-indent:-9000px;}.md3-wrapper li .md3-gplus{background-position:0px 0px;}.md3-wrapper li .md3-twitter{background-position:-68px 0px;}.md3-wrapper li .md3-facebook{background-position:-204px 0px;}.md3-wrapper li a span{width:80px;height:auto;padding:10px;left:50%;margin-left:-55px;font-family:'Alegreya SC', Georgia, serif;font-weight:400;font-style:italic;font-size:14px;color:#719DAB;text-shadow:1px 1px 1px rgbaundefined0, 0, 0, 0.1);text-align:center;border:5px solid #fff;background:rgbaundefined255,255,255,0.5);text-indent:0px;position:absolute;pointer-events:none;bottom:-40px;opacity:0;/*box-shadow*/-webkit-box-shadow:0px 1px 2px rgbaundefined0,0,0,0.1);-moz-box-shadow:0px 1px 2px rgbaundefined0,0,0,0.1);box-shadow:0px 1px 2px rgbaundefined0,0,0,0.1);/*transition*/-webkit-transition:all 0.3s ease-in-out;-moz-transition:all 0.3s ease-in-out;-o-transition:all 0.3s ease-in-out;transition:all 0.3s ease-in-out;/*transform*/-webkit-transform:rotateundefined0deg) scaleundefined0);-moz-transform:rotateundefined0deg) scaleundefined0);-ms-transform:rotateundefined0deg) scaleundefined0);-o-transform:rotateundefined0deg) scaleundefined0);transform:rotateundefined0deg) scaleundefined0);}.md3-wrapper li a:hover span{opacity:0.9;bottom:100px;/*transform*/-webkit-transform:rotateundefined-90deg) scaleundefined1);-moz-transform:rotateundefined-90deg) scaleundefined1);-ms-transform:rotateundefined-90deg) scaleundefined1);-o-transform:rotateundefined-90deg) scaleundefined1);transform:rotateundefined-90deg) scaleundefined1);}.md4-wrapper{padding:0;width:435px;height:70px;margin:80px auto 30px auto;}.md4-wrapper li{float:left;}.md-wrapper ol,ul{list-style:none;}.md4-wrapper li a{display:block;width:68px;height:70px;margin:0 2px;outline:none;background:transparent urlundefinedhttps://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgKlH6tAlxp6npD3znXDx01EGP-40KxzYe1QopyrvV-4ke3Ql3jnxhF9fhGxt2VzeQSqi4PxbVl6C9q7rPkqqy7Me5rGs1WhpLTy9NbmdzdIOsUdIusjrDa0LO9QgyVzfAII2QgM_2t7j1i/s1600/%255Bwww.gj37765.blogspot.com%255D_social_gunman_icons.png) no-repeat top left;text-indent:-9000px;position:relative;}.md4-wrapper li .md4-gplus{background-position:0px 0px;}.md4-wrapper li .md4-twitter{background-position:-68px 0px;}.md4-wrapper li .md4-facebook{background-position:-204px 0px;}.md4-wrapper li a span{width:100px;height:auto;line-height:20px;padding:10px;left:50%;margin-left:-64px;font-family:'Alegreya SC', Georgia, serif;font-weight:400;font-style:italic;font-size:14px;color:#719DAB;text-shadow:1px 1px 1px rgbaundefined0, 0, 0, 0.1);text-align:center;border:4px solid #fff;background:rgbaundefined255,255,255,0.3);text-indent:0px;/*border-radius*/-webkit-border-radius:5px;-moz-border-radius:5px;border-radius:5px;position:absolute;bottom:70px;opacity:0;visibility:visible;pointer-events:none;/*box-shadow*/-webkit-box-shadow:1px 1px 2px rgbaundefined0,0,0,0.1);-moz-box-shadow:1px 1px 2px rgbaundefined0,0,0,0.1);box-shadow:1px 1px 2px rgbaundefined0,0,0,0.1);/*transform*/-webkit-transform:translateundefined35px) rotateundefined25deg) scaleundefined1.5);-moz-transform:translateundefined35px) rotateundefined25deg) scaleundefined1.5);-ms-transform:translateundefined35px) rotateundefined25deg) scaleundefined1.5);-o-transform:translateundefined35px) rotateundefined25deg) scaleundefined1.5);transform:translateundefined35px) rotateundefined25deg) scaleundefined1.5);/*transition*/-webkit-transition:all 0.3s ease-in-out;-moz-transition:all 0.3s ease-in-out;-o-transition:all 0.3s ease-in-out;transition:all 0.3s ease-in-out;}.md4-wrapper li a span:before,.md4-wrapper li a span:after{content:'';position:absolute;bottom:-15px;left:50%;margin-left:-9px;width:0;height:0;border-left:10px solid transparent;border-right:10px solid transparent;border-top:10px solid rgbaundefined0,0,0,0.1);}.md4-wrapper li a span:after{bottom:-14px;margin-left:-10px;border-top:10px solid #fff;}.md4-wrapper li a:hover span{visibility:visible;opacity:0.9;/*transform*/-webkit-transform:translateundefined0px) rotateundefined0deg) scaleundefined1);-moz-transform:translateundefined0px) rotateundefined0deg) scaleundefined1);-ms-transform:translateundefined0px) rotateundefined0deg) scaleundefined1);-o-transform:translateundefined0px) rotateundefined0deg) scaleundefined1);transform:translateundefined0px) rotateundefined0deg) scaleundefined1);}</style>

<ul class="md-wrapper"><li>
<a class="md-gplus" href="https://plus.google.com/u/0/118384581860977679645"><span>Google Plus</span></a></li>
<li><a class="md-twitter" href="https://www.twitter.com/way2bloggerz"><span>Twitter</span></a></li>
<li><a class="md-facebook" href="https://www.facebook.com/way2bloggerz"><span>Facebook</span></a></li></ul>

STYLE 2

<style type="text/css">.md-wrapper{padding:0;width:435px;height:70px;margin:80px auto 30px auto;}.md-wrapper li{float:left;}.md-wrapper ol,ul{list-style:none;}.md-wrapper li a{display:block;width:68px;height:70px;margin:0 2px;outline:none;background:transparent urlundefinedhttps://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgKlH6tAlxp6npD3znXDx01EGP-40KxzYe1QopyrvV-4ke3Ql3jnxhF9fhGxt2VzeQSqi4PxbVl6C9q7rPkqqy7Me5rGs1WhpLTy9NbmdzdIOsUdIusjrDa0LO9QgyVzfAII2QgM_2t7j1i/s1600/%255Bwww.gj37765.blogspot.com%255D_social_gunman_icons.png) no-repeat top left;text-indent:-9000px;position:relative;}.md-wrapper li .md-gplus{background-position:0px 0px;}.md-wrapper li .md-twitter{background-position:-68px 0px;}.md-wrapper li .md-facebook{background-position:-204px 0px;}.md-wrapper li a span{width:100px;height:auto;line-height:20px;padding:10px;left:50%;margin-left:-64px;font-family:'Alegreya SC', Georgia, serif;font-weight:400;font-style:italic;font-size:14px;color:#719DAB;text-shadow:1px 1px 1px rgbaundefined0, 0, 0, 0.1);text-align:center;border:4px solid #fff;background:rgbaundefined255,255,255,0.3);text-indent:0px;/*border-radius*/-webkit-border-radius:5px;-moz-border-radius:5px;border-radius:5px;position:absolute;pointer-events:none;bottom:100px;opacity:0;/*box-shadow*/-webkit-box-shadow:1px 1px 2px rgbaundefined0,0,0,0.1);-moz-box-shadow:1px 1px 2px rgbaundefined0,0,0,0.1);box-shadow:1px 1px 2px rgbaundefined0,0,0,0.1);/*transition*/-webkit-transition:all 0.3s ease-in-out;-moz-transition:all 0.3s ease-in-out;-o-transition:all 0.3s ease-in-out;transition:all 0.3s ease-in-out;}.md-wrapper li a span:before,.md-wrapper li a span:after{content:'';position:absolute;bottom:-15px;left:50%;margin-left:-9px;width:0;height:0;border-left:10px solid transparent;border-right:10px solid transparent;border-top:10px solid rgbaundefined0,0,0,0.1);}.md-wrapper li a span:after{bottom:-14px;margin-left:-10px;border-top:10px solid #fff;}.md-wrapper li a:hover span{opacity:0.9;bottom:70px;}.md2-wrapper{padding:0;width:435px;height:70px;margin:80px auto 30px auto;}.md2-wrapper li{float:left;}.md2-wrapper ol,ul{list-style:none;}.md2-wrapper li a{display:block;width:68px;height:70px;margin:0 2px;outline:none;position:relative;z-index:2;background:transparent urlundefinedhttps://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgKlH6tAlxp6npD3znXDx01EGP-40KxzYe1QopyrvV-4ke3Ql3jnxhF9fhGxt2VzeQSqi4PxbVl6C9q7rPkqqy7Me5rGs1WhpLTy9NbmdzdIOsUdIusjrDa0LO9QgyVzfAII2QgM_2t7j1i/s1600/%255Bwww.gj37765.blogspot.com%255D_social_gunman_icons.png) no-repeat top left;text-indent:-9000px;}.md2-wrapper li .tt-gplus{background-position:0px 0px;}.md2-wrapper li .md2-twitter{background-position:-68px 0px;}.md2-wrapper li .md2-facebook{background-position:-204px 0px;}.md2-wrapper li a span{width:80px;height:80px;line-height:80px;padding:10px;left:50%;margin-left:-55px;font-family:'Alegreya SC', Georgia, serif;font-weight:400;font-style:italic;font-size:14px;color:#719DAB;text-shadow:1px 1px 1px rgbaundefined0, 0, 0, 0.1);text-align:center;border:5px solid #fff;background:rgbaundefined255,255,255,0.5);text-indent:0px;position:absolute;pointer-events:none;/*border-radius*/-webkit-border-radius:50%;-moz-border-radius:50%;border-radius:50%;bottom:-40px;opacity:0;/*box-shadow*/-webkit-box-shadow:0px 3px 8px rgbaundefined0,0,0,0.1);-moz-box-shadow:0px 3px 8px rgbaundefined0,0,0,0.1);box-shadow:0px 3px 8px rgbaundefined0,0,0,0.1);/*transform*/-webkit-transform:scaleundefined0.2);-moz-transform:scaleundefined0.2);-ms-transform:scaleundefined0.2);-o-transform:scaleundefined0.2);transform:scaleundefined0.2);/*transition*/-webkit-transition:all 0.3s ease-in-out;-moz-transition:all 0.3s ease-in-out;-o-transition:all 0.3s ease-in-out;transition:all 0.3s ease-in-out;}.md2-wrapper li a:hover span{opacity:0.9;bottom:50px;/*transform*/-webkit-transform:scaleundefined1);-moz-transform:scaleundefined1);-ms-transform:scaleundefined1);-o-transform:scaleundefined1);transform:scaleundefined1);}.md3-wrapper{padding:0;width:435px;height:70px;margin:80px auto 30px auto;}.md3-wrapper li{float:left;}.md3-wrapper ol,ul{list-style:none;}.md3-wrapper li a{display:block;width:68px;height:70px;margin:0 2px;outline:none;position:relative;z-index:2;background:transparent urlundefinedhttps://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgKlH6tAlxp6npD3znXDx01EGP-40KxzYe1QopyrvV-4ke3Ql3jnxhF9fhGxt2VzeQSqi4PxbVl6C9q7rPkqqy7Me5rGs1WhpLTy9NbmdzdIOsUdIusjrDa0LO9QgyVzfAII2QgM_2t7j1i/s1600/%255Bwww.gj37765.blogspot.com%255D_social_gunman_icons.png) no-repeat top left;text-indent:-9000px;}.md3-wrapper li .md3-gplus{background-position:0px 0px;}.md3-wrapper li .md3-twitter{background-position:-68px 0px;}.md3-wrapper li .md3-facebook{background-position:-204px 0px;}.md3-wrapper li a span{width:80px;height:auto;padding:10px;left:50%;margin-left:-55px;font-family:'Alegreya SC', Georgia, serif;font-weight:400;font-style:italic;font-size:14px;color:#719DAB;text-shadow:1px 1px 1px rgbaundefined0, 0, 0, 0.1);text-align:center;border:5px solid #fff;background:rgbaundefined255,255,255,0.5);text-indent:0px;position:absolute;pointer-events:none;bottom:-40px;opacity:0;/*box-shadow*/-webkit-box-shadow:0px 1px 2px rgbaundefined0,0,0,0.1);-moz-box-shadow:0px 1px 2px rgbaundefined0,0,0,0.1);box-shadow:0px 1px 2px rgbaundefined0,0,0,0.1);/*transition*/-webkit-transition:all 0.3s ease-in-out;-moz-transition:all 0.3s ease-in-out;-o-transition:all 0.3s ease-in-out;transition:all 0.3s ease-in-out;/*transform*/-webkit-transform:rotateundefined0deg) scaleundefined0);-moz-transform:rotateundefined0deg) scaleundefined0);-ms-transform:rotateundefined0deg) scaleundefined0);-o-transform:rotateundefined0deg) scaleundefined0);transform:rotateundefined0deg) scaleundefined0);}.md3-wrapper li a:hover span{opacity:0.9;bottom:100px;/*transform*/-webkit-transform:rotateundefined-90deg) scaleundefined1);-moz-transform:rotateundefined-90deg) scaleundefined1);-ms-transform:rotateundefined-90deg) scaleundefined1);-o-transform:rotateundefined-90deg) scaleundefined1);transform:rotateundefined-90deg) scaleundefined1);}.md4-wrapper{padding:0;width:435px;height:70px;margin:80px auto 30px auto;}.md4-wrapper li{float:left;}.md-wrapper ol,ul{list-style:none;}.md4-wrapper li a{display:block;width:68px;height:70px;margin:0 2px;outline:none;background:transparent urlundefinedhttps://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgKlH6tAlxp6npD3znXDx01EGP-40KxzYe1QopyrvV-4ke3Ql3jnxhF9fhGxt2VzeQSqi4PxbVl6C9q7rPkqqy7Me5rGs1WhpLTy9NbmdzdIOsUdIusjrDa0LO9QgyVzfAII2QgM_2t7j1i/s1600/%255Bwww.gj37765.blogspot.com%255D_social_gunman_icons.png) no-repeat top left;text-indent:-9000px;position:relative;}.md4-wrapper li .md4-gplus{background-position:0px 0px;}.md4-wrapper li .md4-twitter{background-position:-68px 0px;}.md4-wrapper li .md4-facebook{background-position:-204px 0px;}.md4-wrapper li a span{width:100px;height:auto;line-height:20px;padding:10px;left:50%;margin-left:-64px;font-family:'Alegreya SC', Georgia, serif;font-weight:400;font-style:italic;font-size:14px;color:#719DAB;text-shadow:1px 1px 1px rgbaundefined0, 0, 0, 0.1);text-align:center;border:4px solid #fff;background:rgbaundefined255,255,255,0.3);text-indent:0px;/*border-radius*/-webkit-border-radius:5px;-moz-border-radius:5px;border-radius:5px;position:absolute;bottom:70px;opacity:0;visibility:visible;pointer-events:none;/*box-shadow*/-webkit-box-shadow:1px 1px 2px rgbaundefined0,0,0,0.1);-moz-box-shadow:1px 1px 2px rgbaundefined0,0,0,0.1);box-shadow:1px 1px 2px rgbaundefined0,0,0,0.1);/*transform*/-webkit-transform:translateundefined35px) rotateundefined25deg) scaleundefined1.5);-moz-transform:translateundefined35px) rotateundefined25deg) scaleundefined1.5);-ms-transform:translateundefined35px) rotateundefined25deg) scaleundefined1.5);-o-transform:translateundefined35px) rotateundefined25deg) scaleundefined1.5);transform:translateundefined35px) rotateundefined25deg) scaleundefined1.5);/*transition*/-webkit-transition:all 0.3s ease-in-out;-moz-transition:all 0.3s ease-in-out;-o-transition:all 0.3s ease-in-out;transition:all 0.3s ease-in-out;}.md4-wrapper li a span:before,.md4-wrapper li a span:after{content:'';position:absolute;bottom:-15px;left:50%;margin-left:-9px;width:0;height:0;border-left:10px solid transparent;border-right:10px solid transparent;border-top:10px solid rgbaundefined0,0,0,0.1);}.md4-wrapper li a span:after{bottom:-14px;margin-left:-10px;border-top:10px solid #fff;}.md4-wrapper li a:hover span{visibility:visible;opacity:0.9;/*transform*/-webkit-transform:translateundefined0px) rotateundefined0deg) scaleundefined1);-moz-transform:translateundefined0px) rotateundefined0deg) scaleundefined1);-ms-transform:translateundefined0px) rotateundefined0deg) scaleundefined1);-o-transform:translateundefined0px) rotateundefined0deg) scaleundefined1);transform:translateundefined0px) rotateundefined0deg) scaleundefined1);}</style>

<ul class="md4-wrapper"><li>
<a class="md4-gplus" href="https://plus.google.com/u/0/118384581860977679645"><span>Google Plus</span></a></li>
<li><a class="md4-twitter" href="https://www.twitter.com/way2bloggerz"><span>Twitter</span></a></li>
<li><a class="md4-facebook" href="https://www.facebook.com/way2bloggerz"><span>Facebook</span></a></li></ul>

STYLE 3

<style type="text/css">.md-wrapper{padding:0;width:435px;height:70px;margin:80px auto 30px auto;}.md-wrapper li{float:left;}.md-wrapper ol,ul{list-style:none;}.md-wrapper li a{display:block;width:68px;height:70px;margin:0 2px;outline:none;background:transparent urlundefinedhttps://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgKlH6tAlxp6npD3znXDx01EGP-40KxzYe1QopyrvV-4ke3Ql3jnxhF9fhGxt2VzeQSqi4PxbVl6C9q7rPkqqy7Me5rGs1WhpLTy9NbmdzdIOsUdIusjrDa0LO9QgyVzfAII2QgM_2t7j1i/s1600/%255Bwww.gj37765.blogspot.com%255D_social_gunman_icons.png) no-repeat top left;text-indent:-9000px;position:relative;}.md-wrapper li .md-gplus{background-position:0px 0px;}.md-wrapper li .md-twitter{background-position:-68px 0px;}.md-wrapper li .md-facebook{background-position:-204px 0px;}.md-wrapper li a span{width:100px;height:auto;line-height:20px;padding:10px;left:50%;margin-left:-64px;font-family:'Alegreya SC', Georgia, serif;font-weight:400;font-style:italic;font-size:14px;color:#719DAB;text-shadow:1px 1px 1px rgbaundefined0, 0, 0, 0.1);text-align:center;border:4px solid #fff;background:rgbaundefined255,255,255,0.3);text-indent:0px;/*border-radius*/-webkit-border-radius:5px;-moz-border-radius:5px;border-radius:5px;position:absolute;pointer-events:none;bottom:100px;opacity:0;/*box-shadow*/-webkit-box-shadow:1px 1px 2px rgbaundefined0,0,0,0.1);-moz-box-shadow:1px 1px 2px rgbaundefined0,0,0,0.1);box-shadow:1px 1px 2px rgbaundefined0,0,0,0.1);/*transition*/-webkit-transition:all 0.3s ease-in-out;-moz-transition:all 0.3s ease-in-out;-o-transition:all 0.3s ease-in-out;transition:all 0.3s ease-in-out;}.md-wrapper li a span:before,.md-wrapper li a span:after{content:'';position:absolute;bottom:-15px;left:50%;margin-left:-9px;width:0;height:0;border-left:10px solid transparent;border-right:10px solid transparent;border-top:10px solid rgbaundefined0,0,0,0.1);}.md-wrapper li a span:after{bottom:-14px;margin-left:-10px;border-top:10px solid #fff;}.md-wrapper li a:hover span{opacity:0.9;bottom:70px;}.md2-wrapper{padding:0;width:435px;height:70px;margin:80px auto 30px auto;}.md2-wrapper li{float:left;}.md2-wrapper ol,ul{list-style:none;}.md2-wrapper li a{display:block;width:68px;height:70px;margin:0 2px;outline:none;position:relative;z-index:2;background:transparent urlundefinedhttps://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgKlH6tAlxp6npD3znXDx01EGP-40KxzYe1QopyrvV-4ke3Ql3jnxhF9fhGxt2VzeQSqi4PxbVl6C9q7rPkqqy7Me5rGs1WhpLTy9NbmdzdIOsUdIusjrDa0LO9QgyVzfAII2QgM_2t7j1i/s1600/%255Bwww.gj37765.blogspot.com%255D_social_gunman_icons.png) no-repeat top left;text-indent:-9000px;}.md2-wrapper li .tt-gplus{background-position:0px 0px;}.md2-wrapper li .md2-twitter{background-position:-68px 0px;}.md2-wrapper li .md2-facebook{background-position:-204px 0px;}.md2-wrapper li a span{width:80px;height:80px;line-height:80px;padding:10px;left:50%;margin-left:-55px;font-family:'Alegreya SC', Georgia, serif;font-weight:400;font-style:italic;font-size:14px;color:#719DAB;text-shadow:1px 1px 1px rgbaundefined0, 0, 0, 0.1);text-align:center;border:5px solid #fff;background:rgbaundefined255,255,255,0.5);text-indent:0px;position:absolute;pointer-events:none;/*border-radius*/-webkit-border-radius:50%;-moz-border-radius:50%;border-radius:50%;bottom:-40px;opacity:0;/*box-shadow*/-webkit-box-shadow:0px 3px 8px rgbaundefined0,0,0,0.1);-moz-box-shadow:0px 3px 8px rgbaundefined0,0,0,0.1);box-shadow:0px 3px 8px rgbaundefined0,0,0,0.1);/*transform*/-webkit-transform:scaleundefined0.2);-moz-transform:scaleundefined0.2);-ms-transform:scaleundefined0.2);-o-transform:scaleundefined0.2);transform:scaleundefined0.2);/*transition*/-webkit-transition:all 0.3s ease-in-out;-moz-transition:all 0.3s ease-in-out;-o-transition:all 0.3s ease-in-out;transition:all 0.3s ease-in-out;}.md2-wrapper li a:hover span{opacity:0.9;bottom:50px;/*transform*/-webkit-transform:scaleundefined1);-moz-transform:scaleundefined1);-ms-transform:scaleundefined1);-o-transform:scaleundefined1);transform:scaleundefined1);}.md3-wrapper{padding:0;width:435px;height:70px;margin:80px auto 30px auto;}.md3-wrapper li{float:left;}.md3-wrapper ol,ul{list-style:none;}.md3-wrapper li a{display:block;width:68px;height:70px;margin:0 2px;outline:none;position:relative;z-index:2;background:transparent urlundefinedhttps://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgKlH6tAlxp6npD3znXDx01EGP-40KxzYe1QopyrvV-4ke3Ql3jnxhF9fhGxt2VzeQSqi4PxbVl6C9q7rPkqqy7Me5rGs1WhpLTy9NbmdzdIOsUdIusjrDa0LO9QgyVzfAII2QgM_2t7j1i/s1600/%255Bwww.gj37765.blogspot.com%255D_social_gunman_icons.png) no-repeat top left;text-indent:-9000px;}.md3-wrapper li .md3-gplus{background-position:0px 0px;}.md3-wrapper li .md3-twitter{background-position:-68px 0px;}.md3-wrapper li .md3-facebook{background-position:-204px 0px;}.md3-wrapper li a span{width:80px;height:auto;padding:10px;left:50%;margin-left:-55px;font-family:'Alegreya SC', Georgia, serif;font-weight:400;font-style:italic;font-size:14px;color:#719DAB;text-shadow:1px 1px 1px rgbaundefined0, 0, 0, 0.1);text-align:center;border:5px solid #fff;background:rgbaundefined255,255,255,0.5);text-indent:0px;position:absolute;pointer-events:none;bottom:-40px;opacity:0;/*box-shadow*/-webkit-box-shadow:0px 1px 2px rgbaundefined0,0,0,0.1);-moz-box-shadow:0px 1px 2px rgbaundefined0,0,0,0.1);box-shadow:0px 1px 2px rgbaundefined0,0,0,0.1);/*transition*/-webkit-transition:all 0.3s ease-in-out;-moz-transition:all 0.3s ease-in-out;-o-transition:all 0.3s ease-in-out;transition:all 0.3s ease-in-out;/*transform*/-webkit-transform:rotateundefined0deg) scaleundefined0);-moz-transform:rotateundefined0deg) scaleundefined0);-ms-transform:rotateundefined0deg) scaleundefined0);-o-transform:rotateundefined0deg) scaleundefined0);transform:rotateundefined0deg) scaleundefined0);}.md3-wrapper li a:hover span{opacity:0.9;bottom:100px;/*transform*/-webkit-transform:rotateundefined-90deg) scaleundefined1);-moz-transform:rotateundefined-90deg) scaleundefined1);-ms-transform:rotateundefined-90deg) scaleundefined1);-o-transform:rotateundefined-90deg) scaleundefined1);transform:rotateundefined-90deg) scaleundefined1);}.md4-wrapper{padding:0;width:435px;height:70px;margin:80px auto 30px auto;}.md4-wrapper li{float:left;}.md-wrapper ol,ul{list-style:none;}.md4-wrapper li a{display:block;width:68px;height:70px;margin:0 2px;outline:none;background:transparent urlundefinedhttps://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgKlH6tAlxp6npD3znXDx01EGP-40KxzYe1QopyrvV-4ke3Ql3jnxhF9fhGxt2VzeQSqi4PxbVl6C9q7rPkqqy7Me5rGs1WhpLTy9NbmdzdIOsUdIusjrDa0LO9QgyVzfAII2QgM_2t7j1i/s1600/%255Bwww.gj37765.blogspot.com%255D_social_gunman_icons.png) no-repeat top left;text-indent:-9000px;position:relative;}.md4-wrapper li .md4-gplus{background-position:0px 0px;}.md4-wrapper li .md4-twitter{background-position:-68px 0px;}.md4-wrapper li .md4-facebook{background-position:-204px 0px;}.md4-wrapper li a span{width:100px;height:auto;line-height:20px;padding:10px;left:50%;margin-left:-64px;font-family:'Alegreya SC', Georgia, serif;font-weight:400;font-style:italic;font-size:14px;color:#719DAB;text-shadow:1px 1px 1px rgbaundefined0, 0, 0, 0.1);text-align:center;border:4px solid #fff;background:rgbaundefined255,255,255,0.3);text-indent:0px;/*border-radius*/-webkit-border-radius:5px;-moz-border-radius:5px;border-radius:5px;position:absolute;bottom:70px;opacity:0;visibility:visible;pointer-events:none;/*box-shadow*/-webkit-box-shadow:1px 1px 2px rgbaundefined0,0,0,0.1);-moz-box-shadow:1px 1px 2px rgbaundefined0,0,0,0.1);box-shadow:1px 1px 2px rgbaundefined0,0,0,0.1);/*transform*/-webkit-transform:translateundefined35px) rotateundefined25deg) scaleundefined1.5);-moz-transform:translateundefined35px) rotateundefined25deg) scaleundefined1.5);-ms-transform:translateundefined35px) rotateundefined25deg) scaleundefined1.5);-o-transform:translateundefined35px) rotateundefined25deg) scaleundefined1.5);transform:translateundefined35px) rotateundefined25deg) scaleundefined1.5);/*transition*/-webkit-transition:all 0.3s ease-in-out;-moz-transition:all 0.3s ease-in-out;-o-transition:all 0.3s ease-in-out;transition:all 0.3s ease-in-out;}.md4-wrapper li a span:before,.md4-wrapper li a span:after{content:'';position:absolute;bottom:-15px;left:50%;margin-left:-9px;width:0;height:0;border-left:10px solid transparent;border-right:10px solid transparent;border-top:10px solid rgbaundefined0,0,0,0.1);}.md4-wrapper li a span:after{bottom:-14px;margin-left:-10px;border-top:10px solid #fff;}.md4-wrapper li a:hover span{visibility:visible;opacity:0.9;/*transform*/-webkit-transform:translateundefined0px) rotateundefined0deg) scaleundefined1);-moz-transform:translateundefined0px) rotateundefined0deg) scaleundefined1);-ms-transform:translateundefined0px) rotateundefined0deg) scaleundefined1);-o-transform:translateundefined0px) rotateundefined0deg) scaleundefined1);transform:translateundefined0px) rotateundefined0deg) scaleundefined1);}</style>

<ul class="md2-wrapper"><li>
<a class="md2-gplus" href="https://plus.google.com/u/0/118384581860977679645"><span>Google Plus</span></a></li>
<li><a class="md2-twitter" href="https://www.twitter.com/way2bloggerz"><span>Twitter</span></a></li>
<li><a class="md2-facebook" href="https://www.facebook.com/way2bloggerz"><span>Facebook</span></a></li></ul>

STYLE 4

<style type="text/css">.md-wrapper{padding:0;width:435px;height:70px;margin:80px auto 30px auto;}.md-wrapper li{float:left;}.md-wrapper ol,ul{list-style:none;}.md-wrapper li a{display:block;width:68px;height:70px;margin:0 2px;outline:none;background:transparent urlundefinedhttps://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgKlH6tAlxp6npD3znXDx01EGP-40KxzYe1QopyrvV-4ke3Ql3jnxhF9fhGxt2VzeQSqi4PxbVl6C9q7rPkqqy7Me5rGs1WhpLTy9NbmdzdIOsUdIusjrDa0LO9QgyVzfAII2QgM_2t7j1i/s1600/%255Bwww.gj37765.blogspot.com%255D_social_gunman_icons.png) no-repeat top left;text-indent:-9000px;position:relative;}.md-wrapper li .md-gplus{background-position:0px 0px;}.md-wrapper li .md-twitter{background-position:-68px 0px;}.md-wrapper li .md-facebook{background-position:-204px 0px;}.md-wrapper li a span{width:100px;height:auto;line-height:20px;padding:10px;left:50%;margin-left:-64px;font-family:'Alegreya SC', Georgia, serif;font-weight:400;font-style:italic;font-size:14px;color:#719DAB;text-shadow:1px 1px 1px rgbaundefined0, 0, 0, 0.1);text-align:center;border:4px solid #fff;background:rgbaundefined255,255,255,0.3);text-indent:0px;/*border-radius*/-webkit-border-radius:5px;-moz-border-radius:5px;border-radius:5px;position:absolute;pointer-events:none;bottom:100px;opacity:0;/*box-shadow*/-webkit-box-shadow:1px 1px 2px rgbaundefined0,0,0,0.1);-moz-box-shadow:1px 1px 2px rgbaundefined0,0,0,0.1);box-shadow:1px 1px 2px rgbaundefined0,0,0,0.1);/*transition*/-webkit-transition:all 0.3s ease-in-out;-moz-transition:all 0.3s ease-in-out;-o-transition:all 0.3s ease-in-out;transition:all 0.3s ease-in-out;}.md-wrapper li a span:before,.md-wrapper li a span:after{content:'';position:absolute;bottom:-15px;left:50%;margin-left:-9px;width:0;height:0;border-left:10px solid transparent;border-right:10px solid transparent;border-top:10px solid rgbaundefined0,0,0,0.1);}.md-wrapper li a span:after{bottom:-14px;margin-left:-10px;border-top:10px solid #fff;}.md-wrapper li a:hover span{opacity:0.9;bottom:70px;}.md2-wrapper{padding:0;width:435px;height:70px;margin:80px auto 30px auto;}.md2-wrapper li{float:left;}.md2-wrapper ol,ul{list-style:none;}.md2-wrapper li a{display:block;width:68px;height:70px;margin:0 2px;outline:none;position:relative;z-index:2;background:transparent urlundefinedhttps://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgKlH6tAlxp6npD3znXDx01EGP-40KxzYe1QopyrvV-4ke3Ql3jnxhF9fhGxt2VzeQSqi4PxbVl6C9q7rPkqqy7Me5rGs1WhpLTy9NbmdzdIOsUdIusjrDa0LO9QgyVzfAII2QgM_2t7j1i/s1600/%255Bwww.gj37765.blogspot.com%255D_social_gunman_icons.png) no-repeat top left;text-indent:-9000px;}.md2-wrapper li .tt-gplus{background-position:0px 0px;}.md2-wrapper li .md2-twitter{background-position:-68px 0px;}.md2-wrapper li .md2-facebook{background-position:-204px 0px;}.md2-wrapper li a span{width:80px;height:80px;line-height:80px;padding:10px;left:50%;margin-left:-55px;font-family:'Alegreya SC', Georgia, serif;font-weight:400;font-style:italic;font-size:14px;color:#719DAB;text-shadow:1px 1px 1px rgbaundefined0, 0, 0, 0.1);text-align:center;border:5px solid #fff;background:rgbaundefined255,255,255,0.5);text-indent:0px;position:absolute;pointer-events:none;/*border-radius*/-webkit-border-radius:50%;-moz-border-radius:50%;border-radius:50%;bottom:-40px;opacity:0;/*box-shadow*/-webkit-box-shadow:0px 3px 8px rgbaundefined0,0,0,0.1);-moz-box-shadow:0px 3px 8px rgbaundefined0,0,0,0.1);box-shadow:0px 3px 8px rgbaundefined0,0,0,0.1);/*transform*/-webkit-transform:scaleundefined0.2);-moz-transform:scaleundefined0.2);-ms-transform:scaleundefined0.2);-o-transform:scaleundefined0.2);transform:scaleundefined0.2);/*transition*/-webkit-transition:all 0.3s ease-in-out;-moz-transition:all 0.3s ease-in-out;-o-transition:all 0.3s ease-in-out;transition:all 0.3s ease-in-out;}.md2-wrapper li a:hover span{opacity:0.9;bottom:50px;/*transform*/-webkit-transform:scaleundefined1);-moz-transform:scaleundefined1);-ms-transform:scaleundefined1);-o-transform:scaleundefined1);transform:scaleundefined1);}.md3-wrapper{padding:0;width:435px;height:70px;margin:80px auto 30px auto;}.md3-wrapper li{float:left;}.md3-wrapper ol,ul{list-style:none;}.md3-wrapper li a{display:block;width:68px;height:70px;margin:0 2px;outline:none;position:relative;z-index:2;background:transparent urlundefinedhttps://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgKlH6tAlxp6npD3znXDx01EGP-40KxzYe1QopyrvV-4ke3Ql3jnxhF9fhGxt2VzeQSqi4PxbVl6C9q7rPkqqy7Me5rGs1WhpLTy9NbmdzdIOsUdIusjrDa0LO9QgyVzfAII2QgM_2t7j1i/s1600/%255Bwww.gj37765.blogspot.com%255D_social_gunman_icons.png) no-repeat top left;text-indent:-9000px;}.md3-wrapper li .md3-gplus{background-position:0px 0px;}.md3-wrapper li .md3-twitter{background-position:-68px 0px;}.md3-wrapper li .md3-facebook{background-position:-204px 0px;}.md3-wrapper li a span{width:80px;height:auto;padding:10px;left:50%;margin-left:-55px;font-family:'Alegreya SC', Georgia, serif;font-weight:400;font-style:italic;font-size:14px;color:#719DAB;text-shadow:1px 1px 1px rgbaundefined0, 0, 0, 0.1);text-align:center;border:5px solid #fff;background:rgbaundefined255,255,255,0.5);text-indent:0px;position:absolute;pointer-events:none;bottom:-40px;opacity:0;/*box-shadow*/-webkit-box-shadow:0px 1px 2px rgbaundefined0,0,0,0.1);-moz-box-shadow:0px 1px 2px rgbaundefined0,0,0,0.1);box-shadow:0px 1px 2px rgbaundefined0,0,0,0.1);/*transition*/-webkit-transition:all 0.3s ease-in-out;-moz-transition:all 0.3s ease-in-out;-o-transition:all 0.3s ease-in-out;transition:all 0.3s ease-in-out;/*transform*/-webkit-transform:rotateundefined0deg) scaleundefined0);-moz-transform:rotateundefined0deg) scaleundefined0);-ms-transform:rotateundefined0deg) scaleundefined0);-o-transform:rotateundefined0deg) scaleundefined0);transform:rotateundefined0deg) scaleundefined0);}.md3-wrapper li a:hover span{opacity:0.9;bottom:100px;/*transform*/-webkit-transform:rotateundefined-90deg) scaleundefined1);-moz-transform:rotateundefined-90deg) scaleundefined1);-ms-transform:rotateundefined-90deg) scaleundefined1);-o-transform:rotateundefined-90deg) scaleundefined1);transform:rotateundefined-90deg) scaleundefined1);}.md4-wrapper{padding:0;width:435px;height:70px;margin:80px auto 30px auto;}.md4-wrapper li{float:left;}.md-wrapper ol,ul{list-style:none;}.md4-wrapper li a{display:block;width:68px;height:70px;margin:0 2px;outline:none;background:transparent urlundefinedhttps://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgKlH6tAlxp6npD3znXDx01EGP-40KxzYe1QopyrvV-4ke3Ql3jnxhF9fhGxt2VzeQSqi4PxbVl6C9q7rPkqqy7Me5rGs1WhpLTy9NbmdzdIOsUdIusjrDa0LO9QgyVzfAII2QgM_2t7j1i/s1600/%255Bwww.gj37765.blogspot.com%255D_social_gunman_icons.png) no-repeat top left;text-indent:-9000px;position:relative;}.md4-wrapper li .md4-gplus{background-position:0px 0px;}.md4-wrapper li .md4-twitter{background-position:-68px 0px;}.md4-wrapper li .md4-facebook{background-position:-204px 0px;}.md4-wrapper li a span{width:100px;height:auto;line-height:20px;padding:10px;left:50%;margin-left:-64px;font-family:'Alegreya SC', Georgia, serif;font-weight:400;font-style:italic;font-size:14px;color:#719DAB;text-shadow:1px 1px 1px rgbaundefined0, 0, 0, 0.1);text-align:center;border:4px solid #fff;background:rgbaundefined255,255,255,0.3);text-indent:0px;/*border-radius*/-webkit-border-radius:5px;-moz-border-radius:5px;border-radius:5px;position:absolute;bottom:70px;opacity:0;visibility:visible;pointer-events:none;/*box-shadow*/-webkit-box-shadow:1px 1px 2px rgbaundefined0,0,0,0.1);-moz-box-shadow:1px 1px 2px rgbaundefined0,0,0,0.1);box-shadow:1px 1px 2px rgbaundefined0,0,0,0.1);/*transform*/-webkit-transform:translateundefined35px) rotateundefined25deg) scaleundefined1.5);-moz-transform:translateundefined35px) rotateundefined25deg) scaleundefined1.5);-ms-transform:translateundefined35px) rotateundefined25deg) scaleundefined1.5);-o-transform:translateundefined35px) rotateundefined25deg) scaleundefined1.5);transform:translateundefined35px) rotateundefined25deg) scaleundefined1.5);/*transition*/-webkit-transition:all 0.3s ease-in-out;-moz-transition:all 0.3s ease-in-out;-o-transition:all 0.3s ease-in-out;transition:all 0.3s ease-in-out;}.md4-wrapper li a span:before,.md4-wrapper li a span:after{content:'';position:absolute;bottom:-15px;left:50%;margin-left:-9px;width:0;height:0;border-left:10px solid transparent;border-right:10px solid transparent;border-top:10px solid rgbaundefined0,0,0,0.1);}.md4-wrapper li a span:after{bottom:-14px;margin-left:-10px;border-top:10px solid #fff;}.md4-wrapper li a:hover span{visibility:visible;opacity:0.9;/*transform*/-webkit-transform:translateundefined0px) rotateundefined0deg) scaleundefined1);-moz-transform:translateundefined0px) rotateundefined0deg) scaleundefined1);-ms-transform:translateundefined0px) rotateundefined0deg) scaleundefined1);-o-transform:translateundefined0px) rotateundefined0deg) scaleundefined1);transform:translateundefined0px) rotateundefined0deg) scaleundefined1);}</style>

<ul class="md3-wrapper"><li>
<a class="md3-gplus" href="https://plus.google.com/u/0/118384581860977679645"><span>Google Plus</span></a></li>
<li><a class="md3-twitter" href="https://www.twitter.com/way2bloggerz"><span>Twitter</span></a></li>
<li><a class="md3-facebook" href="https://www.facebook.com/way2bloggerz"><span>Facebook</span></a></li></ul>

CUSTOMIZATION

1.Replace 118381860977679645 with your Google+ ID in line 4 .

2.Replace way2bloggerz with your twitter username in line 5.

3.Replace way2bloggerz with your facebook username in line 6.

ENJOY.........................

Awesome Social sharing buttons below blog post

2012-04-21T03:52:00.000-07:00

We have given you a post about adding social sharing buttons to blog post but now we are presenting these buttons for you ina new style with hover fading effect its very simple to add these buttons at the end of your post

View Demo

STEP 1

1.Go to blogger Dashboard>Templet>Edit HTML.
2.Now check Expand Widget Templet
3.Press Ctrl+F and find ]]></b:skin>.
4.Now paste the below given code above ]]></b:skin>

.w2bz img {
filter:alphaundefinedopacity=100);
-moz-opacity: 1.0;
opacity: 1.0;}
.w2bz:hover img {
filter:alphaundefinedopacity=60);
-moz-opacity: 0.60;
opacity: 0.60;
}

STEP 2

1.Now again Press Ctrl+F and find <data:post.body/>
2.Now paste the below given code below <data:post.body/>

<b:if cond="data:blog.pageType == &quot;item&quot;">
<center><span style="color: #0066cb; font-family: Verdana; font-size: 14px;"><b>If You Like This Post Please mind to Share It.</b></span>



<a class="w2bz" expr:href="&quot;http://technorati.com/faves?add=&quot; + data:post.url" href="" rel="external nofollow" target="_blank"><img alt="Technorati" height="64px" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhpEw1OlOzm-ktg3l66YSyO4xun-yL5RTBM3NSTWMWMfBkkqXlPrfsRZNlEFl8U-qGCiOj1x-wisxENlbtvnTjKkyCUGzM5gELJV907eUZKKxyBSmOAp7YJG0LXbi3D4C_loCXkUwNfRqLR/s1600/TECHNORATI.png " width="64px" /></a>
<a class="w2bz" expr:href="&quot;http://digg.com/submit?phase=2&amp;url=&quot;  + data:post.url" href="" rel="external nofollow" target="_blank"><img alt="Digg This" height="80px" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjt-hBQu9x5zqXQn2C84Ewnv7KZG5B9AtrXCxKI26uknUlXL2SrAC6GrOd4xs3DGCsHQOlS4XaojmlULh4XXRT2dLso3IcFOlREkJv3B87o8NG9MnZsr6rhcMEk00rtL8Y6JPBMEpgJnXRI/s400/DIGG.png " width="80px" /></a>
<a class="w2bz" expr:href="&quot;http://www.facebook.com/sharer.php?u=&quot; + data:post.url + &quot;&amp;t=&quot; + data:post.title" href="" rel="external nofollow" target="_blank"><img alt="Facebook" height="100px" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiJgMRqeMYGuBPxDbdOv3ttIM3I9ICGYjeYg95PS-NRwsDkIlQmh2LdjqaeYktgOiP5qU_cKZaihZmATJJ-6AiK4sx_UtlPmVBje3HWRQHCvpP-DM46r5zEArqS6MtnnOf78uj3sOqmdys6/s1600/FACEBOOK.png" width="100px" /></a>
<a class="w2bz" expr:href="&quot;http://twitthis.com/twit?url=&quot; + data:post.url + &quot;&amp;title=&quot; + data:post.title" href="" rel="external nofollow" target="_blank"><img alt="Twitter" height="100px" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjRjL0yJSdRSkTd1HKbxZZ8Ih3lLQUyFQyMQk5VpAbkbDt_8TScWK6LD1zyHA1chf_wusF95yAKH1oaEgZ-k34XUnFdq6cl3Ko4_PZINrfxqpgHi154u5Wn-b1N7MhrOuEzqbWtkO6SBola/s1600/TWITTER.png" width="100px" /></a>
<a class="w2bz" expr:href="&quot;http://www.stumbleupon.com/submit?url=&quot; + data:post.url + &quot;&amp;title=&quot; + data:post.title" href="" rel="external nofollow" target="_blank"><img alt="Stumble" height="80px" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEh4penvpqWcjUFvXQZaVWd243ggqMtx4d4Dyn8hq4QsrV4sQh37h1sNk-vRwm8m_RSW3aFS7_b-hEVTv0MYMd-IRbATB_hmTGusKfTGNinXK9bxejqo9zSvPXdIRx0w4V9RBRFLbcUFqmhy/s1600/stumble.png" width="80px" /></a>
<a class="w2bz" expr:href="&quot;http://reddit.com/submit?url=&quot; + data:post.url + &quot;&amp;title=&quot; + data:post.title" href="" rel="external nofollow" target="_blank"><img alt="Stumble" height="64px" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgvf54fvhyphenhyphensec8Amgn0dsQdOS7_bruJx_MPJPMG6npdKDC4Q7s_AYRASwBNaejZ78cX5TutMhFMomHf0v_SQexvLtW3KyFi9SMAQR3i2_NBFjFYPmKrpSLizCOmXRC249qM3i8ie21hKGeF/s1600/REDDIT.png" width="64px" /></a>
</center>
</b:if>

Enjoy........................................

How to display Post author,Date,Label below post title with icons

2012-04-17T11:10:00.003-07:00

When you see some blogs with icons before post author ,date and label then you think how you can add these for your blog its very simple here we are giving a code which will display your post footer below post title with some icons you can also replace these icons with your icons if you want them as you like

it contains a comment icon also which says 'be the first to comment 'if there is no comment and if there is any comment it says no. with comment
its very easy to add it for your blog
Before adding this code if you want to delete your footer which is provided by blogger you can check this

you can see the live DEMO in my Blog
STEPS

1.Go to Blogger Dashboard >Templet > Edit HTML.
2.Tick expand widget templates check box.

3.Now press Ctrl+F and find <div class='post-header-line-1'>
4.Add below given code just above <div class='post-header-line-1'>

<b:loop values='data:post.labels' var='label'>

<b:if cond='data:label.isLast != "true"'>|</b:if>

</b:loop>

</b:if></font>

<b:if cond='data:blog.pageType != "item"'>

<b:if cond='data:post.allowComments'>

<a class='comment-link' expr:href='data:post.addCommentUrl' expr:onclick='data:post.addCommentOnclick' style='background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgFb2wMiAe8IbJVIyF67H0hjMIL5cf2ZOmet0ENG90ldgreLZJ8mWqeugUGaPXgsmKXSK6YSGlpQFoFwnkVAWTS7h0MBm-rl8infIKsjlB4edDR5psNJ3LYKdTU7aFhDZYEfHOsEM0teJ2r/s1600/comment-icon.png) no-repeat;Padding-left:20px;'><b:if cond='data:post.numComments == 0'>Be the first to comment!<b:else/> <b:if cond='data:post.numComments == 1'><data:post.numComments/> Comment so far<b:else/><data:post.numComments/> Comments so far</b:if> </b:if></a>

</b:if>

</span>

Customizations (Optional)

If you want to change AUTHOR icon then replace the code in RED with your own icon.
If you want to change DATE CLOCK icon then replace the code in BLUE with your own icon.
If you want to change LABEL icon then replace the code in LIME with your own icon.
If you want to change COMMENT BUBBLE icon then replace the code in ORANGE with your own icon.

How to Customize Post Footer

2012-04-17T10:05:00.002-07:00

When you are new to blogger you want to customize your blog according to your choice such as add a stylish menu bar for your blog,Customize your post footer options and much more.You can customize in four different ways.we are going to explain all of them
1.Add/Remove Basic Post Footer Options
2.Remove Post Footer from Homepage/Index Page
3.Remove Post Footer from Post and Static Pages
4.Remove Page Footer Completely from your Blog

1.Add/Remove Basic Post Footer Options
This facility is already provided by the blogger you have to some simple steps to do so

Steps
1.Go to Blogger Dashboard>Layout.
2.Now in Blog Posts click on Edit option

There you find all the options related to Post page and Post footer
some basic customizations are

- Add/remove share buttons
- Customize number of posts displayed on homepage
- Enable/disable reactions
- Showing off location
- Displaying number of comments on footer
- Showing author name
- Customize date and time displayed on footer

After customizations Now click on Save................

2.Remove Post Footer from Homepage/Index Page
If you want to remove post footer options from your homepage you have to add a CSS code to your templet.

Steps
1.Go to Blogger Dashboard>Templet>Edit HTML.
2.Now press Ctrl+F and find ]]></b:skin>
3.Now paste the below given code after ]]></b:skin>

<b:if cond='data:blog.pageType == "index"'>

.post-footer {display:none !important;}

</b:if>

</style>

4. Preview your blog to confirm changes and Save template.

3.Remove Post Footer from Post and Static Pages

If you are like to disable your post footer from other pages while keeping it on homepage, you can try below method.

1.Go to Blogger Dashboard>Templet>Edit HTML.
2.Now press Ctrl+F and find ]]></b:skin>
3.Now paste the below given code after ]]></b:skin>

<style type='text/css'>
<b:if cond='data:blog.pageType != "index"'>
.post-footer {display:none !important;}
</b:if>
</style>

4. Preview your blog to confirm changes and Save template.

4.Remove Page Footer Completely from your Blog
you can also remove your post footer completely from your blog.
you can also put post footer below post title with different style

1.Go to Blogger Dashboard>Templet>Edit HTML.
2.Tick on, Expand Widget Templates.

3.Now press Ctrl+F and find .post-footer

4.Now paste the below given after after .post-footer

display:none !important;

i.e: .post-footer {

display:none !important;

........................................

}

5. Now Save your template.

Enjoy....................

Mashable social sharing widget for Blogger

2012-04-16T01:32:00.001-07:00

One of the great social Plugins for blogger is Mashable social sharing widget and here way2bloggerz made it easy for you to add it to your blog widget contain all the social media buttons you know on internet it contains Facebook, Twitter, RSS Feed, Recommend on Google+, and its easy to install all you have to do add it as a gadget to your blogger layout.

PREVIEW

STEPS
1.Go to blogger Dashboard>Layout>Add a Gadget
2.Now choose HTML/Javascript and paste the code given below in it(don't forget to customize code for your blog Customizations given below the code)

<style> 
/* Social Widget */ 
#W2Bz-Social { 
    border: 0; 
    margin-bottom: 10px; 
    margin: 0 auto; 
        width:300px; 
} 
.fb-likebox { 
    background: #fff; 
    padding: 10px 10px 0 10px; 
    border: 1px solid #D8E6EB; 
    margin-top: -2px; 
        height:80px; 
} 
.googleplus { 
    background: #F5FCFE; 
    border-top: 1px solid #FFF; 
    border-bottom: 1px solid #ebebeb; 
    border-right: 1px solid #D8E6EB; 
    border-left: 1px solid #D8E6EB; 
    border-image: initial; 
    font-size: .90em; 
    font-family: "Arial","Helvetica",sans-serif; 
    color: #000; 
    padding: 9px 11px; 
    line-height: 1px;} 
.googleplus span { 
    color: #000; 
    font-size: 11px; 
    position: absolute; 
    display:inline-block; 
    margin: 9px 70px;} 
.g-plusone {    float: left;} 
.twitter { 
    background: #EEF9FD; 
    padding: 10px; 
    border: 1px solid #C7DBE2; 
    border-top: 0;} 
#mashable { 
    background: #EBEBEB; 
    border: 1px solid #CCC; 
    border-top: 1px solid white; 
    padding: 2px 8px 2px 3px; 
    text-align: right; 
    border-image: initial;} 
#mashable .author-credit {} 
#mashable .author-credit a { 
    font-size: 10px; 
    font-weight: bold; 
    text-shadow: 1px 1px white; 
    color: #1E598E; 
    text-decoration:none;} 
#email-news-subscribe .email-box{ 
    padding: 5px 10px; 
    font-family: "Arial","Helvetica",sans-serif; 
    border-top: 0; 
    border-right: 1px solid #C7DBE2; 
    border-left: 1px solid #C7DBE2; 
    border-image: initial; 
   height:35px;} 
#email-news-subscribe .email-box input.email{ 
    background:#FFFFFF; 
    border: 1px solid #dedede; 
    color: #999; 
    padding: 7px 10px 8px 10px; 
    -moz-border-radius: 3px; 
    -webkit-border-radius: 3px; 
    -o-border-radius: 3px; 
    -ms-border-radius: 3px; 
    -khtml-border-radius: 3px; 
    border-radius: 3px; 
    border-image: initial; 
    font-family: "Arial","Helvetica",sans-serif;}    
#email-news-subscribe .email-box input.email:focus{color:#333}    
#email-news-subscribe .email-box input.subscribe{ 
    background: -moz-linear-gradientundefinedcenter top,#FFCA00 0,#FF9B00 100%); 
    background: -webkit-gradientundefinedlinear,left top,left bottom,color-stopundefined0,#FFCA00),color-stopundefined1,#FF9B00)); 
    background: -moz-linear-gradientundefinedcenter top,#FFCA00 0,#FF9B00 100%); 
    -pie-background: linear-gradientundefined270deg,#ffca00,#ff9b00); 
    font-family: "Arial","Helvetica",sans-serif; 
    border-radius:3px; 
    -moz-border-radius:3px; 
    -webkit-border-radius:3px; 
    border:1px solid #cc7c00; 
    color:white; 
    text-shadow:#d08d00 1px 1px 0; 
    padding:7px 14px; 
    margin-left:3px; 
    font-weight:bold; 
    font-size:12px; 
    cursor:pointer; 
    border-image: initial;} 
#email-news-subscribe .email-box input.subscribe:hover{ 
    background: #ff9b00; 
    background-image:-moz-linear-gradientundefinedtop,#ffda4d,#ff9b00); 
    background-image:-webkit-gradientundefinedlinear,left top,left bottom,fromundefined#ffda4d),toundefined#ff9b00)); 
    filter:progid:DXImageTransform.Microsoft.GradientundefinedstartColorStr=#ffffff,endColorStr=#ebebeb);
    outline:0;-moz-box-shadow:0 0 3px #999; 
    -webkit-box-shadow:0 0 3px #999; 
    box-shadow:0 0 3px #999 
    background:-webkit-gradientundefinedlinear,left top,left bottom,color-stopundefined0,#ffda4d),color-stopundefined1,#ff9b00)); 
    background:-moz-linear-gradientundefinedcenter top,#ffda4d 0,#ff9b00 100%); 
    -pie-background:linear-gradientundefined270deg,#ffda4d,#ff9b00); 
    border-radius:3px; 
    -moz-border-radius:3px; 
    -webkit-border-radius:3px; 
    border:1px solid #cc7c00; 
    color:#FFFFFF; 
    text-shadow:#d08d00 1px 1px 0}    
#other-social-bar { 
    background-color: #D8E6EB; 
    box-shadow: 0 1px 1px #FFFFFF inset; 
    padding: 0px; 
    font-family: "Arial","Helvetica",sans-serif; 
    font-weight:bold; 
    overflow: hidden; 
    border: 1px solid #B6D0DA; 
       height:37px; 
} 
#other-social-bar ul {list-style: none outside none; padding-left: 4px;} 
#other-social-bar .other-follow { 
    float: left; 
    color:#1E598E; 
    overflow: hidden; 
    height:20px; 
    padding:5px; 
    width: 270px;} 
#other-social-bar .other-follow ul { 
    list-style: none outside none; 
    padding-left: 4px;} 
#other-social-bar .other-follow ul li { 
    font-size: 12px; 
    font-weight: bold; 
    display:inline; 
    border:0; 
    text-shadow: 1px 1px white;}    
#other-social-bar .other-follow ul li a { 
    font-size: 12px; 
    color:#1E598E; 
    font-weight: bold; 
    display:inline; 
    text-shadow: 1px 1px white;} 
#other-social-bar .other-follow li { 
    font-size: 12px; 
    font-weight: bold; 
    display:inline; 
    border:0; 
    text-shadow: 1px 1px white;} 
#other-social-bar .other-follow li a { 
    font-size: 12px; 
    color:#1E598E; 
    font-weight: bold; 
    display:inline; 
    text-shadow: 1px 1px white;} 
#other-social-bar .other-follow li.my-rss { 
    background: urlundefined'https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEizVzUJhdnTFxyF9HpY5NXc_UdCByVpoQuYjah6JF3U0xKG-W94W9bAjPcUURuaQhhyphenhyphen8avrcXRebOGGVj3N6XLXN4EInbr6ptaRc0n6OhWuqQF4ZMYU8unopbAgcHQIzJuT5O4QpyrAkXw/s400/rss-16x16.png') no-repeat transparent; 
    line-height: 1; 
    padding: 0px 3px 1px 20px; 
    width: 60px; 
    margin-bottom:0px; 
        margin-left:5px;}
#other-social-bar .other-follow li.my-rss a, #other-social-bar .other-follow li.my-linkedin a, #other-social-bar .other-follow li.my-gplus a{ 
text-decoration:none; 
}
#other-social-bar .other-follow li.my-rss a:hover, #other-social-bar .other-follow li.my-linkedin a:hover, #other-social-bar .other-follow li.my-gplus a:hover{ 
text-decoration:underline; 
}
#other-social-bar .other-follow li.my-twitter { 
    background: urlundefined'https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiGRCAtgo7ipSwTdVhIKWrvi9eprfox5HYzY3c3trHaddl0I3VECGyljZAlSUGo9tIFqTEz2BxW88oZvzA8zaxrnZZLHUsOcEe_Rac4tB0hLhrdXMTrLdLbiULAqoiz-N21TbTwM5KTtsM/s1600/twiticon.jpg') no-repeat transparent; 
    line-height: 1; 
    padding: 0px 3px 1px 20px; 
    width: 60px; 
    margin-bottom:0px;} 
#other-social-bar .other-follow li.my-gplus { 
    background: urlundefinedhttps://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEh__MjaySHifBIQ5-fVFT1bYpf-DsS0VrZf2NASyjq06rq7L3Xl9lnaG2tZRfaLLjHvzuOXksq1_rw6LGZq_mg4ZHpxj9572pNxE8ZStPnYsQ-pn8nZ1LuYAY8XBC0yTWzokrygnThP66k/s400/gplus-16x16.png) no-repeat transparent; 
    line-height: 1; 
    width: 60px; 
    padding: 0px 3px 1px 20px; 
    margin-bottom:0px;}
</style>
<!--[if IE]>
<style> 
#email-news-subscribe .email-box input.subscribe{ 
    background: #FFCA00; 
    } 
</style>
<![endif]-->
 <!--begin of social widget--> <div style="margin-bottom:10px;"> <div id="W2Bz-Social" > <!-- Begin Widget --> <div class="fb-likebox"> <!-- Facebook --> <iframe src="//www.facebook.com/plugins/like.php?href=http://facebook.com/way2bloggerz&amp;send=false&amp;layout=standard&amp; width=200px&amp;show_faces=true&amp;action=like&amp;colorscheme=light&amp;
font&amp;height=100px&amp;appId=234513819928295" scrolling="no" frameborder="0" style="border:none; overflow:hidden; "></iframe> </div> <div class="googleplus"> <!-- Google --> <span>Recommend us on Google!</span><div class="g-plusone" data-size="medium"></div> <script type="text/javascript" src="https://apis.google.com/js/plusone.js"></script> </div> <div class="twitter"> <!-- Twitter --> <iframe title="" style="width: 300px; height: 20px;" class="twitter-follow-button" src="http://platform.twitter.com/widgets/follow_button.html#_=1319978796351&amp;
align=&amp;button=blue&amp;id=twitter_tweet_button_0&amp;
lang=en&amp;link_color=&amp;screen_name=way2bloggerz&amp;show_count=&amp;
show_screen_name=&amp;text_color=" frameborder="0" scrolling="no"></iframe> </div> <div id="email-news-subscribe"> <!-- Email Subscribe --> <div class="email-box">
<form action="http://feedburner.google.com/fb/a/mailverify" method="post" target="popupwindow" onsubmit="window.openundefined'http://feedburner.google.com/fb/a/mailverify?uri=itsallaboutblogging', 'popupwindow', 'scrollbars=yes,width=550,height=520');return true">    
        <input class="email" type="text" style="width: 150px; font-size: 12px;" id="email" name="email" value="Enter Your Email here.." onfocus="ifundefinedthis.value==this.defaultValue)this.value=&#39;&#39;;" onblur="ifundefinedthis.value==&#39;&#39;)this.value=this.defaultValue;" />        
        <input type="hidden" value="itsallaboutblogging" name="uri" /> 
        <input type="hidden" name="loc" value="en_US" /> 
        <input class="subscribe" name="commit" type="submit" value="Subscribe" />    
    </form> 
</div> </div> <div id="other-social-bar"> <!-- Other Social Bar --> <ul class="other-follow"> <li class="my-rss"> <a rel="nofollow" title="RSS" href="http://feeds.feedburner.com/itsallaboutblogging" target="_blank">RSS Feed</a> </li>
<li class="my-twitter"> <a rel="nofollow" title="Twitter" href="http://twitter.com/way2bloggerz" target="_blank">Twitter</a> </li>
<li class="my-gplus"> <a rel="nofollow" title="Google Plus" rel="author" href="http://plus.google.com/118384581860977679645" target="_blank">Google Plus</a> </li> </ul>
</div> <div id="mashable" style="background: #EBEBEB;border: 1px solid #CCC;border-top: 1px solid white;padding: 1px 8px 1px 3px;text-align: right;border-image: initial;font-size:10px;font-family: "arial","helvetica",sans-serif;"> <span class="author-credit" style="font-family: Arial, Helvetica, sans-serif;"><a href="http://way2bloggerz.blogspot.in/" target="_blank" >Blogger Widgets »</a></span></div></div>
<!-- End Widget --> </div> <!--end of social widget-->

Customizations
1.Replace Way2bloggerz with your Facebook Username in line 189
2.Replace Way2bloggerz with your Twitter Username in line 192
3.Replace itsallaboutblogging with your Feedburner title.Feedburner title is the word at the end of your Feedburner link.Ex.http://feeds.feedburner.com/itsallaboutblogging. in line 194,196
4.Replace http://feeds.feedburner.com/itsallaboutbloggin with your feedburner link. in line 200
5.Replace http://plus.google.com/118384581860977679645 with your Google+ Profile link in line 202

How to add Pinterest 'Pin it' Button to blog Post

2012-04-12T05:42:00.002-07:00

Its about more than a year passed for Pinterest to be in as social websites and it is becoming the first choice for all social networking site users and it is becoming the main traffic sources for blogs so your wait is over now and you can now add Pinterest 'Pin it' button to your blog posts

Here i am giving you two types of Pin it buttons for your blog
Horizontal and Vertical Pin it button.
Please Don't edit the code

Let's start Pinning it
1.Go to your blog Dashboard>Templet>Edit HTML.
2.Now click on the "Expand Widget Templets" on left upper corner
3.Now Press Ctrl+F and find code <data:post.body/>.
4.You can put Pin it button below post title or at the end of your post.If you want to put it below post title you have to put code given above <data:post.body/>.or if you want it at the last of your post paste the code below <data:post.body/>.

Horizontal Pin it button

<a class='pin-it-button' count-layout='horizontal' expr:href='&quot;http://pinterest.com/pin/create/button/?url=&quot; + data:post.url'>Pin It Now!</a> 
<a href='javascript:voidundefinedrun_pinmarkletundefined))' style='margin-left:-93px; width:43px; height:20px; display:inline-block;'/> 
<script src='http://assets.pinterest.com/js/pinit.js' type='text/javascript'/> 
<script type='text/javascript'> 
function run_pinmarkletundefined) { 
var e=document.createElementundefined&#39;script&#39;); e.setAttributeundefined&#39;type&#39;,&#39;text/javascript&#39;); 
e.setAttributeundefined&#39;charset&#39;,&#39;UTF-8&#39;); 
e.setAttributeundefined&#39;src&#39;,&#39;http://assets.pinterest.com/js/pinmarklet.js?r=&#39; + Math.randomundefined)*99999999); 
document.body.appendChildundefinede); 
} 
</script>

Vrticle Pin it button

<a class='pin-it-button' count-layout='vertical' expr:href='&quot;http://pinterest.com/pin/create/button/?url=&quot; + data:post.url'>Pin It now!</a> 
<a href='javascript:voidundefinedrun_pinmarkletundefined))' style='margin-left:-46px; width:43px; height:20px; display:inline-block;'/> 
<script src='http://assets.pinterest.com/js/pinit.js' type='text/javascript'/> 
<script type='text/javascript'> 
function run_pinmarkletundefined) { 
var e=document.createElementundefined&#39;script&#39;); e.setAttributeundefined&#39;type&#39;,&#39;text/javascript&#39;); 
e.setAttributeundefined&#39;charset&#39;,&#39;UTF-8&#39;); 
e.setAttributeundefined&#39;src&#39;,&#39;http://assets.pinterest.com/js/pinmarklet.js?r=&#39; + Math.randomundefined)*99999999); 
document.body.appendChildundefinede); 
} 
</script>

5.Save your templet and you are done.....................

want to know how to promote your blog using Pinterest wait for my next post

I hope you Enjoy!

Awesome Social sharing widget for blog posts

2012-04-10T01:29:00.000-07:00

We have alredy given social sharing widget for blog post in one of our previous posts and it helped you to increase your blogg traffic but here we are giving you a new social sharing widget with more buttons this widget includes Twitter , Facebook , Stumbleupon , Digg , Reddit , Google , Delicious , Mixx , Technorati , Yahoo!Buzz , Myspace and sahre this buttons,You can also customize it's positon,you can put it below your post title or at the end of your post,
it's up to you where you want to place this widget

View Demo

STEP 1
1.Go to your blogger dashboard
2.Now go to Templet>Edit HTML
3.Backup your Templet before making any changes to CSS code
4.Click on the box at Top left corner that says "Expand Widget Templets"
5.Now press Ctrl+F and find <data:post.body/>(if it appears more then once you will go with the first one in CSS code)
6.Copy the code below and paste it above <data:post.body/> if you want this widget below post title OR If you want this widget at the end of your post paste below given code below <data:post.body/>

<b:if cond='data:blog.pageType == &quot;item&quot;'>
<div id='share-w2bz'>
<ul>
<li><a class='twitter' expr:href='&quot;http://twitter.com/?status=&quot; + data:post.title + &quot; - &quot; + data:post.url ' rel='nofollow' target='_blank' title='Share this post on twitter'/></li>
<li><a class='facebook' expr:href='&quot;http://www.facebook.com/sharer.php?u=&quot; + data:post.url + &quot;&amp;title=&quot; + data:post.title' rel='nofollow' target='_blank' title='Share this post on Facebook'/></li>
<li><a class='stumbleupon' expr:href='&quot; http://www.stumbleupon.com/submit?url=&quot; + data:post.url + &quot;&amp;title=&quot; + data:post.title' rel='nofollow' target='_blank' title='Share this post on Stunbleupon'/></li>
<li><a class='digg' expr:href='&quot;http://digg.com/submit?url=&quot; + data:post.url + &quot;&amp;title=&quot; + data:post.title' rel='nofollow' target='_blank' title='Share this post on Digg'/></li>
<li><a class='reddit' expr:href='&quot; http://www.reddit.com/submit?url=&quot; + data:post.url + &quot;&amp;title=&quot; + data:post.title' rel='nofollow' target='_blank' title='Share this post on Reddit'/></li>
<li><a class='google' expr:href='&quot;http://www.google.com/bookmarks/mark?op=add&amp;bkmk=&quot; + data:post.url + &quot;&amp;title=&quot; + data:post.title' rel='nofollow' target='_blank' title='Bookmark this post on Google'/></li>
<li><a class='del-icio-us' expr:href='&quot;http://del.icio.us/post?url=&quot; + data:post.url + &quot;&amp;title=&quot; + data:post.title' rel='nofollow' target='_blank' title='Share this post on delicious'/></li>
<li><a class='mixx' expr:href='&quot;http://www.mixx.com/submit?page_url=&quot; + data:post.url + &quot;&amp;title=&quot; + data:post.title ' rel='nofollow' target='_blank' title='Share this post on Mixx'/></li>
<li><a class='technorati' expr:href='&quot; http://technorati.com/faves?add=&quot; + data:post.url + &quot;&amp;title=&quot; + data:post.title' rel='nofollow' target='_blank' title='Fav on Technorati'/></li>
<li><a class='yahoobuzz' expr:href='&quot;http://buzz.yahoo.com/submit/?url=&quot;+ data:post.url' rel='nofollow' target='_blank' title='Share this post on Yahoo!Buzz'/></li>
<li><a class='myspace' expr:href='&quot;http://www.myspace.com/Modules/PostTo/Pages/?u=&quot;+ data:post.url + &quot;&amp;t=&quot; + data:post.title' rel='nofollow' target='_blank' title='Sahre this post on Myspace'/></li>
<li><a class='a2a_dd more' expr:href='&quot;http://www.addtoany.com/share_save?url=&quot; + data:post.url + &quot;&amp;title=&quot; + data:post.title '/><script src='http://static.addtoany.com/menu/page.js' type='text/javascript'/></li>
</ul>
</div>
</b:if>

You are half done now....................(Don't close the CSS templet)

STEP 2
1.Now again press Ctrl+F and find ]]></b:skin>
2.Now paste the below given code befor ]]></b:skin>&save your templet

#share-w2bz ul {list-style: none;clear: none;padding: 0px 0px ;margin: 5px 0;}
#share-w2bz ul li {display: inline;background:none;margin:0;padding:0;}
#share-w2bz ul li a {display: block;float: left;width: 32px;height:32px;background-image: url('https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEh3INzSVxb03WfZRb_LuNDwITVy6e7ok57UpyAWvMFlq_lGMjmQ0jvN2JbAeHZbD_cuVspdSwl-ml9oNOzHzAZ6Kqh0XOzFPwPQ879WgL3g35HsxdJlBIm6leh5xhYyq4mHFCbllLskcSW0/s1600/way2blogging-share-icons-sprite.png') ;margin-left:3px;background-repeat: no-repeat;margin-right: 2px;-moz-transition: all 0.3s ease;-o-transition: all 0.3s ease; -webkit-transition: all 0.3s ease; -ms-transition: all 0.3s ease; transition: all 0.3s ease; }
#share-w2bz ul li a.twitter    {background-position: -0px -0px;   }
#share-w2bz ul li a.twitter:hover {background-position: -0px -33px;  }
#share-w2bz ul li a.facebook   {background-position: -32px -0px;  }
#share-w2bz ul li a.facebook:hover {background-position: -32px -33px; }
#share-w2bz ul li a.stumbleupon  {background-position: -64px -0px;  }
#share-w2bz ul li a.stumbleupon:hover{background-position: -64px -33px; }
#share-w2bz ul li a.digg    {background-position: -192px -0px; }
#share-w2bz ul li a.digg:hover  {background-position: -192px -33px;}
#share-w2bz ul li a.reddit   {background-position: -160px -0px; }
#share-w2bz ul li a.reddit:hover  {background-position: -160px -33px;}
#share-w2bz ul li a.google   {background-position: -128px -0px; }
#share-w2bz ul li a.google:hover  {background-position: -128px -33px;}
#share-w2bz ul li a.del-icio-us  {background-position: -480px -0px; }
#share-w2bz ul li a.del-icio-us:hover{background-position: -480px -33px;}
#share-w2bz ul li a.mixx    {background-position: -96px -0px;  }
#share-w2bz ul li a.mixx:hover  {background-position: -96px -33px; }
#share-w2bz ul li a.technorati  {background-position: -416px -0px; }
#share-w2bz ul li a.technorati:hover {background-position: -416px -33px;}
#share-w2bz ul li a.linkin   {background-position: -256px -0px; }
#share-w2bz ul li a.linkin:hover  {background-position: -256px -33px;}
#share-w2bz ul li a.yahoobuzz  {background-position: -448px -0px; }
#share-w2bz ul li a.yahoobuzz:hover {background-position: -448px -33px;}
#share-w2bz ul li a.myspace   {background-position: -512px -0px; }
#share-w2bz ul li a.myspace:hover {background-position: -512px -33px;}
#share-w2bz ul li a.more    {background-position: -576px -0px; }
#share-w2bz ul li a.more:hover  {background-position: -576px -33px;}

Enjoy..................................
For getting the latest blogging action subscribe to our rss feed

Awesome Link Nudging on links on Hover

2012-04-08T09:19:00.001-07:00

If you ever seen Link nudging for labels and custom Links on Hover in any blogg and you want it for your blogg too.So here way2bloggerz made it easy for you to add nudging effect to your labels and as well as for custom links.you can use this smooth nudging effect for your labels as well as for your custom links just adding a simple code to your blog CSS code

STEPS
1.Go to your blogger Dashboard>Templet>Edit HTML
2.Backup your Templet as always
3.Now press Ctrl+F and find </head>
4.Now add the below given code just above </head>

<script src='http://ajax.googleapis.com/ajax/libs/jquery/1.6.4/jquery.min.js' type='text/javascript'>
</script>
<script type='text/javascript'>
    var dur = 400; // Duration Of Animation in Milli Seconds
    $(document).ready(function() {
        $('a.linknudge, .Label ul li a').hover(function() {
            $(this).animate({
                paddingLeft: '25px'
            }, dur);
        }, function() {
            $(this).animate({
                paddingLeft: 0
            }, dur);
        });
    }); // end of Jquery Script
</script>

If you want this for your custom links simply add a class='linknudge' to your links as shown below
<a class ='linknudge' href='http://www.way2bloggerz.blogspot.com'>way2bloggerz</a>

Enjoy..............
like us and comment if you like this post

Social sharing Buttons for blog Post

2012-04-08T02:09:00.001-07:00

Here is the widget that will help you to increase your blogg traffic with social sharing buttons this widget includes Twitter,Facebook like,Stumble upon,Google + and sahre this buttons,You can also customize it's positon,you can put it below your post title or at the end of your post,
it's up to you where you want to place this widget
.As far as blog traffic is concerned when any visitor share your post to social media it will circulate in social media and which will help you to increase your blog traffic

LIVE DEMO

STEPS
1.Go to your blogger dashboard
2.Now go to Templet>Edit HTML
3.Backup your Templet before making any changes to CSS code
4.Click on the box at Top left corner that says "Expand Widget Templets"
5.Now press Ctrl+F and find <data:post.body/>(if it appears more then once you will go with the first one in CSS code)
6.Copy the code below and paste it above <data:post.body/> if you want this widget below post title OR If you want this widget at the end of your post paste below given code below <data:post.body/>

<b:if cond='data:blog.pageType == &quot;item&quot;'> <div style='background:#FFFFFF; border:1px solid #ddd; -moz-border-radius:9px; -webkit-border-radius:9px; border-radius:9px; padding:5px; box-shadow: 3px 3px 3px #CCCCCC;'> <table border='0'> <tr>
<td><!-- Twitter -->
<a class='twitter-share-button' data-count='horizontal' data-lang='en' expr:data-text='data:post.title' expr:data-url='data:post.url' href='http://twitter.com/share' rel='nofollow'/> <b:if cond='data:post.isFirstPost'> <script src='http://platform.twitter.com/widgets.js' type='text/javascript'> </script> </b:if> </td>
<td><!--Facebook-->
<iframe allowTransparency='true' expr:src='&quot;http://www.facebook.com/plugins/like.php?href=&quot; + data:post.url + &quot;&amp;layout=button_count&amp;show_faces=false&amp;width=100&amp; action=like&amp;font=arial&amp;colorscheme=light&quot;' frameborder='0' scrolling='no' style='border:none; overflow:hidden; margin-left:0px; width:100px; height:20px;'/> </td>
<td><div style='margin-right:25px;'><!-- STUMBLE UPON -->
<script expr:src='&quot;http://www.stumbleupon.com/hostedbadge.php?s=1&amp;r=&quot; + data:post.url'/></div> </td> <td><div style='margin-right:5px;'><!-- GOOGLEPLUS --> <g:plusone expr:href='data:post.url' size='medium'/> </div> </td>
<td><!-- AddThis Button BEGIN -->
<div class='addthis_toolbox addthis_default_style '> <a class='addthis_counter addthis_pill_style'/> </div> <script src='http://s7.addthis.com/js/250/addthis_widget.js#pubid=xa-4de3b2d654f56f28' type='text/javascript'/> <script type='text/javascript'> var addthis_config = { ui_cobrand: &quot;WAY2BLOGGERZ&quot;, ui_header_color: &quot;#ffffff&quot;, ui_header_background: &quot;#0080FF&quot; } </script>
<!-- AddThis Button END --></td> </tr> </table></div> </b:if><br/>

Important Customization
Background Color
To change the background color of container change FFFFFF in line 1
Blog Title
change WAY2BLOGGERZ in line 9 with your Blog Title that will appear on share button on mouse hover . as shown below

7.NOTE:skip this step if you have already added a Google+ button somewhere in your blog. Search for ]]></b:skin> and just below it paste the following code

<script src='http://apis.google.com/js/plusone.js' type='text/javascript'> {lang: &#39;en-US&#39;} </script>

Save your templet.....................and Enjoy

New facebook popup widget with subscription box

2012-04-07T08:12:00.000-07:00

Here is the widget that will help you to increase your facebook fans as well as subscriptions for your blogg.This facebook popup widget is a jquery plugin.as facebook social widget is widely used so way2bloggerz brings it for your blogg to increase facebook fans to your page and subscriptions.this widget is the updated version of last facebook widget i posted

View Demo

STEPS
1.Go to your blogger dashboard
2.Now go to Layout and select add a gadget and choose HTML/javascript
3.Now copy the code given below and edit your facebook username and subscription ID then paste it inside the content box of Html/javascript

<style>

        /* Jquery Facebook Likebox Popup Version 2.0  
        */
        #colorbox, #cboxOverlay, #cboxWrapper{position:absolute; top:0; left:0; z-index:9999; overflow:hidden;}
        #cboxOverlay{position:fixed; width:100%; height:100%;}
        #cboxMiddleLeft, #cboxBottomLeft{clear:left;}
        #cboxContent{position:relative;}
        #cboxLoadedContent{overflow:auto;}
        #cboxTitle{margin:0;}
        #cboxLoadingOverlay, #cboxLoadingGraphic{position:absolute; top:0; left:0; width:100%;}
        #cboxPrevious, #cboxNext, #cboxClose, #cboxSlideshow{cursor:pointer;}
        .cboxPhoto{float:left; margin:auto; border:0; display:block;}
        .cboxIframe{width:100%; height:100%; display:block; border:0;}
        /*
           User Style:
           Change the following styles to modify the appearance of ColorBox.  They are
           ordered & tabbed in a way that represents the nesting of the generated HTML.
        */
        #cboxOverlay{background:#000;opacity:0.5 !important;}
        #colorbox{
                box-shadow:0 0 15px rgba(0,0,0,0.4);
               -moz-box-shadow:0 0 15px rgba(0,0,0,0.4);
                -webkit-box-shadow:0 0 15px rgba(0,0,0,0.4);
               }
       #cboxTopLeft{width:14px; height:14px; 
background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjlIE9WjFeaa7RbbaCp6rwLBThyphenhyphenqedqdeGHWMapzsKq2_ERkiUAs8kIRNnQSSO5dd6qiiw6z7BAOcpE2ZJ1eeQ-EPII8SdCw1k5T4mjSWTzP7LCkY0o0nYgr0oWDmPmvKeq_e1ha0MJQxw/s1600/controls.png) no-repeat 0 0    #cboxTopCenter{height:14px; background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg4QzDY3izcfXsxAS_PeIsQGHQJS0XKb2EBzhMNIWoV3V15ZslvP5bnodqhxo6Kg1IpVqamP_AwGamaq0tgVzIHDC1-upwo327Jri6aKwQUWxSaA0TAPLIDWmXYK2-CDoWhp2VzqLWGmGQ/s400/border.png) repeat-x top left;}
        #cboxTopRight{width:14px; height:14px; 
background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjlIE9WjFeaa7RbbaCp6rwLBThyphenhyphenqedqdeGHWMapzsKq2_ERkiUAs8kIRNnQSSO5dd6qiiw6z7BAOcpE2ZJ1eeQ-EPII8SdCw1k5T4mjSWTzP7LCkY0o0nYgr0oWDmPmvKeq_e1ha0MJQxw/s1600/controls.png) no-repeat -36px 
0;}
        #cboxBottomLeft{width:14px; height:43px; 
background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjlIE9WjFeaa7RbbaCp6rwLBThyphenhyphenqedqdeGHWMapzsKq2_ERkiUAs8kIRNnQSSO5dd6qiiw6z7BAOcpE2ZJ1eeQ-EPII8SdCw1k5T4mjSWTzP7LCkY0o0nYgr0oWDmPmvKeq_e1ha0MJQxw/s1600/controls.png) no-repeat 0 
-32px;}
        #cboxBottomCenter{height:43px; 
background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg4QzDY3izcfXsxAS_PeIsQGHQJS0XKb2EBzhMNIWoV3V15ZslvP5bnodqhxo6Kg1IpVqamP_AwGamaq0tgVzIHDC1-upwo327Jri6aKwQUWxSaA0TAPLIDWmXYK2-CDoWhp2VzqLWGmGQ/s400/border.png) repeat-x bottom 
left;}
        #cboxBottomRight{width:14px; height:43px; 
background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjlIE9WjFeaa7RbbaCp6rwLBThyphenhyphenqedqdeGHWMapzsKq2_ERkiUAs8kIRNnQSSO5dd6qiiw6z7BAOcpE2ZJ1eeQ-EPII8SdCw1k5T4mjSWTzP7LCkY0o0nYgr0oWDmPmvKeq_e1ha0MJQxw/s1600/controls.png) no-repeat -36px 
-32px;}
        #cboxMiddleLeft{width:14px; 
background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjlIE9WjFeaa7RbbaCp6rwLBThyphenhyphenqedqdeGHWMapzsKq2_ERkiUAs8kIRNnQSSO5dd6qiiw6z7BAOcpE2ZJ1eeQ-EPII8SdCw1k5T4mjSWTzP7LCkY0o0nYgr0oWDmPmvKeq_e1ha0MJQxw/s1600/controls.png) repeat-y -175px 
0;}
     #cboxMiddleRight{width:14px; 
background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjlIE9WjFeaa7RbbaCp6rwLBThyphenhyphenqedqdeGHWMapzsKq2_ERkiUAs8kIRNnQSSO5dd6qiiw6z7BAOcpE2ZJ1eeQ-EPII8SdCw1k5T4mjSWTzP7LCkY0o0nYgr0oWDmPmvKeq_e1ha0MJQxw/s1600/controls.png) repeat-y -211px 
0;}
        #cboxContent{background:#fff; overflow:visible;}
            #cboxLoadedContent{margin-bottom:5px;}
#cboxLoadingOverlay{background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjqaGTI573IGihfoJxCdod304DuUVF8VvAApv9wf4o5cGkP_FuYjgasLKU86P4-bDvVesE2U6laTGge1tM_FPZMi4MtZ-09bn5kkK_7s0HNVm687JxmwYMsFjysTS3lWnr2DSUlhLRsm9k/s400/loadingback
ground.png) no-repeat center center;}
            #cboxLoadingGraphic{https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEh6fAvjXuRITTLQwspXSKQXA6X7QGDnmVqKsRxQlMYxo-3CEBM1ALc0PQUrCA6FlfuewHSNUVdoJIc7XYWc1AfmWSE_BL2H6dkCicJzZc6uJkfpSq8YC_PsnwHdv-WyzwmO1HvLtf1-fg4/s400/loading.gif) 
no-repeat center center;}
            #cboxTitle{position:absolute; bottom:-25px; left:0; text-align:center; width:100%; font-weight:bold; 
color:#7C7C7C;}
            #cboxCurrent{position:absolute; bottom:-25px; left:58px; font-weight:bold; color:#7C7C7C;}
            #cboxPrevious, #cboxNext, #cboxClose, #cboxSlideshow{position:absolute; bottom:-29px; 
background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjlIE9WjFeaa7RbbaCp6rwLBThyphenhyphenqedqdeGHWMapzsKq2_ERkiUAs8kIRNnQSSO5dd6qiiw6z7BAOcpE2ZJ1eeQ-EPII8SdCw1k5T4mjSWTzP7LCkY0o0nYgr0oWDmPmvKeq_e1ha0MJQxw/s1600/controls.png) no-repeat 0px 
0px; width:23px; height:23px; text-indent:-9999px;}
            #cboxPrevious{left:0px; background-position: -51px -25px;}
            #cboxPrevious.hover{background-position:-51px 0px;}
            #cboxNext{left:27px; background-position:-75px -25px;}
            #cboxNext.hover{background-position:-75px 0px;}
            #cboxClose{right:0; background-position:-100px -25px;}
            #cboxClose.hover{background-position:-100px 0px;}
            .cboxSlideshow_on #cboxSlideshow{background-position:-125px 0px; right:27px;}
            .cboxSlideshow_on #cboxSlideshow.hover{background-position:-150px 0px;}
            .cboxSlideshow_off #cboxSlideshow{background-position:-150px -25px; right:27px;}
            .cboxSlideshow_off #cboxSlideshow.hover{background-position:-125px 0px;}
        /*-----------------------------------------------------------------------------------*/
        /*   Facebook Likebox popup For Blogger Version 2.0
        /*-----------------------------------------------------------------------------------*/
        #subscribe {
            font: 12px/1.2 Arial,Helvetica,san-serif; color:#666;
        }
        #subscribe a,
        #subscribe a:hover,
        #subscribe a:visited {
            text-decoration:none;
        }
        .box-title {
           color: #336699;
           font-size: 18px !important;
           font-weight: bold;
           margin: 10px 0;
        border:6px solid #ddd;
        -moz-border-radius:6px;
        -webkit-border-radius:6px;
        border-radius:6px;
        box-shadow: 7px 7px 7px #CCCCCC;
        padding:10px;
        line-height:25px; font-family:arial !important;
        }
        .box-tagline {
           color: #999;
           margin: 0;
           text-align: center;
        }
        #subs-container {
            padding: 35px 0 30px 0;
            position: relative;
        }
        a:link, a:visited {
        border:none;
        }
        .demo {
        display:none;
        }
    /* ---------Subscribe Form---------- */
        .box-title1 {
        border:6px solid #ddd;
        -moz-border-radius:6px;
        -webkit-border-radius:6px;
        border-radius:6px;
        box-shadow: 7px 7px 7px #CCCCCC;
            padding:10px;
      margin: 10px 0;
        }
        .enteryouremail{
    background: #fff !important;
    border: 1px solid #d2d2d2;
    padding: 0px 8px 0px 8px;
    color: #a19999; font-size: 12px;
    height: 25px; width: 165px;
    border-radius: 5px;
    -moz-border-radius: 5px;
    -webkit-border-radius: 5px;
    margin:0px;
    }
        .submitbutton{
    background:#3E81C4;
    border: 1px solid #336699;
    text-shadow: 1px 1px 1px #333;
    box-shadow: 3px 3px 3px #666;
    font:bold 12px Arial, sans-serif;
    color: #fff;
    height: 25px;
    padding: 0 12px 0 12px;
    margin: 0 0 0 5px;
    border-radius: 5px;
    -moz-border-radius: 5px;
    -webkit-border-radius: 5px;
    cursor:pointer;}
 </style>
    <script src='https://ajax.googleapis.com/ajax/libs/jquery/1.6.1/jquery.min.js'></script>
    <script src="http://way2bloggerz.googlecode.com/files/w2bzface.js"></script>
    <script type="text/javascript">
    jQuery(document).ready(function(){
       if (document.cookie.indexOf('visited=true') == -1) {
           var fifteenDays = 1000*60*60*24*30;
           var expires = new Date((new Date()).valueOf() + fifteenDays);
           document.cookie = "visited=true;expires=" + expires.toUTCString();
       $.colorbox({width:"400px", inline:true, href:"#subscribe"});
           }
    });
    </script>
       <div style='display:none'>
           <div id='subscribe' style='padding:10px; background:#fff;'>
                <center><img 
src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhnp2ZyGU2jH2o6vYgwJPDKh_lCYI5YreK7N8zp0yMbvLItXtvV3El9BmuxlTfOItzHJ3IiVO-ERE7NK0KNJZ79EdEkNAFTOGZ5XD-xAlC_3FDyw2sQhxUUu_5uIcMTK09eYLdniiDQcGIU/s1600/joinusonfacebook.png" width:300px; 
height:104px;"/></center>
<center>
              <center>
         <iframe src="//www.facebook.com/plugins/likebox.php?href=http%3A%2F%2Fwww.facebook.com%2Fway2bloggerz&amp;width=300&amp;colorscheme=l

ight&amp;show_faces=true&amp;border_color=%23ffffff&amp;stream=false&amp;header=false&amp;height=258" scrolling="no" 

frameborder="0" style="border:none; overflow:hidden; width:300px; height:258px;" allowtransparency="true"></iframe>

    </center>
    <div class="box-title1 ">
    <center>
    <center><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEj4Diav9eMYjIWkN_7XHzIVnzP_wmwvYJpyC_hnx0jEgq3HcQ5tmgpIi5EPpp6bT7rXbjM92JeEOKeiAvZIed9iMuSp5KUkgql7EN9x99p12aRCNTgcSTheFmHJrpzyj-pKP5ZYP8GlnT9s/s1600/subscribe.png" width:300px; 
height:104px;"/></center>
        <form action="http://feedburner.google.com/fb/a/mailverify" method="post" target="popupwindow" 
onsubmit="window.open('http://feedburner.google.com/fb/a/mailverify?uri=itsallaboutblogging', 'popupwindow', 
'scrollbars=yes,width=550,height=520');return true"><input gtbfieldid="10" class="enteryouremail" name="email" value="Enter 
your email here..." onblur="if (this.value == &#39;&#39;) {this.value = &#39;Enter your email here...&#39;;}" onfocus="if 
(this.value == &#39;Enter your email here...&#39;) {this.value = &#39;&#39;;}" type="text" /><input 
value="itsallaboutblogging" name="uri" type="hidden" /><input value="Submit" class="submitbutton" type="submit" /></form>
    </center>
    </div>
    <!--Please Do not Remove the Credits -->
        <p style=" float:right;  margin-right:35px;  font-size:9px;" >Get <a style=" font-size:9px; color:#3B78CD; 
text-decoration:none;" href="http://way2bloggerz.blogspot.in/">This</a></p>
        </center></div>
        </div>

Important Customizations
facebook page Username
change way2bloggerz in line 162 with your facebook page username
Subscription ID
change itsallaboutblogging in line 174 and line 178 with your subscription ID

Sliding facebook popup for blogger

2012-04-07T02:06:00.000-07:00

Here is the new facebook sliding popup for blogger with hover effect .this gadget will slide out on hover from left of your browser window it is provided as a gadget so don't have to edit your CSS code just add it as a gadget to your blogg

<--LIVE DEMO

STEPS FOR INSTALLATION
1.Go to Blogger Dashbord>layout>Add a gadget
2.Now choose HTML/Javascript
3.Paste the below given code in it(first edit your facebook page name)

<style type="text/css">
/*<![CDATA[*/
#fbplikebox{display: block;padding: 0;z-index: 99999;position: fixed;}
.fbplbadge {background-color:3B5998;display: block;height: 150px;top: 50%;margin-top: -75px;position: absolute;right: -47px;width: 47px;background-image: url("https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjxhAT_eXbkiw9bUfSEtVhdaw2PNR8s1jNwrpfoP-SNJUlM0fNLQsmsnxdfN16oUZx-nT0-JXXKFgKdJoqHKzCCXGWBP6DM_nqBRBcMn4vGV7rFl-kSzNMFx9pLiXFFtfF89OIw7jCwyys/s1600/badgefacebook.png");background-repeat: no-repeat;overflow: hidden;-webkit-border-top-right-radius: 8px;-webkit-border-bottom-right-radius: 8px;-moz-border-radius-topright: 8px;-moz-border-radius-bottomright: 8px;border-top-right-radius: 8px;border-bottom-right-radius: 8px;}
/*]]>*/
</style>
<script type="text/javascript">
/*<![CDATA[*/
    (function(w2bz){
        w2bz(document).ready(function(){
            var $dur = "medium"; // Duration of Animation
            w2bz("#fbplikebox").css({left: -250, "top" : 100 })
            w2bz("#fbplikebox").hover(function () {
                w2bz(this).stop().animate({
                    left: 0
                }, $dur);
            }, function () {
                w2bz(this).stop().animate({
                    left: -250
                }, $dur);
            });
            w2bz("#fbplikebox").show();
        });
    })(jQuery);
/*]]>*/
</script>
<div id="fbplikebox" style="display:none;">
    <div class="fbplbadge"></div> 
    <iframe src="http://www.facebook.com/plugins/likebox.php?href=http%3A%2F%2Ffacebook.com%2Fway2bloggerz&amp;width=250&amp;height=250&amp;colorscheme=light&amp;show_faces=true&amp;border_color=%23C4C4C4&amp;stream=false&amp;header=false" scrolling="no" frameborder="0" style="border:none; overflow:hidden; width:250px; height:250px;background:#F5EBF5;" allowtransparency="true"></iframe>
</div>

IMPORTANT CHANGE
Replace way2bloggerz with your facebook page name in line 29

Flash animated label cloud Widget

2012-04-06T01:04:00.001-07:00

here is the new version of label cloud widget which gives a 3d look to your labels and easy to add to your Blogg here it is given as a widget so you don't have to edit your CSS code,you can also adjust it's color,height,width

but you have to provide you blog url to install this widget to your blogg.

View Demo

STEPS
1.Go to you blog Dashboard>Layout>Add a gadget
2.Now choose HTML/Javascript and paste the below given code in content box after editing it according to your choice

<div id="w2bzFlashContent"><p style="display:none;">Flash Labels by <a 

href="http://way2bloggerz.blogspot.in/">Way2Bloggerz</a></p></div>
<script type="text/javascript">
/*<![CDATA[*/
var w2bFlashLabelSettings = {
    blogurl        : "http://way2bloggerz.blogspot.com",
    color          : "000000",
    hoverColor     : "333333",
    backgroundColor: "FFFFFF",
    size           : 12,
    speed          : 100,
    width          : 250,
    height         : 300,
    transparency   : true
};
/*]]>*/
</script>
<script type="text/javascript" src="http://way2bloggerz.googlecode.com/files/flashlabel.js"></script>

Important
replace http://way2bloggerz.blogspot.com in line 7 with your blog url
Customization
adjust values from line 7 to 15 accordingly

Awesome jquery featured recent post slider

2012-04-04T09:21:00.000-07:00

Recent post widget is a very important widget now for your bloggs as it provide your visitor to show recent updates to your blogg but here we are giving this widget as a slider which is featured with jquery.you dont have to edit any text and put any image link to this slider all is automatic you have to only place your blogg address at one place
.if you want you can edit the frame width according to your blogg

View Demo

STEPS

1.Adding style of gadget

2.adding javascript

3.Adding gadget

Step 1--Adding style

1.Go to blogger Dashboad>Templet>Edit HTML

2.Find the code ]]></b:skin>

3.Paste the given below code above ]]></b:skin>(For customizations go below and read customization)

/* START EasySlider  */
#slide-container {
height:200px;
position:relative;
width:350px;
}
#slider {
height:200px;
left:25px;
overflow-x:hidden;
overflow-y:hidden;
position:relative;
width:350px;
font-family:calibri;
}
.slide-desc {
background:transparent url(http://i195.photobucket.com/albums/z105/dantearaujo/darkbg.png) repeat scroll 0 0;
color:#FFFFFF;
padding:10px;
position:absolute;
right:0px;
text-align:left;
top:0;
width:120px;
z-index:99999;
}
.slide-desc h2{display:block;}
.crosscol .widget-content {position:relative;}
#slider ul, #slider li,
#slider2 ul, #slider2 li{
margin:0;
padding:0;
list-style:none;
}
#slider2{margin-top:1em;}
#slider li, #slider2 li{
/*
define width and height of list item (slide)
entire slider area will adjust according to the parameters provided here
*/
width:350px;
height:200px;
overflow:hidden;
}
#prevBtn, #nextBtn,
#slider1next, #slider1prev{
display:block;
width:30px;
height:77px;
position:absolute;
left:-30px;
text-indent:-9999px;
top:71px;
z-index:1000;
}
#nextBtn, #slider1next{
left:370px !important;
}
#prevBtn, #nextBtn, #slider1next, #slider1prev {
display:block;
height:77px;
left:0;
position:absolute;
top:70px;
width:30px;
z-index:1000;
}
#prevBtn a, #nextBtn a,
#slider1next a, #slider1prev a{
display:block;
position:relative;
width:30px;
height:77px;
background:url(http://i195.photobucket.com/albums/z105/dantearaujo/prev.png) no-repeat 0 0;
}
#nextBtn a, #slider1next a{
background:url(http://i195.photobucket.com/albums/z105/dantearaujo/next.png) no-repeat 0 0;
}
/* numeric controls */
ol#controls{
margin:1em 0;
padding:0;
height:28px;
}
ol#controls li{
margin:0 10px 0 0;
padding:0;
float:left;
list-style:none;
height:28px;
line-height:28px;
}
ol#controls li a{
float:left;
height:28px;
line-height:28px;
border:1px solid #ccc;
background:#DAF3F8;
color:#555;
padding:0 10px;
text-decoration:none;
}
ol#controls li.current a{
background:#5DC9E1;
color:#fff;
}
ol#controls li a:focus, #prevBtn a:focus, #nextBtn a:focus{outline:none;}
/* END EasySlider  */

Step 2--Adding Javascript

1.Now find </body>

2.Paste the below given code above </body>


<!-- Start easy content slider by way2bloggerz -->

<script src='http://ajax.googleapis.com/ajax/libs/jquery/1.6/jquery.min.js' type='text/javascript'></script>

<script src='http://accordion-template.googlecode.com/svn/trunk/easySlider1.7.js' type='text/javascript'></script>

<script type='text/javascript'>
//<![CDATA[

ready(function(){
 $("#slider
$(document)
.").easySlider({
 auto: true,


continuous: true
 });
});
//]]>
</script>

->

<!-- End easy content slider way2bloggerz 
-

Step 3--Adding Gadget

1.Go to Layout>Add a gadget>Choose HTML/Javascript

2.Paste the below given code in content box


<div id="slider">

<script type='text/javascript'>

var showpostthumbnails_gal  = true;

var showpostsummary_gal   = true;

var random_posts         = false;

posts_gal   = 10;
function

var numchars_gal   = 150;

var nu

m showgalleryposts(json) {

d.openSearch$totalResults.$t;
    var indexPosts = new A

var numPosts = json.fe

erray();

document.write('<ul>');

for (var i = 0; i < numPosts; ++i) {

.sort(function() {return 0

indexPosts[i] = i;
}

andom_posts == true){
    i
if (

rndexPost

s.5 - Math.random()});
}

if (numposts_gal > numPosts) {
  
numposts_gal = numPosts;
    }

ar posttitle_gal =  entry_gal.title.$t;

for (i = 0; i < numposts_gal; ++i) {
        var entry_gal = json.feed.entry[indexPosts[i]];
  
v        for (var k = 0; k <  entry_gal.link.length; k++) {
            if ( entry_gal.link[k].rel == 'alternate') {

in entry_gal) {
            var postcontent_gal = ent
posturl_gal =  entry_gal.link[k].href;
                break;
            }
        }
  if ("content
"ry_gal.content.$t
        }
        s = postcontent_gal;
        a = s.indexOf("<img");
        b = s.indexOf("src=\"", a);
        c = s.indexOf("\"", b + 5);

url_gal = 'http://i1133.photobucket.com
d = s.substr(b + 5, c - b - 5);
        if ((a != -1) && (b != -1) && (c != -1) && (d != "")) {
            var thumburl_gal = d
        } else var thum
b/albums/m596/abu-farhan/Images_no_image.gif';
        document.write('<li><div id="slide-container"><span class="slide-desc"><h2 style="margin:10px 0px;">');

summary_gal == true) {
            if (postconte
document.write(posttitle_gal + '</h2>');
        var re = /<\S[^>]*>/g;
        postcontent_gal = postcontent_gal.replace(re, "");
        if (showpos
tnt_gal.length < numchars_gal) {
                document.write(postcontent_gal);
                document.write('</span>')
            } else {

;
                postcontent_gal = postcontent_gal.substring(0, quoteEnd_gal
postcontent_gal = postcontent_gal.substring(0, numchars_gal);
                var quoteEnd_gal = postcontent_gal.lastIndexOf(" "
));
                document.write(postcontent_gal + '...');
                document.write('</span>')
            }
        }

document.write('</li>');
    }
 document.write('</ul>');
 
}
</script>
<script style="text/javascript">
 var numposts_
document.write('<a href="' + posturl_gal + '"><img src="' + thumburl_gal + '" width="200px" height="200"/></a></div>');
   
 gal = 6;
 var numchars_gal = 150;
 var random_posts = false; // random posts
</script>
<!-- replace with your web address (marked with red color) -->

pt>
</div>

<script src="http://yourblog.blogspot.com/feeds/posts/default?orderby=published&alt=json-in-script&callback=showgalleryposts&max-results=999999"></scr

i

Customization

Important change

replace yourblog with your blog url name in line121 in step 3 code

Frame container

in step 1 code

adjust hight in line 3,8,42

adjust width in line 5,13,41

Text background width

adjust width in line 24 in step 1 code

Next button position

adjust position in line 54 (it should be frame container width+20px) in step 1 code

Next,previous button positon from top

adjust position in line 64 in step 1 code

Post Image height and width

adjust height and width in line 110 in step 3 code

Enjoy...................

Awesome facebook popup Widget for Blogger

2012-04-03T22:55:00.002-07:00

Here is the widget that will help you to increase your facebook fans .This facebook popup widget is a jquery plugin.as facebook social widget is widely used so way2bloggerz brings it for your blogg to increase facebook fans to your page.this widget appear to a new visitor once in 15 days you can also customize it

View Demo

STEPS
1.Go to your blogger dashboard
2.Now go to Layout and select add a gadget and choose HTML/javascript
3.Now copy the code given below and edit your facebook username and then paste it inside the content box of Html/javascript

<style>
#colorbox, #cboxOverlay, #cboxWrapper{position:absolute; top:0; left:0; z-index:9999; overflow:hidden;}
#cboxOverlay{position:fixed; width:100%; height:100%;}
#cboxMiddleLeft, #cboxBottomLeft{clear:left;}
#cboxContent{position:relative;}
#cboxLoadedContent{overflow:auto;}
#cboxTitle{margin:0;}
#cboxLoadingOverlay, #cboxLoadingGraphic{position:absolute; top:0; left:0; width:100%; height:100%;}
#cboxPrevious, #cboxNext, #cboxClose, #cboxSlideshow{cursor:pointer;}
.cboxPhoto{float:left; margin:auto; border:0; display:block;}
.cboxIframe{width:100%; height:100%; display:block; border:0;}

#cboxOverlay{background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEibD4QgLmygGNZYwv-ZQIEeF2eZuTfmmP4RvhCJr0WmndA_q8lmzgosauc4YxFEaxYfA3tVadT82x_LCcK2B5nBp2cgR75d_6nTs1X4Qt6r84Phg5cxwFAX75oiAsY5T9ssV-SbUH6ixKBw/s1600/overlay.png) repeat 0 0;}
#colorbox{}
    #cboxTopLeft{width:21px; height:21px; background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEi9iK8paP2EhNaQiJIo1ZgojJRKmCw87OhRK7szxfksH1BAUSrKaiotYMm36h4rH8EU8fV_QGQIthZaHYtyGh6TAJUdNGc0hIrTgJHTLCEMCam4-B6pLMkDxjGlwRCjXnfB8VYQ4U5srWse/s1600/controls.png) no-repeat -101px 0;}
    #cboxTopRight{width:21px; height:21px; background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEi9iK8paP2EhNaQiJIo1ZgojJRKmCw87OhRK7szxfksH1BAUSrKaiotYMm36h4rH8EU8fV_QGQIthZaHYtyGh6TAJUdNGc0hIrTgJHTLCEMCam4-B6pLMkDxjGlwRCjXnfB8VYQ4U5srWse/s1600/controls.png) no-repeat -130px 0;}
    #cboxBottomLeft{width:21px; height:21px; background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEi9iK8paP2EhNaQiJIo1ZgojJRKmCw87OhRK7szxfksH1BAUSrKaiotYMm36h4rH8EU8fV_QGQIthZaHYtyGh6TAJUdNGc0hIrTgJHTLCEMCam4-B6pLMkDxjGlwRCjXnfB8VYQ4U5srWse/s1600/controls.png) no-repeat -101px -29px;}
    #cboxBottomRight{width:21px; height:21px; background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEi9iK8paP2EhNaQiJIo1ZgojJRKmCw87OhRK7szxfksH1BAUSrKaiotYMm36h4rH8EU8fV_QGQIthZaHYtyGh6TAJUdNGc0hIrTgJHTLCEMCam4-B6pLMkDxjGlwRCjXnfB8VYQ4U5srWse/s1600/controls.png) no-repeat -130px -29px;}
    #cboxMiddleLeft{width:21px; background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEi9iK8paP2EhNaQiJIo1ZgojJRKmCw87OhRK7szxfksH1BAUSrKaiotYMm36h4rH8EU8fV_QGQIthZaHYtyGh6TAJUdNGc0hIrTgJHTLCEMCam4-B6pLMkDxjGlwRCjXnfB8VYQ4U5srWse/s1600/controls.png) left top repeat-y;}
    #cboxMiddleRight{width:21px; background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEi9iK8paP2EhNaQiJIo1ZgojJRKmCw87OhRK7szxfksH1BAUSrKaiotYMm36h4rH8EU8fV_QGQIthZaHYtyGh6TAJUdNGc0hIrTgJHTLCEMCam4-B6pLMkDxjGlwRCjXnfB8VYQ4U5srWse/s1600/controls.png) right top repeat-y;}
    #cboxTopCenter{height:21px; background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhfARk5eXFqZIS_WkrLiML2tUUd4Kzdn1ncpifth6PMT2rOMySDOirG7XV-r6si_wW5hvhTx-IuUxcX5LqHmZOz1wOC2i08HRhGbIm-3ro8eIS0Lq9jAAVbV9AuiEel_CjZhn-GtdyxTPP_/s1600/border.png) 0 0 repeat-x;}
    #cboxBottomCenter{height:21px; background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhfARk5eXFqZIS_WkrLiML2tUUd4Kzdn1ncpifth6PMT2rOMySDOirG7XV-r6si_wW5hvhTx-IuUxcX5LqHmZOz1wOC2i08HRhGbIm-3ro8eIS0Lq9jAAVbV9AuiEel_CjZhn-GtdyxTPP_/s1600/border.png) 0 -29px repeat-x;}
    #cboxContent{background:#fff; overflow:hidden;}
        .cboxIframe{background:#fff;}
        #cboxError{padding:50px; border:1px solid #ccc;}
        #cboxLoadedContent{margin-bottom:28px;}
        #cboxTitle{position:absolute; bottom:4px; left:0; text-align:center; width:100%; color:#949494;}
        #cboxCurrent{position:absolute; bottom:4px; left:58px; color:#949494;}
        #cboxSlideshow{position:absolute; bottom:4px; right:30px; color:#0092ef;}
        #cboxPrevious{position:absolute; bottom:0; left:0; background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEi9iK8paP2EhNaQiJIo1ZgojJRKmCw87OhRK7szxfksH1BAUSrKaiotYMm36h4rH8EU8fV_QGQIthZaHYtyGh6TAJUdNGc0hIrTgJHTLCEMCam4-B6pLMkDxjGlwRCjXnfB8VYQ4U5srWse/s1600/controls.png) no-repeat -75px 0; width:25px; height:25px; text-indent:-9999px;}
        #cboxPrevious:hover{background-position:-75px -25px;}
        #cboxNext{position:absolute; bottom:0; left:27px; background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEi9iK8paP2EhNaQiJIo1ZgojJRKmCw87OhRK7szxfksH1BAUSrKaiotYMm36h4rH8EU8fV_QGQIthZaHYtyGh6TAJUdNGc0hIrTgJHTLCEMCam4-B6pLMkDxjGlwRCjXnfB8VYQ4U5srWse/s1600/controls.png) no-repeat -50px 0; width:25px; height:25px; text-indent:-9999px;}
        #cboxNext:hover{background-position:-50px -25px;}
        #cboxLoadingOverlay{background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhgOnuWeBa01JAaSEdG6nsgO41WCtDkv-gISF7kNpZkEJcFMAli7vjyK3lmMr4LbBEtWeR6Hf0Q-JDwmqJdMSt-VGcHm2ani-49ILb1vIXMW_aQR0-87esINkluWwzU5eK3X567TvjwjNt-/h120/loading.gif) no-repeat center center;}
        #cboxLoadingGraphic{background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhgOnuWeBa01JAaSEdG6nsgO41WCtDkv-gISF7kNpZkEJcFMAli7vjyK3lmMr4LbBEtWeR6Hf0Q-JDwmqJdMSt-VGcHm2ani-49ILb1vIXMW_aQR0-87esINkluWwzU5eK3X567TvjwjNt-/h120/loading.gif) no-repeat center center;}
        #cboxClose{position:absolute; bottom:0; right:0; background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEi9iK8paP2EhNaQiJIo1ZgojJRKmCw87OhRK7szxfksH1BAUSrKaiotYMm36h4rH8EU8fV_QGQIthZaHYtyGh6TAJUdNGc0hIrTgJHTLCEMCam4-B6pLMkDxjGlwRCjXnfB8VYQ4U5srWse/s1600/controls.png) no-repeat -25px 0; width:25px; height:25px; text-indent:-9999px;}
        #cboxClose:hover{background-position:-25px -25px;}

.cboxIE #cboxTopLeft,
.cboxIE #cboxTopCenter,
.cboxIE #cboxTopRight,
.cboxIE #cboxBottomLeft,
.cboxIE #cboxBottomCenter,
.cboxIE #cboxBottomRight,
.cboxIE #cboxMiddleLeft,
.cboxIE #cboxMiddleRight {
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr=#00FFFFFF,endColorstr=#00FFFFFF);
}
.cboxIE6 #cboxTopLeft{background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiYO2glSu9t7nDzr8EV8cHnxZgv1hdIp_cAoYn6hmqxifJvEjrqM2ij_3D2Nw1PcOIFXOug9VMrYnSS6kwRo1r_3T6XTsa6M96HNcgbHglSbX3QPgiK5Ll-fHj3WLAiQKMrOEk4b6oPoLHi/s1600/borderTopLeft.png);}
.cboxIE6 #cboxTopCenter{background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjRFKLceCzWIXwdhGyEOVGnSv-D35Is1LU6cOkyrDadPQ28J0vFxXJluk4lc4OFLPs4sigRY6RuTxbeFLLsB1b1do8gGI_kNeAuuM8TlEN__hTcAPuQN3wVHfOLfeQFJzXwE7aDqbQgO8GZ/s1600/borderTopCenter.png);}
.cboxIE6 #cboxTopRight{background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgVKUbxyqfSfxczw0HcfYPhbHr17Nn5zcaJOFSBict3HwPjnHAUpLZs7goS0oAeZZpfCdDPw1FDXe_JvYkOiSbuszqN_c1p5qbX-f35K4n9izCnBkWbvmlRZU8DyVJ_HP8pHa3WhXDd3lBS/s1600/borderTopRight.png);}
.cboxIE6 #cboxBottomLeft{background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgVKUbxyqfSfxczw0HcfYPhbHr17Nn5zcaJOFSBict3HwPjnHAUpLZs7goS0oAeZZpfCdDPw1FDXe_JvYkOiSbuszqN_c1p5qbX-f35K4n9izCnBkWbvmlRZU8DyVJ_HP8pHa3WhXDd3lBS/s1600/borderTopRight.png);}
.cboxIE6 #cboxBottomCenter{background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiZiFceXG8yBiaU_94oUV637oVmA6ljXC_ohJnmL5Hs7JK5n6prKEpw31nbHuuT5f1z_Fd477AnbKtJC6oftERj2t4AN2_9HfaAjJngrYW4s-C4voHBbv5mzvuTsh-SHxw5HJuMlyZYo2up/s1600/borderBottomCenter.png);}
.cboxIE6 #cboxBottomRight{background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEj-2XWT2b12CB6MqBRJbGb-Exm3UBjQKKKwpB2hhqucaIkJ1fbZwrcVOcU8fpW__1glgvmpVpT9H1fOA3-ywUq0jVVtPy0PuZxAJap5kIIviWbZrphtI6h73XI_MTqav1R7b_P2iGLl95hl/s1600/borderBottomRight.png);}
.cboxIE6 #cboxMiddleLeft{background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEguwcV4KfuCBPetGcKuf-S270aT4r33zjLSt29KDrn4euL7x8ktslR6brGFKfcyBKp853Gcj1NeeVY1BoL9p_-Vo5OTyU2WLJccw_xocR_PSKidapYqdcv73O-fNaKM5Gj1BxBT-DJR3Fdc/s1600/borderMiddleLeft.png);}
.cboxIE6 #cboxMiddleRight{background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjiSz9tdrTgEj9YkxjQ_BYPz4Otz1EGpnqn9mJPALr-kWiQPZGkjuJ28h3z3An5Qr6VOzbOsE8MB0azX7B5HZAY3JR6nSps7ZhBkcx2WS-ptg4afUltc7-ZCLR295XBmi1HqImOaFPMkE51/s1600/borderMiddleRight.png);}

.cboxIE6 #cboxTopLeft,
.cboxIE6 #cboxTopCenter,
.cboxIE6 #cboxTopRight,
.cboxIE6 #cboxBottomLeft,
.cboxIE6 #cboxBottomCenter,
.cboxIE6 #cboxBottomRight,
.cboxIE6 #cboxMiddleLeft,
.cboxIE6 #cboxMiddleRight {
    _behavior: expression(this.src = this.src ? this.src : this.currentStyle.backgroundImage.split('"')[1], this.style.background = "none", this.style.filter = "progid:DXImageTransform.Microsoft.AlphaImageLoader(src=" + this.src + ", sizingMethod='scale')");
}

/*-----------------------------------------------------------------------------------*/
/* Facebook Likebox popup For Blogger
/*-----------------------------------------------------------------------------------*/
#subscribe {
font: 12px/1.2 Arial,Helvetica,san-serif; color:#666;
}
#subscribe a,
#subscribe a:hover,
#subscribe a:visited {
text-decoration:none;
}

.box-tagline {
color: #999;
margin: 0;
text-align: center;
}
#subs-container {
padding: 35px 0 30px 0;
position: relative;
}
a:link, a:visited {
border:none;
}
.demo {
display:none;
}
</style>

<script src='http://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js'></script>
<script src="http://yourjavascript.com/11215013191/jquery.colorbox-min.js"></script>
<script type="text/javascript">
jQuery(document).ready(function(){
if (document.cookie.indexOf('visited=true') == -1) {
var fifteenDays = 1000*60*60*24*15;
var expires = new Date((new Date()).valueOf() + fifteenDays);
document.cookie = "visited=true;expires=" + expires.toUTCString();
$.colorbox({width:"400px", inline:true, href:"#subscribe"});
}
});
</script>
<!-- This contains the hidden content for inline calls -->

<div style='display:none'>
<div id='subscribe' style='padding:10px; background:#fff;'>
<center><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiY6aKKM6qsS0lrFX8xOe45cXVKcBBHwTu0qhUch03LrmLvAxNqnaC0i5cOY_-3PFqpgjBc6JcE8dqUvBEVjLvTGxjg-KQhY50jSgp1_jxUnNUTE-uOLMJ5Sp0bX3WnORvwjNVdFYca67bE/s1600/joinusonfacebook.png" width:300px; height:150px;"/></center>
<center>

<iframe src="//www.facebook.com/plugins/likebox.php?href=http%3A%2F%2Fwww.facebook.com%2Fway2bloggerz&amp;width=300&amp;colorscheme=light&amp;show_faces=true&amp;border_color=%23ffffff&amp;stream=false&amp;header=false&amp;height=258" scrolling="no" frameborder="0" style="border:none; overflow:hidden; width:300px; height:258px;" allowtransparency="true"></iframe></center>
<p style=" float:right; margin-right:45px; font-size:4px;" ><a style=" font-size:10px; color:#3B78CD; text-decoration:none;" href="http://way2bloggerz.blogspot.in/">Get This Widgets »</a> </p>
</div>
</div>

Important Customizations
facebook page Username
change way2bloggerz in line 117 with your facebook page username
cookie refresh time
cookie refresh time is set to 15 days that means this widget appears for the same visitor once in 15 days you can change it by changing value 15 in line 103 as you want

How to customize Read more in Blogg

2012-03-29T01:55:00.000-07:00

If you are not want to go with your read more provided by blogger here way2bloggerz giving you 6 different style to customize your read more only you have to follow few simple steps

STEPS
1.Go to your blogger dashboard-->Now click on Templet and then Edit HTML
2.Now click on proceed
3.Now press CTRL+F and find ]]></b:skin>
4.Now chosse a style from below and place its code above ]]></b:skin>

STYLE 1

.jump-link { margin: 15px 0; }
.jump-link a {
-moz-box-shadow:inset 0px 1px 0px 0px #ffffff;
 -webkit-box-shadow:inset 0px 1px 0px 0px #ffffff;
 box-shadow:inset 0px 1px 0px 0px #ffffff;
 background:-webkit-gradient( linear, left top, left bottom, color-stop(0.05, #ededed), color-stop(1, #dfdfdf) );
 background:-moz-linear-gradient( center top, #ededed 5%, #dfdfdf 100% );
 filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#ededed', endColorstr='#dfdfdf');
 background-color:#ededed;
 -moz-border-radius:6px;
 -webkit-border-radius:6px;
 border-radius:6px;
 border:1px solid #dcdcdc;
 display:inline-block;
 color:#777777;
 font-family:arial;
 font-size:16px;
 font-weight:bold;
 padding:5px 12px;
 text-decoration:none;
 text-shadow:1px 1px 0px #ffffff;
}
.jump-link a:hover {
background:-webkit-gradient( linear, left top, left bottom, color-stop(0.05, #dfdfdf), color-stop(1, #ededed) );
 background:-moz-linear-gradient( center top, #dfdfdf 5%, #ededed 100% );
 filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#dfdfdf', endColorstr='#ededed');
 background-color:#dfdfdf;
}

STYLE 2

.jump-link { margin: 15px 0; }
.jump-link a {
 -moz-box-shadow:inset 0px 1px 0px 0px #f29c93;
 -webkit-box-shadow:inset 0px 1px 0px 0px #f29c93;
 box-shadow:inset 0px 1px 0px 0px #f29c93;
 background:-webkit-gradient( linear, left top, left bottom, color-stop(0.05, #fe1a00), color-stop(1, #ce0100) );
 background:-moz-linear-gradient( center top, #fe1a00 5%, #ce0100 100% );
 filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#fe1a00', endColorstr='#ce0100');
 background-color:#fe1a00;
 -moz-border-radius:6px;
 -webkit-border-radius:6px;
 border-radius:6px;
 border:1px solid #d83526;
 display:inline-block;
 color:#ffffff;
 font-family:arial;
 font-size:16px;
 font-weight:bold;
 padding:5px 12px;
 text-decoration:none;
 text-shadow:1px 1px 0px #b23e35;
}.jump-link a:hover {
 background:-webkit-gradient( linear, left top, left bottom, color-stop(0.05, #ce0100), color-stop(1, #fe1a00) );
 background:-moz-linear-gradient( center top, #ce0100 5%, #fe1a00 100% );
 filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#ce0100', endColorstr='#fe1a00');
 background-color:#ce0100;
}

STYLE 3

.jump-link { margin: 15px 0; }
.jump-link a {
 -moz-box-shadow:inset 0px 1px 0px 0px #bbdaf7;
 -webkit-box-shadow:inset 0px 1px 0px 0px #bbdaf7;
 box-shadow:inset 0px 1px 0px 0px #bbdaf7;
 background:-webkit-gradient( linear, left top, left bottom, color-stop(0.05, #79bbff), color-stop(1, #378de5) );
 background:-moz-linear-gradient( center top, #79bbff 5%, #378de5 100% );
 filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#79bbff', endColorstr='#378de5');
 background-color:#79bbff;
 -moz-border-radius:6px;
 -webkit-border-radius:6px;
 border-radius:6px;
 border:1px solid #84bbf3;
 display:inline-block;
 color:#ffffff;
 font-family:arial;
 font-size:16px;
 font-weight:bold;
 padding:5px 12px;
 text-decoration:none;
 text-shadow:1px 1px 0px #528ecc;
}.jump-link a:hover {
 background:-webkit-gradient( linear, left top, left bottom, color-stop(0.05, #378de5), color-stop(1, #79bbff) );
 background:-moz-linear-gradient( center top, #378de5 5%, #79bbff 100% );
 filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#378de5', endColorstr='#79bbff');
 background-color:#378de5;
}

STYLE 4

.jump-link { margin: 15px 0; }
.jump-link a {
 -moz-box-shadow:inset 0px 1px 0px 0px #c1ed9c;
 -webkit-box-shadow:inset 0px 1px 0px 0px #c1ed9c;
 box-shadow:inset 0px 1px 0px 0px #c1ed9c;
 background:-webkit-gradient( linear, left top, left bottom, color-stop(0.05, #9dce2c), color-stop(1, #8cb82b) );
 background:-moz-linear-gradient( center top, #9dce2c 5%, #8cb82b 100% );
 filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#9dce2c', endColorstr='#8cb82b');
 background-color:#9dce2c;
 -moz-border-radius:6px;
 -webkit-border-radius:6px;
 border-radius:6px;
 border:1px solid #83c41a;
 display:inline-block;
 color:#ffffff;
 font-family:arial;
 font-size:16px;
 font-weight:bold;
 padding:5px 12px;
 text-decoration:none;
 text-shadow:1px 1px 0px #689324;
}.jump-link a:hover {
 background:-webkit-gradient( linear, left top, left bottom, color-stop(0.05, #8cb82b), color-stop(1, #9dce2c) );
 background:-moz-linear-gradient( center top, #8cb82b 5%, #9dce2c 100% );
 filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#8cb82b', endColorstr='#9dce2c');
 background-color:#8cb82b;
}

STYLE 5

.jump-link { margin: 15px 0; }
.jump-link a {
 -moz-box-shadow:inset 0px 1px 0px 0px #fbafe3;
 -webkit-box-shadow:inset 0px 1px 0px 0px #fbafe3;
 box-shadow:inset 0px 1px 0px 0px #fbafe3;
 background:-webkit-gradient( linear, left top, left bottom, color-stop(0.05, #ff5bb0), color-stop(1, #ef027d) );
 background:-moz-linear-gradient( center top, #ff5bb0 5%, #ef027d 100% );
 filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#ff5bb0', endColorstr='#ef027d');
 background-color:#ff5bb0;
 -moz-border-radius:6px;
 -webkit-border-radius:6px;
 border-radius:6px;
 border:1px solid #ee1eb5;
 display:inline-block;
 color:#ffffff;
 font-family:arial;
 font-size:16px;
 font-weight:bold;
 padding:5px 12px;
 text-decoration:none;
 text-shadow:1px 1px 0px #c70067;
}.jump-link a:hover {
 background:-webkit-gradient( linear, left top, left bottom, color-stop(0.05, #ef027d), color-stop(1, #ff5bb0) );
 background:-moz-linear-gradient( center top, #ef027d 5%, #ff5bb0 100% );
 filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#ef027d', endColorstr='#ff5bb0');
 background-color:#ef027d;
}

STYLE 6

.jump-link { margin: 15px 0; }
.jump-link a {
 -moz-box-shadow:inset 0px 1px 0px 0px #fed897;
 -webkit-box-shadow:inset 0px 1px 0px 0px #fed897;
 box-shadow:inset 0px 1px 0px 0px #fed897;
 background:-webkit-gradient( linear, left top, left bottom, color-stop(0.05, #f6b33d), color-stop(1, #d29105) );
 background:-moz-linear-gradient( center top, #f6b33d 5%, #d29105 100% );
 filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#f6b33d', endColorstr='#d29105');
 background-color:#f6b33d;
 -moz-border-radius:6px;
 -webkit-border-radius:6px;
 border-radius:6px;
 border:1px solid #eda933;
 display:inline-block;
 color:#ffffff;
 font-family:arial;
 font-size:16px;
 font-weight:bold;
 padding:5px 12px;
 text-decoration:none;
 text-shadow:1px 1px 0px #cd8a15;
}.jump-link a:hover {
 background:-webkit-gradient( linear, left top, left bottom, color-stop(0.05, #d29105), color-stop(1, #f6b33d) );
 background:-moz-linear-gradient( center top, #d29105 5%, #f6b33d 100% );
 filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#d29105', endColorstr='#f6b33d');
 background-color:#d29105;
}

5.Now click on Save Templet

ENJOY!

How to add follow by Email Popout to your Blogg

2012-03-28T09:29:00.001-07:00

Follow by email is a cool widget it is already given in gadget list of your blogger but here you can use it as a pop out for your blog it is given here as a widget so you don't have to edit your blogg CSS code.you have to follow some simple steps to add this widget to your blogg

D E M O

STEPS

1.Go to your blogg dashboard-->Now go to layout

2.Now click on add a gadget and chosse HTML/Javascript

3.Now paste the below code in content Box

4.You have to edit some texts in the below code which given after the code

<style type="text/css">
/*<![CDATA[*/
 #w2bzfollowSubscribe {background-color: #464646;width: 220px;color: #fff;position: fixed;z-index: 999999;right: 10px;bottom: 0;}
 .followOpened {-webkit-border-radius: 2px 0 0;-moz-border-radius: 2px 0 0;border-radius: 2px 0 0;-webkit-box-shadow: 0 0 8px rgba(0, 0, 0, 0.5);-moz-box-shadow: 0 0 8px rgba(0, 0, 0, 0.5);box-shadow: 0 0 8px rgba(0, 0, 0, 0.5);}
 .w2bzfollowButton {background: #464646;color: #CCC !important;font-size: 13px;line-height: 28px;padding: 0 10px;text-decoration: none;position: absolute;top: -28px;right: 0;display: block;-webkit-box-shadow: 0 -1px 5px rgba(0, 0, 0, 0.2);-moz-box-shadow: 0 -1px 5px rgba(0, 0, 0, 0.2);box-shadow: 0 -1px 5px rgba(0, 0, 0, 0.2);-webkit-border-radius: 2px 2px 0 0;-moz-border-radius: 2px 2px 0 0;border-radius: 2px 2px 0 0;height: 28px;}
 .w2bzfollowButton span {background: url("https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjUhy-eLRcRsCmr8WcBK76Lcg3UulS8rSrfxWTKwY8-zV3Zaw4sl0LJOsPr2Lr2GKaIxtfZzmGl4b1wSKuEEOaYRxlRxbe0yddpj4jfkS0DO27s_Tv6ycxVA1Z3A7j5Zqu7rlUzg4-9zIw/h120/way2bloggerz.png") no-repeat scroll 0 3px transparent;padding-left: 15px;}
 .w2bzfollowButton:hover,.followActive {color: #fff !important;}
 .w2bzfollowButton:hover span,.followActive span {background-position: 0 -37px !important;}
 .followactive {background-color: #333;}
 .w2bzfollowForm {padding: 15px;}
 .w2bzfollowForm h3 {font-size: 18px;margin: 0 0 10px;font-weight: normal;}
 .w2bzfollowForm p {margin: 0 0 10px;}
 .w2bzfollowForm .emailInput {width: 95%;padding: 2px 4px;margin: 0 auto;-webkit-border-radius: 3px;-moz-border-radius: 3px;border-radius: 3px;font-size: 15px;border: 1px solid #444;color: #888;display: block;clear: both;}
 .w2bzfollowForm form {text-align: center;}
 .w2bzfollowForm .emailInput:focus {color: #000;border-color: #000;}
 .w2bzfollowForm .emailSubmit {cursor:pointer;padding: 2px 20px;background: #333;background: -webkit-linear-gradient(top, #333 0%, #111 100%);background: -moz-linear-gradient(top, #333 0%, #111 100%);background: -o-linear-gradient(top, #333 0%, #111 100%);background: -ms-linear-gradient(top, #333 0%, #111 100%);background: linear-gradient(top, #333 0%, #111 100%);color: #ccc;text-shadow: 0 1px 0 #000;border: 1px solid #282828;-webkit-border-radius: 11px;-moz-border-radius: 11px;border-radius: 11px;-webkit-box-shadow: inset 0 1px 0 #444;-moz-box-shadow: inset 0 1px 0 #444;box-shadow: inset 0 1px 0 #444;text-decoration: none;-webkit-transition: all 0.25s ease-in-out;-moz-transition: all 0.25s ease-in-out;-o-transition: all 0.25s ease-in-out;-ms-transition: all 0.25s ease-in-out;transition: all 0.25s ease-in-out;margin: 1em 0 1em 0;}
 .emailSubmit:hover {background: #222;background: -webkit-linear-gradient(top, #333 0%, #222 100%);background: -moz-linear-gradient(top, #333 0%, #222 100%);background: -o-linear-gradient(top, #333 0%, #222 100%);background: -ms-linear-gradient(top, #333 0%, #222 100%);background: linear-gradient(top, #333 0%, #222 100%);color: #fff;-webkit-box-shadow: inset 0 1px 0 #4f4f4f;-moz-box-shadow: inset 0 1px 0 #4f4f4f;box-shadow: inset 0 1px 0 #4f4f4f;text-decoration: none;}
 .emailSubmit:active {background: #111;background: -webkit-linear-gradient(top, #111 0%, #222 100%);background: -moz-linear-gradient(top, #111 0%, #222 100%);background: -o-linear-gradient(top, #111 0%, #222 100%);background: -ms-linear-gradient(top, #111 0%, #222 100%);background: linear-gradient(top, #111 0%, #222 100%);color: #aaa;-webkit-box-shadow: inset 0 -1px 0 #333;-moz-box-shadow: inset 0 -1px 0 #333;box-shadow: inset 0 -1px 0 #333;text-decoration: none;}
 .w2bzFollowFooter {text-align: center;font: normal 11px "Helvetica Neue", sans-serif;padding: 7px 0;margin: 0 0 -15px !important;border-top: 1px solid #3c3c3c;}
 .w2bzFollowFooter a {color: #aaa;text-shadow: 0 1px 0 #262626;background: none;text-decoration: none;}
 .w2bzFollowFooter a:hover {color: #fff;background: none;}
/*]]>*/
</style>
<script type="text/javascript">
/*<![CDATA[*/
;(function(w2bz){w2bz(document).ready(function(){w2bz.extend(w2bz.easing,{easeOutCubic:function(x,t,b,c,d){return c*((t=t/d-1)*t*t+1)+b}});var followBox=w2bz("#w2bzfollowSubscribe");var followHeight="-"+followBox.outerHeight()+"px";followBox.hide().css({bottom:"-500px"});setTimeout(function(){followBox.show().animate({bottom:followHeight})},500);w2bz(".w2bzfollowButton").click(function(e){if(followBox.hasClass("followOpened")){w2bz(this).removeClass("followActive");followBox.removeClass("followOpened").stop().animate({bottom:followHeight},{duration:300,easing:"easeOutCubic"})}else{w2bz(this).addClass("followActive");followBox.addClass("followOpened").stop().animate({bottom:"0"},{duration:500,easing:"easeOutCubic"})}e.preventDefault()})})})(jQuery);
/*]]>*/
</script>
<div id="w2bzfollowSubscribe" style="display:none;">
 <div class="w2bzfollowForm">
  <a class="w2bzfollowButton" href="#" title="Follow"><span>Follow</span></a>
  <h3>Follow "Way2Bloggerz"</h3>
  <p>Be the first to know updates SUBSCRIBE today!</p>
  <form action="http://feedburner.google.com/fb/a/mailverify" method="post" target="popupwindow" onsubmit="window.open('http://feedburner.google.com/fb/a/mailverify?uri=ItsAllAboutBlogging', 'popupwindow', 'scrollbars=yes,width=550,height=520');return true">
   <input type="text" class="emailInput" name="email" placeholder="Enter Your Email..."/>
   <input type="hidden" value="ItsAllAboutBlogging" name="uri"/>
   <input type="hidden" name="loc" value="en_US"/>
   <input type="submit" value="Subscribe" class="emailSubmit"/>
  </form>
  <p class="w2bzFollowFooter">
   <a href="http://feedburner.google.com" target="_blank">Delivered by FeedBurner</a>
  </p>
 </div>
</div>

DON'T FORGET TO CHANGE
1.Header of widget
change WaytoBloggerz in line 32 with your header title for widget
2.Description of widget
change Be the first to know updates SUBSCRIBE today! in line 33 according to you
3.Feedburner url
change ItsAllAboutBlogging in line 34 and line 36 with your feedburner url address
if you dont know your feedburner url then go to add a gadget and click follow by email widget their you find feedburner url

ENJOY!

Add Smooth go to top to Blogger

2012-03-27T00:06:00.000-07:00

Go to top/Scroll to top for blogger, this is another cool widget that can be used for blogger as well as for websites you have to follow some simple steps to add this widget to your blogg you can place anywhere at the bottom of your blogg according to your interest and your blogg

STEPS
1.Go to your blogger dashboard-->Now go to templet
2.click on the edit HTML and then proceed
3.Now press CTRL+F and find </body>
4.Copy the code given below and paste it before </body>

<<style type='text/css'>
#w2bz-StoTop {-moz-border-radius: 5px;-webkit-border-radius: 5px;border-radius: 5px; width:60px;background-color: #EEEEEE;background-color: rgba(238, 238, 238, 0.6);filter: progid:DXImageTransform.Microsoft.gradient(startColorStr=&#39;#99EEEEEE&#39;,EndColorStr=&#39;#99EEEEEE&#39;);text-align:center;padding:5px;position:fixed;bottom:10px;right:10px;cursor:pointer;color:#444;text-decoration:none;border:1px solid #C9C9C9;}
</style>
<script src='https://ajax.googleapis.com/ajax/libs/jquery/1.5.1/jquery.min.js' type='text/javascript'/>
<script type='text/javascript'>
$(function() {
    $.fn.scrollToTop = function() {
    $(this).hide().removeAttr(&quot;href&quot;);
    if ($(window).scrollTop() != &quot;0&quot;) {
        $(this).fadeIn(&quot;slow&quot;)
    }
    var scrollDiv = $(this);
    $(window).scroll(function() {
        if ($(window).scrollTop() == &quot;0&quot;) {
        $(scrollDiv).fadeOut(&quot;slow&quot;)
        } else {
        $(scrollDiv).fadeIn(&quot;slow&quot;)
        }
    });
    $(this).click(function() {
        $(&quot;html, body&quot;).animate({
        scrollTop: 0
        }, &quot;slow&quot;)
    })
    }
});
$(function() {
    $(&quot;#w2bz-StoTop&quot;).scrollToTop();
});
</script>
<a href='#' id='w2bz-StoTop' style='display:none;'><img src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgTTPyJSb3BLdidIDm3hfCmtwtTk4k2Eoic71Bkh_YNaG08NZQ4f7Iop1tYo1VoyL0vHwl_OYQ8pN-K4NS2UhAfAsDbFbDux_r54xNA_tcjGOQQFlpESklrh0Bx-9hDc9GPmaLTr0BT86I/h120/top.png'/></a>

Position adjustment

you can change the position from right to left by editing right:10px given in 2 line
if you want it to left of your blogg window edit right with left

How to add floating social media sharing buttons to blogg(Video)

2012-03-21T02:21:00.002-07:00

Today Social media buttons play a major role in sharing your posts that are published in your blogg and helps in increasing traffic to your blogg.But here way2bloggerz give social media sharing buttons for your blogg in a different style when you add this widget to your blogg it will float in the left of your blog you can easily edit its position according to your blogg

Its a widget so you dont have to edit your blogg CSS code simply add the below given code to your HTML/javascript

Steps for adding floating social media sharing buttons to your blogg

1. Go to your blogger dashboard
2. Now click on the layout and now add a gadget
3. Chosse gadget HTML/Javascript
4. Now leave title blank and copy the below given code and paste it into content box

<style type="text/css">
#pageshare {position:fixed; bottom:15%; margin-left:-71px; float:left; border-radius:5px;-moz-border-radius:5px;-webkit-border-radius:5px;background-color:#fff;padding:0 0 2px 0;z-index:10;}
#pageshare .sbutton {float:left;clear:both;margin:5px 5px 0 5px;}
.fb_share_count_top {width:48px !important;}
.fb_share_count_top, .fb_share_count_inner {-moz-border-radius:3px;-webkit-border-radius:3px;}
.FBConnectButton_Small, .FBConnectButton_RTL_Small {width:49px !important; -moz-border-radius:3px;/*bs-fsmsb*/-webkit-border-radius:3px;}
.FBConnectButton_Small .FBConnectButton_Text {padding:2px 2px 3px !important;-moz-border-radius:3px;-webkit-border-radius:3px;font-size:8px;}
</style>
<div id='pageshare' title="Get this from BloggerSentral.com">
<div class='sbutton' id='fb'>
<a name="fb_share" type="box_count" href="http://www.facebook.com/sharer.php">Share</a><script src="http://static.ak.fbcdn.net/connect.php/js/FB.Share" type="text/javascript"></script>
</div>
<div class='sbutton' id='rt'>
<script src="http://tweetmeme.com/i/scripts/button.js" type='text/javascript'></script>
</div>
<div class='sbutton' id='su'>
<script src="http://www.stumbleupon.com/hostedbadge.php?s=5"></script>
</div>
<div class='sbutton' id='digg' style='margin-left:3px;width:48px'>
<script src='http://widgets.digg.com/buttons.js' type='text/javascript'></script>
<a class="DiggThisButton DiggMedium"></a>
</div>
<div class='sbutton' id='gplusone'>
<script type="text/javascript" src="https://apis.google.com/js/plusone.js"></script>
<g:plusone size="tall"></g:plusone>
</div>
<div style="clear: both;font-size: 9px;text-align:center;">Get <a href="http://way2bloggerz.blogspot.in/">widget</a></div>
</div>

5. Now place the gadget below the post section if you want to put your sharing buttons left of your browsing window

Customizing position of Sharing Buttons
Vertical alignment
Change the value of bottom in code line 2. The code positions the button relative to the bottom of your browser window. To fix the distance even when window is resized, specify the value in px (pixels) instead of %.

Horizontal alignment
Change the value of margin-left in code line 2. Negative value pushes the button to the left of the main blog column, positive value pushes it to the right.
To position the button relative to the left or right edge of browser window, replace the margin-left with left (as in left:10px;) or right (as in right:10px;) respectively.

Replacing and removing buttons
You can replace existing buttons with your own. Each button is represented by this code:

<div class='sbutton'>
BUTTON CODE
</div>

Enjoy............

                  V I D E O

How to start posting adding images and videos to your blogg

2012-03-19T04:22:00.001-07:00

When you are newer to blogg you didn't know much about blogging so here way2bloggerz make it simple for you how to start a post and how you can add images and videos to your blogg.In this post we are giving you video tutorial also first we will explain you by following simple steps

STEPS
1. Go to your blogger dashbord
2. click on the

button which is at left upper corner to your blogg

3.Give a Title to your post now start description of your post their are various tools given above the description box you can use these tools for editing and adding something to your post

HTML-->if you have some knowledge of html you can edit your post html code also
Two curved arrow--> if you deleted something in your post you can undo and redo by using these arrows
F Sighn--> you can change your font style by using this tool
Double T sighn--> you can change your font size by using this tool
B--> this tool is used to bold somee text
I--> this is used for giving italic look to your text
U--> this is used to underline the text
ABC --> this is used to make line on the taxt as you are seeing

IMPORTANT TOOLS
link tool--> used to link some text
Image tool--> used to add images to your post
Video tool--> used to add video to your post you can add videos from youtube also

HOW TO LINK SOME TEXT
first select the word you want to link then click on the link tool and now give the link address

HOW TO ADD IMAGE TO POST
clck on the image button and you will see this

if you want to upload image from your computer then click on chosse file and then select your image now image will appear in your post and you can edit its position and size and also link it to some address

HOW TO ADD VIDEO TO YOUR POST
click on the video button and you will see this

you can upload image from your computer and also from youtube

V I D E O

How to add fancy menu to blogg

2012-03-19T00:16:00.001-07:00

Their are many ways to enhance the look of your blogg.one of the most important part of your blogg is your menu bar it plays an important part in enhancing the look of your blogg here way2bloggerz giving you a menu bar which can be added to your blogg by taking simple steps

PREVIEW

Steps

1. backup your templet before making any change to your css code
2. Now go to layout-->add a gadget -->chosse HTML/Javascript leave title blank now paste the below code in it

<div>

<ul id="w2bz">
<li><a href="#" >Home</a></li>
<li><a href="#" >Way2bloggerz</a></li>
<li><a href="#" >Contact</a></li>
<li><a href="#" >Blogg</a></li>
<li><a href="#" >Links</a></li>
</ul>
</div>

NOTE::
Replace '#' with your link url
you can add more tabs by adding <li><a href="#">tab name</a></li> before </ul> in line 9

3. Now go to Templet -->Edit HTML

and find the code

]]></bskin>

Now paste the code given below before ]]></bskin>

ul#w2bz
{
 margin:0;
 padding:0;
 list-style-type:none;
 width:auto;
 position:relative;
 display:block;
 height:36px;
 font-size:12px;
 font-weight:bold;
 text-transform:lowercase;
 background:transparent url("https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiE_uDzRfoupl8fd_5b5RgnJTm95JprZMN_FhAcYFrWLu4uTir19-XVhAHHf1FKGSh9O3YCHpmxux_QHXkjQyqHxCdNQMnDN_dti6gDAuZh6mKMi0P7UO5mfT9xjnn1DqJm4B7pkPeR-IE/h120/bg.jpg") repeat-x top left;
 font-family:"Trebuchet MS",Helvetica,Arial,Verdana,sans-serif;
 border-bottom:1px solid #000000;
 border-top:1px solid #000000;
}

ul#w2bz li
{
 display:block;
 float:left;
 margin:0;
 pading:0;
}
 
ul#w2bz li a
{
 display:block;
 float:left;
 color:#999999;
 text-decoration:none;
 font-weight:bold;
 padding:12px 20px 0 20px;
 height:24px;

}
 
ul#w2bz li a:hover
{ 
 color:#FFFFFF;
 background:transparent url("https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiLHHgpGop0Kg-6k0TAXYPwT0bbZblJU1I05REWyluVm_Sr91eRtkcg-Tz976JbpRVyGnd3lWkhio-ujJFI1pqMpE3i5vammD8gh8Pbx7ptaElOpsJ6B7MPhD-nS4cJimnSGdFS4aRQba0/h120/over.jpg") no-repeat top right; 
}

4. now find /*tabs and delete the code below it

you are done now

How to add fancy drop down menu to blogg(Video)

2012-03-18T02:06:00.001-07:00

If you are not enjoying with your menu bar given by blogger then you are free to change it .here way2bloggerz giving you detail how you can add a fancy drop down menu to your blogg

PREVIEW

Steps

1. backup your templet before making any change to your css code
2. Now go to layout-->add a gadget -->chosse HTML/Javascript leave title blank now paste the below code in it

<div class="w2bz">
<ul>
<li><a href="#" >Home</a></li>
<li><a href="#" id="current">TAB1</a>
<ul>
<li><a href="#">SUBTAB1.1</a></li>
<li><a href="#">SUBTAB1.2</a></li>
<li><a href="#">SUBTAB1.3</a></li>
<li><a href="#">SUBTAB1.4</a></li>
</ul>
</li>
<li><a href="#">TAB2</a>
<ul>
<li><a href="#">SUBTAB2.1</a></li>
<li><a href="#">SUBTAB2.2</a></li>
<li><a href="#">SUBTAB2.3</a></li>
<li><a href="#">SUBTAB2.4</a></li>
</ul>
</li>
<li><a href="#">Contact</a></li>
</ul>
</div>

NOTE::
Replace '#' with your link url

3. Now go to Templet -->Edit HTML

and find the code

]]></bskin>

Now paste the code given below before ]]></bskin>

.w2bz
{border:none;
 border:0px;
 margin:0px;
 padding:0px;
 font: 67.5% "Lucida Sans Unicode", "Bitstream Vera Sans", "Trebuchet Unicode MS", "Lucida Grande", Verdana, Helvetica, sans-serif;
 font-size:14px;
 font-weight:bold;
 }
.w2bz ul{
 background:#333333;
 height:35px;
 list-style:none;
 margin:0;
 padding:0;
 }
 .w2bz li{
  float:left;
  padding:0px;
  }
 .w2bz li a{
  background:#333333 url("https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEge1x1CUJkZTgm2A8pxaftXAudFxgT6Cd-T5Sepi4hAO7sTIOtuq_5dFX21h_Fnolhu9tZQSxcqk_at9QMARli_2nIIqCVcB6TOqmr-J_XAyiPL3F8MpsmlxCaLi0CPtvHBBXXITc57cY0/h120/seperator.gif") bottom right no-repeat;
  color:#cccccc;
  display:block;
  font-weight:normal;
  line-height:35px;
  margin:0px;
  padding:0px 25px;
  text-align:center;
  text-decoration:none;
  }
  .w2bz li a:hover, .w2bz ul li:hover a{
   background: #2580a2 url("https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEil-1AgYmxsw33q9pGmu36kwuGKa5h71nnrk5jaLla9YH2GYi6VUQXal9Vp4XI7FfaVwYC1ZJjzsDFMPy-WTasE0FSH8zXhHMK66kv6Frt_zCmw3Yqm0nhMk8_8_dIkQgdezqySNQyjvQI/h120/hover.gif") bottom center no-repeat;
   color:#FFFFFF;
   text-decoration:none;
   }
 .w2bz li ul{
  background:#333333;
  display:none;
  height:auto;
  padding:0px;
  margin:0px;
  border:0px;
  position:absolute;
  width:225px;
  z-index:200;
  /*top:1em;
  /*left:0;*/
  }
 .w2bz li:hover ul{
  display:block;
  
  }
 .w2bz li li {
  background:url('https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgoGShJkRpQ7g_dmV3Tf8uT_CFr1jnNjtP5CYdijuAreFeqFF2WBTIz2GFUIkc5et_ijdun1ISE3D2gReyBXFV4UtHzgOkLYjfFfztrXbHCeSy6TDQi6MzYWmnpR8LzMAw4ESQ28Sr-EcY/h120/sub_sep.gif') bottom left no-repeat;
  display:block;
  float:none;
  margin:0px;
  padding:0px;
  width:225px;
  }
 .w2bz li:hover li a{
  background:none;
  
  }
 .w2bz li ul a{
  display:block;
  height:35px;
  font-size:12px;
  font-style:normal;
  margin:0px;
  padding:0px 10px 0px 15px;
  text-align:left;
  }
  .w2bz li ul a:hover, .w2bz li ul li:hover a{
   background:#2580a2 url('https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgFXN_q_4qNsHfGBbw9Rr_H1TlL_D2s-b6nK3sJjT_qOwMprYCZcDWrUYgfuCbRAl-dmNpXg_-jCghMV0ABRiiwVe8-MuiSR_yE1rB5OMhTxnUXP86quJFsev3OGRWg5_yzd-d5j_JZO3U/h120/hover_sub.gif') center left no-repeat;
   border:0px;
   color:#ffffff;
   text-decoration:none;
   }
 .w2bz p{
  clear:left;
  }

4. now find /*tabs and delete the code below it

you are done now

V I D E O

How to change Blogger Templet(Video)

2012-03-17T09:35:00.001-07:00

If you are newer to blogging you don't know much about the blogger when you start a blogg their you select a templet for your blogg.their are various type of templet given by blogger and you can also customize them but if you don't like any one of them you can also change your templet by downloading them from any other website.their are many sites for
blogger templets .So now i am explaining you how you can change your blogger templet in new blogging user interface
Steps To Change Blogger Templet

1. Back up your templet
Go to Templet and click Backup/Restore
now your current templet is changed

2.First download the templet from any Templet site like. Btemplets
3. Now again go to your blogger dashboard click on the setting and then click on Old user Interface

4. Now Click on Design and then Edit HTML .their you see a Chosse file button .
now chosse XML file of templet you just downloaded and click upload and then keep widgets

now your templet has been changed ENJOY.

Not satisfied watch video.

V I D E O

How to Start a Blogg (Video)

2012-03-15T10:59:00.003-07:00

Oh really you want to start a blog it's very easy
I will explain you step by step

you should have a Gmail account if you dont have first create a gmail account

Now go to the addresss www.blogger.com and sign in with your gmail account.

Now click on New Blog .Fill the Title,Address and a Templet given by blogger according to your blogg

Now click on Create Blog.You are ready to blogg now

Enjoy

Not satisfied watch video
V I D E O

Blogger Tips | Tricks | SEO | Widgets - Way2bloggerz

Animated Social Subscribing icons for Blogger

STEPS

CUSTOMIZATION

Awesome Social sharing buttons below blog post

STEP 1

STEP 2

Popular post Widget with Hover effect for Blogger

STEP 1

STEP 2

How to display Post author,Date,Label below post title with icons

How to Customize Post Footer

Mashable social sharing widget for Blogger

How to add Pinterest 'Pin it' Button to blog Post

Awesome Social sharing widget for blog posts

Awesome Link Nudging on links on Hover

Social sharing Buttons for blog Post

New facebook popup widget with subscription box

Sliding facebook popup for blogger

Flash animated label cloud Widget

Awesome jquery featured recent post slider

Awesome facebook popup Widget for Blogger

How to customize Read more in Blogg

How to add follow by Email Popout to your Blogg

Add Smooth go to top to Blogger

How to add floating social media sharing buttons to blogg(Video)

How to start posting adding images and videos to your blogg

How to add fancy menu to blogg

How to add fancy drop down menu to blogg(Video)

How to change Blogger Templet(Video)

How to Start a Blogg (Video)