Widget Social Sharing Dengan Icon Angry Birds

Widget Social Sharing dengan icon Angry Birds - Salah satu cara mempercantik blog adalah dengan cara memasang widget yang menarik. Seperti salah satu widget yang akan saya bagi berikut ini, yaitu Widget sosial sharing. Berbeda dengan widget yang lainnya. Widget ini menggunakan icon angry birds. Sobat penasaran? Lihat gambar diatas.

Berikut ini cara membuat Widget Social Sharing dengan icon Angry Birds.

• Masuk ke dashboard blog sobat
• buka menu template > edit HML
• lalu cari kode ]]></b:skin> gunakan ctrl+F untuk mempermudah mencari
• letakkan kode dibawah ini tepat diatas kode ]]></b:skin>

/* Vikrymadz */

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

• lalu simpan
• kemudian masuk ke > tata letak > add gadget/tambah gadget (HTML/JavaScript)
• lalu masukkan kode dibawah ini

<li><a href="https://plus.google.com/#"><img src="http://3.bp.blogspot.com/-b3-ImgxoXZE/ULTdqlQ4TYI/AAAAAAAAF2g/pBhTwnttAKY/s1600/bloggertrix-googleplus.png" title="Add to Google+" /></a></li>
<li><a href="http://www.facebook.com/#"><img src="http://4.bp.blogspot.com/-PL55Jd1MIgw/ULTdpgxpthI/AAAAAAAAF2Y/zqic5hvj2BU/s1600/bloggertrix-facebook.png" title="Add to Facebook" /></a></li>
<li><a href="http://www.youtube.com/#"><img src="http://4.bp.blogspot.com/-RlxdrBe4ecs/ULTduDJX5gI/AAAAAAAAF24/Pc03FWKq8js/s1600/bloggertrix-youtube.png" title="Add to Youtube" /></a></li>
<li><a href="http://www.twitter/#"><img src="http://3.bp.blogspot.com/-NjAWTWrlX5E/ULTdtCeqFeI/AAAAAAAAF2w/sLBX0ttP1rE/s1600/bloggertrix-twitter.png" title="Add to Twitter" /></a></li>
<li><a href="http://feeds2.feedburner.com/#"><img src="http://1.bp.blogspot.com/-Cy7I8qvNDg0/ULTdoi-T18I/AAAAAAAAF2Q/qPyAZfmRqU8/s1600/bloggertrix-Rss.png" title="Add RSS Feed" /></a></li>
</ul>

• Simpan dan lihat hasil nya

NOTE : Gantilah setiap tanda #dengan User Name yang sesuai dengan punya sobat