Widget Social Sharing Angry Birds

Kali ini saya akan share tentang widget social sharing , tapi widget yang satu ini beda dari yang lain , Yup betul . bentuknya adalah karakter karakter di Angry Birds buatan Rovio ini.Cara bikinnya mudah kok,yaitu memakai kode css.

ok langsung saja ya cara membuat Widget Social Sharing Angry Birds

• Login blog
• 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>

 .bubblewrap{
list-style-type:none;
margin:0;
padding:0;
}
.bubblewrap li{
display:inline;
width: 50px;
height:50px;
}
.bubblewrap li img{opacity:0.5;
width: 50px; /* width of each image.*/
height: 50px; /* height of each image.*/
border:0;
margin-right: 1px; /*spacing between each image*/
-webkit-transition: all 0.6s ease-in-out;
-moz-transition: all 0.6s ease-in-out;
}
.bubblewrap li img:hover{
opacity:1.0;
}

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

<ul class="bubblewrap">

<li><a href="https://plus.google.com/112967100591602380317"><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhVrtY_iIzTYl8A3g1HTsX-ma6j_Hpsk4TViFeUR4HNCk70XXvv5YFeJk3Gtu3qkRtAIU3tl686KQ26kGZtV0ol4pF90q0PmRaBH1haxwzTFplUS2fpKuvj9b78R4rPhQp7pTLBncEcS80/s1600/bloggertrix-googleplus.png" title="Add to Facebook" /></a></li>

<li><a href="http://www.facebook.com/vikrymadz"><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEh3y2SU2ACAYdaAczsojxZ1EnmkwZ9ZB_wLzMic-1jDwbATl53WuUkW-R_wHDulR5ZBCWlOtCK9MQPgf0UD3aQNlQ01Wf0_hOeuQiFkztXaB07xTW_nanc8eFbHGrrNaW5HO_ytV5_EFJg/s1600/bloggertrix-facebook.png" title="Add to Facebook" /></a></li>

<li><a href="http://www.youtube.com/vikrymadz"><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEil6m6gjOq1Qlo9-CPlNYr2udFCV76X8nHeSlnQZCMu0lbUOcvLfqmOCtLRhp6EP46TRGn41LcCVDXRANHhYC-ntKGsIaBq9STwf5M-8oSQ5FVkqO-Io5a8nEvxaboYRCmma0VBZ7XpR7g/s1600/bloggertrix-youtube.png" title="Add to Youtube" /></a></li>

<li><a href="http://www.twitter/vikrymadz"><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEixwoMM3KZP4QoQzbzIUvq9xZOuVvxXDwEAKPmOlJToMTMchJkpd5N83adc5G5EGFm_V_Sck_P71XzWO85ri1W3x8nfpbUqk821SlhvDztRcbQ1VCGRFu1ZfotMXyQkPT1VIp9HnvOsIB8/s1600/bloggertrix-twitter.png" title="Add to Twitter" /></a></li>

<li><a href="http://feeds2.feedburner.com/vikrymadz"><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjy8vtGcVfxXrHKHKD9qoOfKYw95CXWGPW20rV6hrl7JfNqkk7gjgCGJttWYayeLeTuLb-H3_s3a03X6y00Ush1ooerroIw5ilawsuWdclMFrqIp16sEW2G8xhs3kwcc0jQ05QL4kr-JlY/s1600/bloggertrix-Rss.png" title="Add RSS Feed" /></a></li>
</ul>

Lalu Simpan :D
Semoga postingan kali ini bisa bermanfaat bagi anda dan saya ucapkan terima kasih..

sumber script:http://www.vikrymadz.web.id/
 

Demo :

 

• 
• 
• 
• 
•