Selasa, 18 Maret 2014

Cara Membuat Tombol Share Dengan Efek Berputar

Tombol sosial share tentunya sangat perlu kita simpan di blog atau site. Gunanya yaitu untuk mensosialisasikan postingan atau blog kita. Untuk saat ini mulai dari bentuk, efek, warna dan sebagainya sangat bermacam-macam. Untuk mendapatkan hasil yang sesuai dnegan keinginan tentunya kita dituntut untuk lebih kreatif. Berikut ini Bangiz akan berbagi tentang tombol share dengan efek berputar jika tersentuh mouse: 
 tombol share

1. Masuk dasbor blogger
2. Pilih Tata Letak > Tambahkan Gadget > HTML/Javascript
3. Copy-paste kode berikut pada kolom yang tersedia:
<style>
p#deloiz_whereverweare img {
 /* Tombol Sosial Share By http://downloadwallpaperanimasi.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#deloiz_whereverweare img:hover {
    -moz-transform: rotate(360deg);
    -webkit-transform: rotate(360deg);
    -o-transform: rotate(360deg);
    -ms-transform: rotate(360deg);
    transform: rotate(360deg);
}
/* Tombol Sosial Share By http://deloiz.blogspot.com */
</style>
<center><p id="deloiz_whereverweare">
<a href="URL AKUN ANDA" target='_blank'>
<img border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiwhHW9Ss4a57SxnTYs_vJFapqFtMp_mmhRGMw-4Wn7CHrXYPqUjoeKci7JFnGRSv413KYi0hgE7F9OkR_YsD0e9hq31AEPQePjCC7hPevAnZy07Brj66DJXF-Qgg_qwo0UYwN9RIuBprk/s1600/1367482865_facebook.png' title='Facebook" /></a>

<a href="URL AKUN ANDA" target='_blank'>

<img border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhLP9qB-CQkvQGDUBkbEi6fY4WekvRiDCE7adya-qj9mhfvWJz8sMLDELon1JchBn4tR97e5bJWgE993rDUVknvhDhTsSF0fNldttrsiDJ3KvuWUkOcAUDQBBhfPJith13DZHFuJm2-9qQ/s1600/1367482877_twitter.png' title='Twitter" /></a>

<a href="URL AKUN ANDA" target='_blank'>
<img border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjtWK5O9qU3e5SG1MwOqXc3MOLlnNwRKgdTB7e9mfBeJYE0D5-Tb-BZKPKpn2E8dBfkP0FSUpQv90CmgHi3p1Li6SZgBAuArOs5wrUcN0x_nsm-3Ree6A9eXkp582XPlELno-rAPBJV_OY/s1600/1367482887_google.png' title='Google Plus" /></a>

<a href="URL AKUN ANDA"' target='_blank'>
<img border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgeStQQ0J8ySk1TtIt5g4PQa_aISBGqGtxT4QijVjC9bSnu9gNHA9PE6dDcgBr3VDwwiDd0kn5v-8f8GUXWOoFzVvyrw2_6Zqu5pQS3eZnath_uTj9pDqM7RcnggYaRqhJAzK3TfwV_G2o/s1600/1367482890_linkedin.png' title='LinkedIn" /></a>

<a href="URL AKUN ANDA" target='_blank'>
<img border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEid84UTRTC3zmePax7c97T6JdqvvrIx4_rAvV6IVZgS7aJOH1WPNf59DpNc2ABzGdy4DGvyvC3iQKUAfuPHL80fkw24FVcIki3IFPmsXXjRTNlCkF9v7I9T2pF7vNaeTWq_FaNIFR2tU9I/s1600/1367482894_rss.png" /></a>

<a href="URL AKUN ANDA" target='_blank'>
<img border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEi-4D-kE72S1T7-rl_lyFL5_BBxQSgK48vdIqXkPLcyHOF4xYhVSG4HSTEjLIOzNqOxQFuhIXg69QBR27JZsgEiAR6sLvMChnSIuyD5dqnucr8gwm2vJqeJCcYjKqw9bQK_sOpGo5tic2U/s1600/1367482884_youtube.png' title='Youtube" /></a>
</p></center>
4. Simpan dan lihat hasilnya


Keterangan:
--> 0.9s merupakan kecepatan berputar
--> 360deg merupakan derajat putaran
--> URL AKUN ANDA silahkan ganti dengan URL akun yang Anda miliki


Begitulah Cara Membuat Tombol Share Dengan Efek Berputar, Anda bisa menyimpannya di sidebar, footer atau yang lainnya sesuai keinginan Anda. Jika ada pertanyaan silahkan tinggalkan komentar dan jangan lupa share ke teman-teman Anda melalui sosial media.

Tidak ada komentar:

Posting Komentar