Hi friends now add best animated style social bookmarking widget in blogger sidebar easily.
Follow simple and easy step to adding this social widget in your blogger blog---->>>>
* First go to your blogger Dashboard.
* Click in design tab and edit HTML.
* Click in small box to expand your blogger template.
* Now find this code ]] by CTRL+F key easily.
* Copy below code and paste before ]]
#social-box {
overflow:hidden;
}
#social-box ul li {
display:block;
background:#EBF4FB;
border:#b6daf6 1px solid;
padding:10px;
-moz-border-radius: 6px;
border-radius: 6px;
margin-bottom:10px;
}
#social-box ul li:hover {
border:#276dc1 1px solid;
background:#d3e6f5;
}
.soc-icons-bar {
list-style:none;
margin:0px 0 0px;
padding:0
}
.soc-icons-bar a {
font:18px Arial, Helvetica;
padding:4px 28px 16px 43px;
background:none;
text-decoration:none;
font-weight:bold;
text-shadow:1px 1px #fff;
}
.soc-icons-bar a:hover {
color:#276dc1;
}
.soc-icons-bar li{
display:block;
padding:5px 10px 5px 0;
height:25px;
background:none;
}
.soc-icons-bar li.tw a{background: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEi1C4QG205sJG92RsaiACAYm013_f1t2Pg44egvr9P0a1q0nwgEv4rwggvMm71xi2virTUnu-kcF6xVd8i_sZvAntAwPfSZcnwHnBOny3UjSIYaLvaHqHT7kE-VPPYmk5c97aphk_jhMZI/) no-repeat scroll 0 0}
.soc-icons-bar li.fb a{background: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEivIbc02BYQrCkKHiJ35Gf3NIqsjuG9xtRfLnAFRjkfNaYN7eOil0IEzwMvVvaR9xOil-v_56zPfva_CfzMu2XGL11mLTTjqGMnLBVlUObsK6gw2rPlqS5bbHklifrRUWhNPM42Q98u4OA/) no-repeat scroll 0 0}
.soc-icons-bar li.rss a{background: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjKvzN8O6Z6cY5uforgfyAXrz2AVQ8pktgKlO44kIV6zancbGfu063HbuKjNUv3F4VOKLwBV39It7_V7IBxRDiiYmwcwvDzVi4up61aalZ7HPjHEs7zHjqDbCSIJ1V0hkpmaUxeidMMhQo/) no-repeat scroll 0 0}
.soc-icons-bar li.email a{background: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhyl2BuX-K6haDApkWrSflW1fyisQqgZwQvIxlMQnwkyFe7_GkGker42FZum0da-ah9SEHLHGnRrA18of1GncTc4HLJGzvjVQpHj_dw1OoJCvT60hE4Osu2N6ujE-K8FcwphIcg14HONK8/) no-repeat scroll 0 0}
#sidebar-banners img {
margin-bottom:5px;
}* Now save your blogger template .
* Again go to your blogger dashboard.
* Click in design tab and you are here--->>> Page element.
* Click in add Gadget which is in sidebar and when open new window click in HTML/javascript from list.
* And when open new blank box copy below code and paste in blank box.
NOTE:- Change Highlighted text in above code with your own ok.
* Now click to save your HTML/Javascript and now you are done.
0 comments:
Post a Comment