Loading...

Cara Membuat Widget Sosial Media Animasi Berputar

Bangiz - Jika anda sedang mempercantik blog atau website yang Anda punya, rasanya belum lengkap kalau tidak menyertakan tombol sosial media. Karena sosial media ini merupakan salah satu jalan untuk memperkenalkan blog atau tulisan di dalamnya ke khalayak ramai. Apalagi saat ini banyak sekali sosial media yang bisa kita gunakan.

Setelah sebelumnya admin pernah posting yang lucu juga romantis, kali ini saya akan memberi tahu cara membuat widget sosial network yang bisa berputar jika di sentuh kursor. Oke langsung saja ikuti caranya berikut ini:

Anda hanya perlu menambahkan kode CSS berikut ini. Jika belum tahu cara menambahkan kode HTML/Javascript, silahkan baca Cara Menambahkan Kode HTML/JavaScript.

<style>
p#bangiz_getyourinspiration img {
/* Social Share Widget By http://bangiz.blogspot.com */
    -moz-transition: all 0.9s ease-in-out;
    -webkit-transition: all 0.9s ease-in-out;
    -o-transition: all 0.9s ease-in-out;
    -ms-transition: all 0.9s ease-in-out;
    transition: all 0.9s ease-in-out;
}
p#bangiz_getyourinspiration img:hover {
    -moz-transform: rotate(360deg);
    -webkit-transform: rotate(360deg);
    -o-transform: rotate(360deg);
    -ms-transform: rotate(360deg);
    transform: rotate(360deg);
}
/* Social Share Widget By http://bangiz.blogspot.com */
</style>
<center><p id="bangiz_getyourinspiration">
<a href="http://www.facebook.com/markudes"' target='_blank'><img border="0" src="http://1.bp.blogspot.com/-pfdCr67N0vY/URV01_6rbJI/AAAAAAAACVg/n_vDeB55BIE/s000/facebook.png' title='Facebook" /></a>
<a href="http://twitter.com/akunAnda"' target='_blank'><img border="0" src="http://4.bp.blogspot.com/-UHTXhLlnAM4/URV01PYeT8I/AAAAAAAACVY/GNfBcx1tgsY/s000/twitter.png' title='Twitter" /></a>
<a href="https://plus.google.com/u/0/116854867169638500872"' target='_blank'><img border="0" src="http://3.bp.blogspot.com/-lodPYWKzSs8/URV02Sr-jWI/AAAAAAAACVo/oAhkSrXW_qU/s000/gplus.png' title='Google Plus" /></a>
<a href="http://www.linkedin.com/akunAnda"' target='_blank'><img border="0" src="http://3.bp.blogspot.com/-_aFcLmXOmWA/URV02yUDxCI/AAAAAAAACVw/iKGHV_pzIVU/s000/linkedin.png' title='LinkedIn" /></a>
<a href="http://feeds.feedburner.com/akunAnda"' target='_blank'><img border="0" src="http://4.bp.blogspot.com/-DG0bPhhycRU/URV03kQ819I/AAAAAAAACV0/PPkxhtfMJZI/s000/rss.png" title='FeedBurner" /></a>
<a href="http://feedburner.google.com/fb/a/mailverify?uri=akunAnda"' target='_blank'><img border="0" src="http://4.bp.blogspot.com/-xYeZT1Ckroo/URV04QBRScI/AAAAAAAACV8/Mzc6lTDySpQ/s000/email.png' title='Email" /></a></p></center>
Keterangan: Silahkan ganti yang berwarna pink dengan alamat URL akun Anda. Adapun yang berwarna biru adalah jenis sosial media yang akan ditampilkan. Jika ingin menghilangkan salah satu sosial medianya, hapus kode berikut:

<a href="http://www.linkedin.com/akunAnda"' target='_blank'><img border="0" src="http://3.bp.blogspot.com/-_aFcLmXOmWA/URV02yUDxCI/AAAAAAAACVw/iKGHV_pzIVU/s000/linkedin.png' title='LinkedIn" /></a>

Jangan lupa di simpan dan lihat hasilnya.
gambar osial media
Sosial media
Itulah cara membuat widget sosial media dengan efek animasi berputar. Berbagi itu indah, jadi silahkan berbagi kepada teman-teman sosmed Anda dan jangan lupa follow +Bangiz  untuk mendapatkan update terbaru. Happy blogging!!! 

/fa-thumbs-up/ RELATED$type=list-tab$hide=home

Name

Android,5,Blogging,108,CorelDRAW,14,Desain Grafis,24,Facebook,22,Foto Sampul,34,Gambar,54,Info,18,Internet,31,Kata Mutiara,26,Kesehatan,31,Komputer,25,Microsoft Word,12,Office,12,PhotoScape,10,Resep,6,SEO,10,Sosial media,21,Tutorial,36,Wallpaper,20,
ltr
item
Bangiz: Cara Membuat Widget Sosial Media Animasi Berputar
Cara Membuat Widget Sosial Media Animasi Berputar
Cara membuat sosial media keren, membuat widget sosial share animasi, membuat sosial network animasi berputar, membuat tombol facebook, twitter, google+, Linkin In, Feed Burner, Email Keren dengan efek berputar
https://1.bp.blogspot.com/-Y0b0ocEEMXM/UYtSVcjvQkI/AAAAAAAAEPE/PlQGj0Loxjw/s1600/sosmed.jpg
https://1.bp.blogspot.com/-Y0b0ocEEMXM/UYtSVcjvQkI/AAAAAAAAEPE/PlQGj0Loxjw/s72-c/sosmed.jpg
Bangiz
https://bangiz.blogspot.com/2013/05/Sosmed-Berputar.html
https://bangiz.blogspot.com/
https://bangiz.blogspot.com/
https://bangiz.blogspot.com/2013/05/Sosmed-Berputar.html
true
5131493432912556385
UTF-8
Loaded All Posts Not found any posts VIEW ALL Readmore Reply Cancel reply Delete By Home PAGES POSTS View All RECOMMENDED FOR YOU LABEL ARCHIVE SEARCH ALL POSTS Not found any post match with your request Back Home Sunday Monday Tuesday Wednesday Thursday Friday Saturday Sun Mon Tue Wed Thu Fri Sat January February March April May June July August September October November December Jan Feb Mar Apr May Jun Jul Aug Sep Oct Nov Dec just now 1 minute ago $$1$$ minutes ago 1 hour ago $$1$$ hours ago Yesterday $$1$$ days ago $$1$$ weeks ago more than 5 weeks ago Followers Follow THIS CONTENT IS PREMIUM Please share to unlock Copy All Code Select All Code All codes were copied to your clipboard Can not copy the codes / texts, please press [CTRL]+[C] (or CMD+C with Mac) to copy