Today I want to tell You about a New Social Sharing Widget/Gadget. This particular widget’s layout is dependent on anyone interface involving Microsoft’s most current OS IN THIS HANDSET (Windows 8) referred to as City type.
It's simple to in addition now take some which House windows 8 contact and also experience directly into your current Doodle-kit blog likewise utilizing Alam’s Metro-style inspired interpersonal sharing golf widget layout.
Installation is Very easy Just follow Below Steps:
Step 1: Lo-gin to your blogger account and Select Template Option from Left side Menu.
Step 2: Click on Edit Template.
Step 3: Find This Code " ]]></b:skin> " By pressing Ctrl+F .
Step 4: Copy the following Code and paste Above this Code " ]]></b:skin> ".
" .widget-item-control a {
display:none;
}
.widget-item-control a {
display:none;
}#supportive {
width:300px;
float:left;
margin-top:10px;
}
#supportive li {
position:relative;
cursor:pointer;
padding:0!important;
}
#supportive .facebook,.googleplus,.rss,.twitter {
position:relative;
-moz-transition:all .4s ease-in-out;
-webkit-transition:all .4s ease-in-out;
-o-transition:all .4s ease-in-out;
transition:all .4s ease-in-out;
z-index:5;
display:block;
float:left;
margin:1px;
}
#supportive .icon {
overflow:hidden;
}
#supportive .facebook {
width:147px;
height:150px;
background:rgba(59,89,152,1) url(https://lh4.googleusercontent.com/-6tuOBGcpzGc/URPO_I2Yj9I/AAAAAAAAC_0/qBm56PAG1yY/h120/facebook.png) no-repeat center center;
}
#supportive .twitter {
width:148px;
height:74px;
background:rgba(59,89,152,1) url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiuL2fk0JmVERyxQ_En4USTCVQOKemK7TeqLVhgwStVyaAyc-YOWWS-uF4OyAaRT5eR_EIYxErPU0sRVCUzZ-TpYvX8FCamhdd2_j2vfbsXjqqAU1wxOAauuyphn67vESN8p2z8dHLo8DFV/s1600/Twitter.png) no-repeat center center;
}
#supportive .googleplus {
width:148px;
height:74px;
background:rgba(59,89,152,1) url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg-y_vbK0MPtX9iFxXqwWs9zOnCOTQCvLHBzUWkLaVp8QMJAEBWahqa6mKb28zw3iABZxMaFX_9t7IT82mQJvZr8Yu4NvER5ZSoBY_GziN8GbsneZkyk_MQbLGc3ifQl2zVirRn15WgmnCs/s1600/google+plus.png) no-repeat center center;
}
#supportive .rss {
width:299px;
height:74px;
background:rgba(59,89,152,1) url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgcCtA7PrVdwvGSE2-EndS0vI0hNGBRv79QR8mBepykZrInKO83MSp_orw7DFHtfCZkSdzEpi7BR7VeHTLdV67ksj9DRc817-t705hiOrnoD7OktlxHVumvKg24GCRycVrM9AKEOPOjMERY/s1600/rss.png) no-repeat center center;
}
#supportive li:hover .facebook {
background-color:#3468B6;
-moz-transition:all .1s ease-in-out;
-webkit-transition:all .1s ease-in-out;
}
#supportive li:hover .twitter {
background:rgba(64,153,255,1) url(https://lh6.googleusercontent.com/-gp5q_y7kibQ/URPO_I6-sKI/AAAAAAAAC_w/twhFzlX2p1c/h120/Twitter.png) no-repeat center center;
-moz-transition:all .1s ease-in-out;
-webkit-transition:all .1s ease-in-out;
}
#supportive li:hover .googleplus {
background:rgba(228,69,36,1) url(https://lh6.googleusercontent.com/-5-00TE6gtvM/URPO_ALyNwI/AAAAAAAAC_4/A4Dr7Hg7C6A/h120/google+plus.png) no-repeat center center;
-moz-transition:all .1s ease-in-out;
-webkit-transition:all .1s ease-in-out;
}
#supportive li:hover .rss {
background:rgba(255,102,0,1) url(https://lh4.googleusercontent.com/-NjlbntNHzFI/URPPCHuQ_XI/AAAAAAAADAI/S2lzrz6uZ0c/h120/rss.png) no-repeat center center;
-moz-transition:all .1s ease-in-out;
-webkit-transition:all .1s ease-in-out;
} "
Step 5: Now Click on Save Template. Step 6: Now Go to layout from left side Menu. Step 7: Click on Add new gadget. and select HTML/javaScript Step 8: Copy the Following Code and paste in box.
" <ul id='supportive'>
<li><a class='icon facebook' href='http://www.facebook.com/FaceBookPage/'/></a></li>
<li><a class='icon twitter' href='http://twitter.com/TwitterUserName'/></a></li>
<li><a class='icon googleplus' href='https://plus.google.com/GooglePlusUserID/'/></a></li>
<li><a class='icon rss' href='http://feeds.feedburner.com/FeedBurnerUserName'/></a></li>
</ul> "
Step 9: Replace Red Color text with your User name or ID.
0 comments:
Post a Comment