Showing posts with label high quality widgets. Show all posts
Showing posts with label high quality widgets. Show all posts

Monday, 18 March 2013


Checkout this awesome floating facebook like box widget. If you want to add this widget to your blog just follow this simple steps


1.Go to Design > Page Elements.
2.Click Add A Gadget.
3.In Add A Gadget window, select the HTML/Javascript .
4.Paste the following code inside it


<script type="text/javascript">
/*<![CDATA[*/
jQuery(document).ready(function() {jQuery(".abtlikebox").hover(function() {jQuery(this).stop().animate({right: "0"}, "medium");}, function() {jQuery(this).stop().animate({right: "-250"}, "medium");}, 500);});
/*]]>*/
</script>
<style type="text/css">
.abtlikebox{background: url("https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjzIiZUELsVVvi_9lOjvRq_8S_vXqXbwn8yR514gZvXEsfFy6unXO0ikpSc3XjPT0pB_vHhc2Lo7pxHoq7cVTy2IcmEOfYpdGcoVDYvOV8dh6NDTNmRCzVy3O-N6hQa6swksErm0CarJzc/s320/fb1-right.png") no-repeat scroll left center transparent !important; float: right;height: 270px;padding: 0 5px 0 46px;width: 245px;z-index:  99999;position:fixed;right:-250px;top:20%;}
.abtlikebox div{ padding: 0; margin-right:-8px; border:4px solid  #3b5998; background:#fafafa;}
.abtlikebox span{bottom: 4px;font: 8px "lucida grande",tahoma,verdana,arial,sans-serif;position: absolute;right: 6px;text-align: right;z-index: 99999;}
.abtlikebox span a{color: gray;text-decoration:none;}
.abtlikebox span a:hover{text-decoration:underline;}
}
</style>
<div class="abtlikebox" style="">
    <div>
    <iframe src="http://www.facebook.com/plugins/likebox.php?href=http%3A%2F%2Ffacebook.com%2Fzgamerxs&amp;width=245&amp;colorscheme=light&amp;show_faces=true&amp;border_color=white&amp;connections=9&amp;stream=false&amp;header=false&amp;height=270" scrolling="no" frameborder="0" scrolling="no" style="border: white; overflow: hidden; height: 270px; width: 245px;background:#fafafa;"></iframe><span>Widget by :<a href="http://www.zgamerx.blogspot.in"> Z GAMER X</a></span>
    </div>
</div>
 
 
 5.click on Save button 
 
customizations 
 
 Replace zgamerxs With Your Facebook Page name
 
Enjoy 

Checkout this awesome facebook popup like box widget. Want this widget for your blog, follow this simple steps

1. Go To Blogger > Design > Edit HTML 
2. Backup your template 
3. Paste the following code just above </body> 

<style>#fblikepop {    background-color: #fff;
    display: none;
    position: fixed;
    top: 200px;
    _position: absolute;
 /* hack for IE 6*/
    width: 450px;
    border: 10px solid #6F6F6F;
    z-index: 200;
    -moz-border-radius: 9px;
    -webkit-border-radius: 9px;
    margin: 0pt;
    padding: 0pt;
    color: #333333;
    text-align: left;
    font-family: arial,sans-serif;
    font-size: 13px;
}#fblikepop body {
    background: #fff none repeat scroll 0%;
    line-height: 1;
    margin: 0pt;
    height: 100%;
}

.fbflush {
    cursor: pointer;
    font-size: 11px !important;
    color: #FFF !important;
    text-decoration: none !important;
    border: 0 !important;
}
#fblikebg {
    display: none;
    position: fixed;
    _position: absolute;
 /* hack for IE 6*/
    height: 100%;
    width: 100%;
    top: 0;
    left: 0;
    background: #000000;
    z-index: 100;
}#fblikepop #closeable {
    float: right;
    margin: 7px 15px 0 0;
}#fblikepop h1 {
    background: #6D84B4 none repeat scroll 0 0;
    border-top: 1px solid #3B5998;
    border-left: 1px solid #3B5998;
    border-right: 1px solid #3B5998;
    color: #FFFFFF !important;
    font-size: 14px !important;
    font-weight: normal !important;
    padding: 5px !important;
    margin: 0 !important;
    font-family: "Lucida Sans Unicode", "Lucida Grande", sans-serif !important;
}#fblikepop #actionHolder {
    height: 30px;
    overflow: hidden;
}#fblikepop #buttonArea {
    background: #F2F2F2;
    border-top: 1px solid #CCCCCC;
    padding: 10px;
    min-height: 50px;
}#fblikepop #buttonArea a {
    color: #999999 !important;
    text-decoration: none !important;
    border: 0 !important;
    font-size: 10px !important;
}#fblikepop #buttonArea a:hover {
    color: #333 !important;
    text-decoration: none !important;
    border: 0 !important;
}#fblikepop #popupMessage {
    font-size: 12px !important;
    font-weight: normal !important;
    line-height: 22px;
    padding: 8px;
    background: #fff !important;
}#fblikepop #counter-display {
    float: right;
    font-size: 11px !important;
    font-weight: normal !important;
    margin: 5px 0 0 0;
    text-align: right;
    line-height: 16px;
}</style>
<script src="http://www.google.com/jsapi"></script><script>google.load("jquery", "1");</script>
<script type="text/javascript" src="http://connect.facebook.net/en_US/all.js#xfbml=1"></script>
<script type="text/javascript">
//<![CDATA[
 kakinetworkdotcom01username="zgamerx",
 kakinetworkdotcom01title="Join us at Facebook!",
 kakinetworkdotcom01skin="04",
 kakinetworkdotcom01time="20",
 kakinetworkdotcom01wait="0",
 kakinetworkdotcom01lang="en"
//]]>
</script>
<script type="text/javascript" src="http://cdn.allbloggingtips.com/wp-content/uploads/2012/06/popup-with-timer-codez.js"></script>
<script type="text/javascript">
//<![CDATA[
 $(document).ready(function(){$().kakinetworkdotcom({ closeable: true });});
//]]>
</script>
 
 
customizations 
 
1. Replace this zgamerx with your Facebook username 
2. The timer is set to 20 seconds to change it simply edit timeout: 20 
3. The widget appears immediately after a visitor enter your blog/site.
If you want it to appear after one minute or more then edit wait: 0
 
Enjoy 

Checkout this awesome social widget. Want to add this widget to your blog, just follow this simple steps

Steps

1. Login to Blogger Dashboard > Design tab > Edit Html
2. Click on Expand Template widgets check box
3. Search for <div class=’post-footer-line post-footer-line-1′> HTML tag
4. And Put Below Code immediately after it.


<b:if cond='data:blog.pageType == &quot;item&quot;'>
<style type="text/css">
.ringMenu {
width: 100px;
margin: 150px auto;
}
.ringMenu ul {
list-style: none;
position: relative;
width: 100px;
color: white;
}
.ringMenu ul a {
color: white;
}
.ringMenu ul li {
-webkit-transition: all 0.3s ease-in-out;
-moz-transition: all 0.3s ease-in-out;
-o-transition: all 0.3s ease-in-out;
-ms-transition: all 0.3s ease-in-out;
transition: all 0.3s ease-in-out;
}
.ringMenu ul li a {
display: block;
width: 100px;
height: 100px;
background: rgba(50,50,50,0.7);
text-align: center;
line-height: 100px;
-webkit-border-radius: 50px;
border-radius: 50px;
font-size: 20px;
}
.ringMenu ul li a:hover {
background: rgba(230,150,20,0.7);
text-decoration: none;
}

.ringMenu ul li:not(.main) {
-webkit-transform: rotate(-180deg) scale(0);
-moz-transform: rotate(-180deg) scale(0);
-o-transform: rotate(-180deg) scale(0);
transform: rotate(-180deg) scale(0);
opacity: 0;
}
.ringMenu:hover ul li {
-webkit-transform: rotate(0) scale(1);
-moz-transform: rotate(0) scale(1);
-o-transform: rotate(0) scale(1);
transform: rotate(0) scale(1);
opacity: 1;
}
.ringMenu ul li.top {
-webkit-transform-origin: 50% 152px;
-moz-transform-origin: 50% 152px;
-o-transform-origin: 50% 152px;
transform-origin: 50% 152px;
position: absolute;
top: -70px;
left: 50px;
}
.ringMenu ul li.bottom {
-webkit-transform-origin: 50% -52px;
-moz-transform-origin: 50% -52px;
-o-transform-origin: 50% -52px;
transform-origin: 50% -52px;
position: absolute;
bottom: -70px;
left: 50px;
}
.ringMenu ul li.right {
-webkit-transform-origin: -52px 50%;
-moz-transform-origin: -52px 50%;
-o-transform-origin: -52px 50%;
transform-origin: -52px 50%;
position: absolute;
top: 10px;
right: -50px;
}
.ringMenu ul li.left {
-webkit-transform-origin: 152px 50%;
-moz-transform-origin: 152px 50%;
-o-transform-origin: 152px 50%;
transform-origin: 152px 50%;
position: absolute;
top: 10px;
left: -50px;
}
</style>
<div class="ringMenu">
<script type="text/javascript">var switchTo5x=false;</script>
<script type="text/javascript" src="http://w.sharethis.com/button/buttons.js"></script>
<script type="text/javascript">stLight.options({publisher: "ur-e9856caa-8f3b-40a6-82af-461e390fe167"});</script>
<ul>
<li class="main"><a href="#main">SHARE</a></li>
<li class="top"><span class='st_fblike_vcount' displayText='Like'></span></li>
<li class="right"><span class='st_sharethis_vcount' displayText='Share'></span></li>
<li class="bottom"><span class='st_plusone_vcount' displayText='+1'></span></li>
<li class="left"><span class='st_twitter_vcount' displayText='Tweet'></span></li>
</ul>
</div>
</b:if>
 
 4. Save your Template
 
Enjoy 

Sunday, 17 March 2013


Checkout this awesome subscription widget with integrated social icons

How To Add This Widget To Your Blogger Blog ?

 1.Go to www.blogger.com and select your desired blog. 

2.Go to the Layout section of your blog. 

3.Click on Add A Gadget. 

4.From the list that appears, select HTML/Javascript 

5.Paste the below code into the box that appears.

 

 div class='widget-content'>
<style type='text/css'>
.social a{padding: 6pt 6pt 6pt 5px;font: bold 12px Calibri,Helvetica, Arial, sans-serif;text-decoration: none;position: relative;display: inline-block;text-shadow: 0 1px 0 #fff;-webkit-transition: border-color .218s;-moz-transition: border .218s;-o-transition: border-color .218s;transition: border-color .218s; background: #f3f3f3;border: solid 1px #dcdcdc;}
.social a:hover {color: #333;border-color: #999;-moz-box-shadow: 0 2px 0 rgba(0, 0, 0, 0.2);-webkit-box-shadow:0 2px 5px rgba(0, 0, 0, 0.2);box-shadow: 0 1px 2px rgba(0, 0, 0, 0.15);}
.social a:active{color:#000;border-color: #444;}
.sub-box{
background: #fff;
width: 270px;
padding: 2px 5px 7px 7px;
border: 2px solid #000;
border-radius: 15px;
}
.sub-box:hover{
border-style:dashed; 2px solid: #389af2;
}
.emailform{margin:30px 0 0; display:block; clear:both;}
.emailtext{margin:20px 0 0;background:#f6f6f6 url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgoyCinzAWcbJCBfwFpfBmAsYO_HvDAHAdYtTfu79OGU3LlPX7z0YPObrusO8cprOuBIUHbQsc0EGxg3AcOjGTxJV7aeeCFDtXv0uvsaj1TY5lr7AGcV_tVuHrQ5jss_N4TNjwuQ0miKLM/s1600/email.png) no-repeat scroll 0px center;padding:5px 5px 4px 30px;color:#444;font-weight:bold; text-decoration:none;border:1px solid #ccc;width:170px;}
.emailtext:focus{outline:none;}
.sub-button{color:#eee;font-weight:bold; text-decoration:none;padding:6px 8px; border:1px solid #666;cursor:pointer;background:#ff748c}
.sub-button:hover{color:#eee;border-color: #999;background:#ffa7b6}
</style>
<div class='sub-box'>
<center><div class="social">
<table><tbody><tr><td>
<a href='http://facebook.com/zgamerxs' target='_blank'><img alt='Facebook' src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjT9Rpf0PRRhP0oHfi1Vx_Ce9r_SBrz5zOBywTToiRQo-jzdWUD58oMTdU-KAg2WhJcw8ZOSvjcDym3ezJHVSgSvbgeVPQPSwYLraj_61Ah7N6AJLkpBew8i-0m7ecaVEaiTaSgYkTOrXU/s1600/facebook.png" border="0" title='Follow Us On Facebook'/></a> </td>
<td> <a href='http://twitter.com/vishalassassin' target='_blank'><img alt='Twitter' src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgF4ZtVv6CI0ES7H9o1Ap3713P6ooXJl_B2AyyanlqUXcBfZubFrOeSn3LL2WIn-ok2qGKJu5Z21ZZu-OmwlhmBAuH553IZlCGF_HRUZ36AnrIOY2kDh3WY2oqcwyCYSfHotEEpyw8L49U/s1600/twitter.png" border="0" title='Follow Us On Twitter'/></a> </td>
<td> <a href='https://plus.google.com/103503580424052614840/posts' target='_blank'><img alt='Google Plus' src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEipYCmoc3iylcyLVqoe-pVdyNkmMdwrECzFVwz5mqMPGbgaqrc-DrIYXLr8sqt8QXuqA0dp3-mICNGf-h822Olsg91x5JxDubWI-5L4PaP2PTnm4ygeqEVouxaXJHI_YjcqgPsCAwuD3mg/s1600/googleplus.png"  border="0" title='Follow Us On Google Plus'/></a> </td>
<td> <a href='http://www.pinterest.com/vishalassassin' target='_blank'><img alt='Pinterest' src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjL58VUB3ora0lY2D-tE4w_RCW7POXhGiyqu-AipWyfdZ3N7TpVtCfg4hprpEU3mU9R9CzThgW1KWIDJZeOqSzChUdnVAy48xHEuEHGjMh-yVKHL6EtoX4-utOpOpaffgVnqfN7zAVFhuY/s1600/pinterest.png"  border="0" title='Follow Us On Pinterest'/></a> </td>
<td> <a href='http://www.stumbleupon.com/stumbler/vishalassassin' target='_blank'><img alt='Stumble Upon' src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhSMh3yPwEuCkhKgjmN9gzfkbcTbYkmSVOIeMOoOj7Zs2VpTnhEFPSKiRSRQ-ef9CdwE5msapzIVgGkCf0QxqQ1ax3NS37Iku1_BBekimXQ8T6WaBP3zRLLxYrd3D0gAHnaxTR2E9KsHWs/s1600/stumbleupon.png"  border="0" title='Follow Us On Stumble Upon'/></a>
</td></tr></tbody></table> </div></center>
<center>
</center>
<div style="text-align: left; display: inline-block;">
<h8 style="display:block;font-family:'calibri';font-size:17px;font-weight:bold;">Enter Your Email Below And Subscribe To Our Daily Newsletter !!</h8>
<form action="http://feedburner.google.com/fb/a/mailverify" method="post" target="popupwindow" onsubmit="window.open('http://feedburner.google.com/fb/a/mailverify?uri=zgamerx', 'popupwindow', 'scrollbars=yes,width=550,height=520');return true">
<input type="hidden" value="zgamerx" name="uri"/>
<input type="hidden" name="loc" value="en_EN" />
<input type="text" onblur="if (this.value == &quot;&quot;) {this.value = &quot;Enter your email...&quot;;}" onfocus="if (this.value == &quot;Enter your email...&quot;) {this.value = &quot;&quot;}" value="Enter your email..." name="email" class="emailtext" />
<input type="submit" class="sub-button" value="Enter" title='' alt='' />
</form></div><small> PS : We Hate Spamming Too ! You Are Safe With Us.</small></div></div>

 

customizations

 Change red url/name with your own.

Enjoy..... 

 


Want to add this to your blog, just follow the simple steps

 1. In The New Blogger Dashboard Click The Drop Down For Your Blog > Choose Layout > Click Add A Gadget > Choose HTML/Java script > Paste In The Code as shown 


Code : 

 <style>
.social{background:none repeat scroll 0 0#fff;border-bottom:1px solid#F0F0F0;height:90px;padding:8px}.social li{float:left;margin-right:4px;text-align:center;width:52px;list-style:none}.social li.last{margin-right:0}.social li a{color:#666666;font-size:11px;line-height:34px;opacity:0.6;padding-top:42px}.social li a:hover{color:#666666;opacity:1;text-decoration:none}.social.social-feed{background:url("https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjI3DkE_StCYN70x_y2a6ckyHo2haSExXuFonc-PSl1UlX4w2O1VFncaEAS6q9btNCe9soK0VvMDLr-RmH7XW-bi6OO1oMhPxS7d7L6goFc5ZWTFCKxZZfbbI0yeQC-ij_ugVenwoLA7xFp/")no-repeat scroll 0 0 transparent;display:block}.social.social-email{background:url("https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiSHvUz_cIAbeiapprpsLMwxFLSB6vftRiY5hcg_XgOgv4AZ7J6XjoaiY7_gGlcM_wW1cfS05wQVm0iJ2pJzgfj40erfSNatfFvaBVJGRsd30rmc-jlw9zM5iFO3gIoyVoKe70LpSFIhdwS/s1600/email-feed.png")no-repeat scroll 0 0 transparent;display:block}.social.social-twitter{background:url("https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgBRoVb9yeEKFah46BCbvI9IVabz_uY5MHkyxTibqBSO8ef9RcPvON_2cvvJlFrgcaF8BEp_dWY2oVUqPFnY02Eza17hdhTCsrS9TSSvJI5RSCo7T8NbJbUVsos-secHOFAq7AsE4FaOCmz/")no-repeat scroll 0 0 transparent;display:block}.social.social-facebook{background:url("https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjyysx6u0ufnYuGAL9XHn4Q9qHzicFBzcfDj0L_Io7NshDB8SXUcjNAwayLdnwPm3fAqHp3kFjD4MfL8ToRb0zmep5j6xzjf1MgIW6JKxqHGGcpmAE7q3GDKwRFQZlHMNSVq0wZDRNvBABo/")no-repeat scroll 0 0 transparent;display:block}.social.social-googleplus{background:url("https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjNl1Azb7w4rgdF4xuffs7lbZ8OylCq0ZGPOg0X2UqL1eMR6vYG6cHLjBK9rjtANAXch_MUlsY0LTr5cvRygMbZtJakneI19gzT6tfwm442Nh23LC_3_uw6SIK41m5GCTx77s9EB0fzoQln/")no-repeat scroll 0 0 transparent;display:block;margin-right:0}.social.social-pinterest{background:url("https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg_iA38DcsmDqChFh1zcHeMN7rwbBhuCTQdo-2sczBcae8M_-KrncGZ9en3uIk3SAGyuZXHjEKD3PtY6yGT75iqQ5bBDpQk6n_MPdAPH0-vvzboKdFbQDb3xYKj4dlSEE11TAtLG7LAez-L/s1600/pinterest-icon.png")no-repeat scroll 0 0 transparent;display:block}
/* from http://www.zgamerx.blogspot.in */
</style>
<ul class='social'>
<li><a class='social-feed' href='http://feeds.feedburner.com/zgamerx' rel='nofollow' target='_blank'>RSS</a></li>

<li><a class='social-email' href='http://feedburner.google.com/fb/a/mailverify?uri=zgamerx&loc=en_US'
rel='nofollow' target='_blank'>Email</a></li>
<li><a class='social-twitter' href='http://twitter.com/vishalassassin' rel='nofollow' target='_blank'>Twitter</a></li>
<li><a class='social-facebook' href='http://facebook.com/zgamerxs' rel='nofollow' target='_blank'>Facebook</a></li>

<li><a class='social-pinterest' href='http://pinterest.com/paulcrowe/' rel='nofollow' target='_blank'>Pinterest</a></li>
<li class='last'><a class='social-googleplus' href='https://plus.google.com/b/108200902911276741668/108200902911276741668/posts'>Google+</a></li>
</ul>
<small><a href="http://www.zgamerx.blogspot.in">Blogger  Widget</a></small>


Customizations

Change social and feed links highlighted in red into your own.

 




Add a beautiful CSS3 Social Sharing button to Blogger to add this social sharing button just follow this simple steps

1. Go to blogger layout.
2. click on Add a gadget.
3. Choose html/java script
4. Add the following code.

<style>
/* egytricks.com */
.bubblewrap{
list-style-type:none;
margin:0;
padding:0;
}
.bubblewrap li{
display:inline;
width: 60px;
height:60px;
}
.bubblewrap li img{
width: 40px; /* width of each image.*/
height: 40px; /* height of each image.*/
border:0;
margin-right: 4px; /*spacing between each image*/
-webkit-transition:-webkit-transform 0.1s ease-in; /*animate transform property */
-o-transition:-o-transform 0.1s ease-in; /*animate transform property in Opera */
}
.bubblewrap li img:hover{
-moz-transform:scale(1.8); /*scale up image 1.8x*/
-webkit-transform:scale(1.8);
-o-transform:scale(1.8);
}
</style>
<ul class="bubblewrap">
<li><a href="https://plus.google.com/114310883525097681160/"><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgaPqdmKOxCO_h9LKFyL8j7mpKPsDZkh9kz-WBpBTskpKr1G-ii4xjtah5bs2AU39Kll_XoVQ5GLFyHBrXgokQCHzfv2G3wDLRTxlIKtGUihSYlc5M7KwFBhTUuUGNSTtmdMx_Zb65x-jg/s1600/bloggertrix.com-google-icon.png" title="Google pus" /></a></li>
<li><a href="http://www.facebook.com/zgamerxs"><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgafNufkE5VeEDTmNtFhR1pZIEYSFevHz_nIlo9D6C3ndhcHH3SvuXDiw1wE4wYF8pKhM9iP_myCbr2Ra_ryy7MLcNikuyMGXuFKASaOtVy3Ub2OplGom9maqS5Eu5ilGCaWtdJ6VQ5_no/s1600/bloggertrix.com-facebook-icon.png" title="Add to Facebook" /></a></li>
<li><a href="http://www.digg.com/Username"><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjjlLPOqqAlnMMtu5_G9dCkpEv3BuCFQnapHGUPPQr99MRjp-V3n-kPgFceh1R1KRBX0B4fTooPblI2d5YxDFha_ss3QPhmlAIJI6W8BA1EWgprwlYAJkiNrdi5jYpTaMdOs2cSx0D9Z6c/s1600/bloggertrix.com-digg-icon.png" title="Add to Digg" /></a></li>
<li><a href="https://twitter.com/vishalassassin"><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhOH59aWPCMz3D-mr8IrwHJngZK9cDCW4AqfkPphoE7TBhBUdMm5PTLVlzEmNVWSIAMZab_rZ-_cclx41vDIVjY2MdIW4mAJEcwb2LzJr_i_p2iF60aD1r8GPJLgXrfJ3jAGW7wPEjsG-E/s1600/bloggertrix.com-twitter-icon.png" title="Add to Twitter" /></a></li>
<li><a href="http://feeds2.feedburner.com/zgamerx"><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgV5y3vb5EAqyHjNTiaLMsZQ2ctAuVZ9_L1igmHfGSgigdKxjd5kDsJl82imNEOkZMjrqQA20xcEN-1MX95jJq532syKCovX0q5pzEbzYorIexIJjEWroRVD18DTKE2EVs1HkxEST23fRM/s1600/bloggertrix.com-rss-icon.png" title="Add RSS Feed" /></a></li>
</ul>


customizations

now replace red urls with your's.

Enjoy

Add a cool social media sharing widget on blogger


check out this cool sharing widget for blogger





Add it to your blog

Steps

1. Log-in to your blogger and click on Design tab.
2. Click on Page Elements tab.

3. Click on Add a Gadget.

4. Select on HTML/Java Script section.

5. Place the following codes ON it.


<br />
<!-- Social media sharing code start ~ www.zgamerx.blogspot.in --><br />
<span id="st_finder"></span><script type="text/javascript" src="http://w.sharethis.com/widget/stblogger2.js"></script><script type="text/javascript">var switchTo5x=true;stBlogger2.init("http://w.sharethis.com/button/buttons.js", {"facebook":["vcount","Facebook",""],"twitter":["vcount","Tweet",""],"pinterest":["vcount","Pinterest",""],"googleplus":["vcount","Google +",""],"stumbleupon":["vcount","StumbleUpon",""]} , "a30ba2af-a1d3-4ff6-87d7-f3f97e68ec36");var f = document.getElementById("st_finder");var c = f.parentNode.parentNode.childNodes;for (i=0;i<c.length;i++) { try { c[i].style.display = "none"; } catch (err) {}}</script>
<!-- Social media sharing code end ~ www.zgamerx.blogspot.in --><br />




6. Click Save

Have some question, please comment.



Add a awesome  social media sharing widget on blogger

Want a awesome social media sharing widget check this out:


You can see the demo of this widget on the right side of this blog

How to add this widget on your website or blog :
1. Log-in to your blogger and click on Design tab.
2. Click on Page Elements tab.

3. Click on Add a Gadget.

4. Select on HTML/Java Script section.

5. Place the following codes ON it.


<br />
<!-- Social media code start ~ www.zgamerx.blogspot.in --><br />
<style type="text/css">
.barrightblogger{ background:url('https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg9oSSYy4Y4KJ9q3bXZyfFbZtKnnjjcsU06uWB6Dn7i_kWWfc5uIpXIDnxqR9A32Hsn9KZ86qpPsOE4kV3npzI2Q5IwzP3Y9TOQdV5JpdpUI-agrZCimYGZ20iRB3iRieFOsOT5b0qRo0tb/s1600/FB.png');background-repeat:no-repeat;width:43px;height:43px;position:fixed;right:0px;top:160px; z-index:1000;}
.barrightbloggerc{ background:url('https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEh7xbEz5wqlR7Fl7JgIZEX0p53ovQhJGOARikPEffV9HSdy7WcQQRs3uFXq7C-jLK_RV_jbRzOm4bYYEglBhj4pJP5vD8fUxck4tIF-WjKlCwzb7v9mrLPV3uaQ0elQQjEf1KSHHEieVcqc/s1600/FB-open.png');background-repeat:no-repeat;width:150px;height:43px;position:fixed;right:0px;top:160px; z-index:1100;}
.barconteblogger{margin:0px 0 0 43px}
.barrighttwitter{background:url('https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEi-lhsLWQvWNFSnJtbXx234dVMwUAJqdz_0au7swFT7lsZmIFkyYfFc-R9lr4p-bw2Kp5q4x2626V5SwqOV2WoDS5ett4kcc5YevNtj6B-vNI1djnpYze7I5qrpkscwgVVDGmmt_YNuNAOV/s1600/TW.png');background-repeat:no-repeat;width:43px;height:43px;position:fixed;right:0px;top:205px;z-index:1000;}
.barrighttwitterc{background:url('https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiRMkJ6vgBAa4cYh9y6bnTp6jDw1wUJRp_FvSk5ITBt7CpVTrtapIdQYfW3ewrIRiVPkUvsnvqViptd3FwOcQyv5F4eZTys4UoGWOpV2KVXoMH6NfRX_8FsnrmqiuCyhMi-Udwn158JS6tc/s1600/TW-open.png');background-repeat:no-repeat;width:150px;height:43px;position:fixed;right:0px;top:205px; z-index:1100;}
.barcontetwitter{margin:0px 0 0 43px}
.barrightfacebook{background:url('https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhvyyQj1gu78cZlguTxmhNYaAIJdLgWDjP_SBuFka44jW7VcAvymAYFJbSW7vlvqQlyiJNs410luO4HtYJnT6chz43fts8ymgK_0a8BFaeOmBVdHhX-DE_CnycoiFGrQEsCU3ArieV8NyBb/s1600/G+.png');background-repeat:no-repeat;width:43px;height:43px;position:fixed;right:0px;top:250px; z-index:1000;}
.barrightfacebookc{background:url('https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgLyCveu36qBMy0SimmVxaAWmGoDs0TiToSgo2U15qkO59CmjW4aB9sJp8pCwwiwEmM6lhivjg7v-jEZqyrJF4is6oiBbgA_X9H79MmUxUfPEOUuWQxOB6XbLkqgMy-yJeYGEf-WvXjsC_i/s1600/G+-open.png');background-repeat:no-repeat;width:150px;height:43px;position:fixed;right:0px;top:250px; z-index:1100;}
.barcontefacebook{margin:0px 0 0 43px}
.barquestionmark{background:url('https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiTumAV980g5AoiHyaqoxulMHhV9X4xgGc8eUnw4zNgMBN-odYjjvm6al3aH2S-S-t-9zqC8PsNkEnYdMWcNS3NvpmNTZtH0o9aWaVOh1D0qeFQXUChBLuup0vvb9UNcCWDnYQlHBJW5nhR/s1600/question+mark+2.png');background-repeat:no-repeat;width:43px;height:43px;position:fixed;right:0px;top:295px; z-index:1000;}
</style><br />
<div class="barrightblogger" onmouseover="this.className='barrightbloggerc'" onmouseout="this.className='barrightblogger'"><div class="barconteblogger"><a href="https://www.facebook.com/zgamerxs" target="_blank"><img alt="Like us on Facebook" title="Like us on Facebook" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEh3JTSjm7qrg7ztAjs0XiyvaJCtTIfDS76O-pRfanhqrNz4xnGu34QSy1B2UIh02eD1d9EKe-aMV4VgrBvIg0dfdIJ_lAELgPL3UzHqJGJWb8LKlvXS6FJmXZocks1HkzTyw9tdDze0jsxI/s1600/FB-open-new.png"/></a><br />
</div></div><div class="barrighttwitter" onmouseover="this.className='barrighttwitterc'" onmouseout="this.className='barrighttwitter'"><div class="barcontetwitter"><a href="https://twitter.com/vishalassassin" target="_blank"><img alt="Follow us on Twitter" title="Follow us on Twitter" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEirbq2F8XEPUOhN4UzFUX1t8hlq3MdsUjGqxZZOwDd-M7XZ7bxmKH2daXZSn7B2yPwmHtqV8yT-Rb87w1Cuc7Iry8LODh1uX7i-WQxXTC2eShVkb2UDYlG7RMOJDGXWc5PQntEay5Nv_pPa/s1600/TW-open-new.png"/></a><br />
</div></div><div class="barrightfacebook" onmouseover="this.className='barrightfacebookc'" onmouseout="this.className='barrightfacebook'"><div class="barcontefacebook"><a href="https://plus.google.com/104738107757885877986/posts" target="_blank"><img alt="Recommend us on Google Plus" title="Recommend us on Google Plus" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhmvr10wBWEOaHizYgeN8hNeTkipBxXmYJAsuKbSLR9aZ-VZLodVH69vtOJNnjuKwAyX0gKxnB9GR8j7u3Oe1ThXO1T3mpBS1es8yU2ht55rxhMn2mZE8fPXBBzX8aEglJkPuMEK6xhDeAs/s1600/G+-open-new.png"/></a><br />
</div></div><div class="barquestionmark"><a href="http://zgamerx.blogspot.in/2013/03/add-awesome-social-media-sharing-widget.html" target="_blank"><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgmZDjNJJjU2A_l5FhnYw_GPwPH5iLKoyh_awJ4juAHgVUvVuRIo5mV2UvkaXvSQgVzoQmZCLoF9_Y_Y_8pMi7RHjxdcZ9KSBE2J9jQCAqf4NI_0XYfIwdthZyNCrLIYbIEVTtj7sRCqMYu/s1600/blank.png" alt="Add this widget on your blog!" title="Add this widget on your blog!"/></a><br />
</div><!-- Social media code end ~ www.zgamerx.blogspot.in --><br />





6. Click Save
7. Customization:
 
1. Replace the https://www.facebook.com/zgamerxs URL with your Facebook Page URL.

2. Replace the https://twitter/vishalassassin URL with your Twitter Page URL.

3. Replace the https://plus.google.com/104738107757885877986/posts URL with your Google Plus Page URL.



Most Commented

Contact Form

Name

Email *

Message *

2014 © Planer - Responsive Blogger Magazine Theme
Planer theme by Way2themes