Add Heart Style Social Sharing Widget to Blogger Blog

Add Heart Style Social Sharing Widget to Blogger Blog

 Want add Social Sharing Widget to Blogger blog. Social share button make blog more visitor friendly. Today I share Heart Style Social Sharing Widget to Blogger. To add just make below steps properly.

1. Login to your Blogger Account.

2. From Dashboard >> Tamplate >> Edit HTML >> Proceed.

3. Don't forget to backup your template first.

4. Check the Expand Widget Templates box.

5. Find out (Press Ctrl+F) the Code   ]]></b:skin>

6. Now Just before the  ]]></b:skin> Paste the following Code

.sr-site{
list-style-type:none;
margin:0;
padding:0;
}
.sr-site li{
display:inline;
width: 60px;
height:60px;
}
.sr-site li img{
width: 50px; /* width of each image.*/
height: 50px; /* 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 */
}
.sr-site li img:hover{
-moz-transform:scale(1.8); /*scale up image 1.8x*/
-webkit-transform:scale(1.8);
-o-transform:scale(1.8);
}

7. Go back Blogger and click Layout than Add Gadget >> HTML/Javascript.

8. Paste the below code and Save.

<ul class="sr-site">
<li><a href="http://www.plus.google.com/10795529879"><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhefeIXQQHqm_k3KRjgTJcuirtIm9_PmbGjaBl0B86QZabnFxCw1oasEmBECRJTpERxNIdO8-jziM1EmMU-eq8r6jsK5bvYErgqnhYzEsKUBadBpaFWElhG5QW8fRCLUkja16BcPdGVNL4/s1600/sr-site.com-google-plus.png" title="Add to Facebook" /></a></li>
<li><a href="http://www.facebook.com/sr-site"><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg_F2WSBfEIgi6v0tUbi455F1zQeY7BLG1p7sG5of-NDH0DINe8daIcZKnd1LGhIGdr-wjZiBOWl-Yg7GxTtmKpZGitF3-ZAaG9A4Bnn3A4lgEahq3JoYQsS64TtlFDEmU80NHif3Zb-hU/s1600/sr-site.com-facebook.png" title="Add to Facebook" /></a></li>
<li><a href="http://www.Stumbleupon.com/Username"><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEh_KLLfRd7yjZyh0SJTCU2Rw-yBj5p2IndMT-q-nMeS5j_U46DNxMUUqCH9J3mHhPRuCOGX74YVL-qKb-jIYRW-mNPXOu0WKXP0M0feP-QnwoalzYinRfCBWDIQlkU0NS-cQuXXEwV78no/s1600/sr-site.com-stumble.png" title="Add to Stumbleupon" /></a></li>
<li><a href="http://www.twitter/sr-site"><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEi1fSLbWNQqPNyDq7vZ7vmEuPA6Je1BB_rzIyVUWHu3-SMq8q_YFn7fZxw49UJo4FbG9joWyi5hDsEQz2dj3mITFPj7BUlHgTwkqEUnoULY-SkoRO7nXnZIBSEJGz29uH5Jk09WZx5U-WI/s1600/sr-site.com-twitter.png" title="Add to Twitter" /></a></li>
<li><a href="http://feeds.feedburner.com/Sr-Site"><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEj07I-KAMbDzXcTRslu2r5G_GhFRML4qsQZWNcUPNfoI4YSG__T8Ertq3r-VbsFfPzWHMbAwYPbw8ZvviZ7oZ97S5kPuhnmBpqQy7qYrJtcJttNFgTRVnONy-fQxSP8wIzpUDoK0SmiLzg/s1600/sr-site.com-rss.png" title="Add RSS Feed" /></a></li>
</ul>

9. Replace your url where need. You are done.

Anda baru saja membaca artikel yang berkategori SEO Tips dengan judul Add Heart Style Social Sharing Widget to Blogger Blog. Anda bisa bookmark halaman ini dengan URL http://msr-site.blogspot.com/2013/03/add-heart-style-social-sharing-widget.html. Terima kasih!

Ditulis oleh: Unknown - Sunday, March 31, 2013