Cara Menambahkan Tombol Sosial Media Melayang (Facebook dan Twitter) di Blog

Sebelumnya Aku telah berbagi Cara Menambahkan Tombol Sosial Media di Sidebar WordPress, sekarang kita akan mencoba bagaimana Cara Menambahkan Tombol Sosial Media Melayang di WordPress. Tombol sosial media yang saya maksud disini adalah tombol sosial media yang paling sering digunakan oleh para blogger, yaitu tombol Facebook dan Tombol Twitter. Seperti apa sih tombol sosial media yang dimaksud? dan bagaimana cara memasang Tombol Sosial Media Melayang (Facebook dan Twitter) di WordPress ini? 

Sebenarnya untuk memasang tombol facebook dan twitter melayang ini sama dengan cara Membuat Gambar melayang di WordPress.com yang dulu pernah saya bagikan, namun kita akan sedikit memodifikasi gambar melayang atau floating image-nya dengan mengganti alamat gambar dan link dari sosial media yang ingin kita pasang. Tapi berbeda dengan twitter melayang yang dimiliki oleh blogger di blogspot, tombol twitternya bergambar burung dan bisa terbang kemana-mana, itu karena di blogger kita dapat dengan bebas bermain html karena mendukung kode javascript.

Berikut beberapa kode tombol sosial media yang dapat Anda coba untuk dipasang di widget sidebar blog WordPress Anda :

Klik Gambar untuk Melihat Hasilnya

1. Tombol Facebook dan Twitter tanpa background :

Kodenya :

<a style="position:fixed;top:270px;left:10px;" href="http://www.facebook.com/irfan.handi" title="My Facebook" target="_blank" rel="nofollow"><img src="http://irfanhandi.files.wordpress.com/2012/06/facebook-64x64.png"></a>
<a style="position:fixed;top:335px;left:10px;" href="http://twitter.com/#!/irfanhandi80" title="My Twitter" target="_blank" rel="nofollow"><img src="http://irfanhandi.files.wordpress.com/2012/06/twitter-64x64.png"></a></div>

2. Tombol Facebook dan Twitter dengan background :
Kodenya :

<div style="display:scroll;position:fixed;top:224px;left:0;"><a href="http://terserah Anda" title="terserah Anda"><img src="http://irfanhandi.files.wordpress.com/2012/06/tombol-sosial-media.png"></a>
<a style="position:fixed;top:270px;left:10px;" href="http://www.facebook.com/irfan.handi" title="My Facebook" target="_blank" rel="nofollow"><img src="http://irfanhandi.files.wordpress.com/2012/06/facebook-64x64.png"></a>
<a style="position:fixed;top:335px;left:10px;" href="http://twitter.com/#!/irfanhandi80" title="My Twitter" target="_blank" rel="nofollow"><img src="http://irfanhandi.files.wordpress.com/2012/06/twitter-64x64.png"></a></div>

3. Tombol Facebook dan Twitter pojok atas bawah :
kodenya :

<a style="position:fixed;bottom:45px;right:0;" href="http://www.facebook.com/irfan.handi" title="Berteman Yuk!!!" target="_blank"><img src="http://irfanhandi.files.wordpress.com/2012/05/fb.png" alt="" width="" height="" /></a>
<a style="position:fixed;top:0px;left:0;" href="http://twitter.com/#!/irfanhandi80" title="Follow Me" target="_blank"><img src="http://irfanhandi.files.wordpress.com/2011/09/twitter-irfanhandi80.png" alt="" width="" height="" /></a>

Kode Tombol-tombol sosial media diatas dapat Anda pasang dengan langsung meng copy-paste salah satu kode tersebut ke dalam Widget Text Sidebar Anda.

Keterangan :

• Ganti kode yang berwarna merah dengan dengan alamat akun facebook/twitter Anda,
• Ganti kode berwarna ungu untuk mengganti judul sesuai dengan keinginan Anda,
• Ganti kode yang berwarna biru dengan alamat gambar yang bisa Anda ganti sesuai keinginan Anda. Cara Upload/mengganti gambar bisa Anda baca pada tutorial sebelumnya, yaitu Cara Menambahkan Tombol Sosial Media di Sidebar WordPress.

Demikian Cara Menambahkan Tombol Sosial Media Melayang (Facebook dan Twitter) di WordPress ini, Semoga bermanfaat.