Memasang Tombol Like Untuk Facebook Fan Page Pada Blog Seluler

Masih berkutat pada tombol like dan template blog untuk tampilan seluler, dalam artikel ini saya akan menguraikan cara memasang tombol like untuk Facebook Fan Page atau Halaman Penggemar Facebook yang nantinya dimunculkan dalam bentuk tombol di halaman blog versi seluler. Yang maksudnya adalah ketika halaman blog dibuka dengan memakai perangkat seluler, maka tombol like atau ‘Like Button’ yang menghubungkan Halaman Penggemar Facebook dengan blog yang kita kelola akan ditampilkan secara otomatis pada halaman blog untuk tampilan versi seluler, seperti layaknya bila halaman blog tersebut dibuka dengan menggunakan komputer.

Jadi, dengan merujuk uraian saya dalam artikel sebelumnya yang berjudul “Cara Memasang Kotak Penggemar (Like Box) Pada Blog Seluler”, bahwa sebenarnya kita juga dapat menghubungkan Facebook Fan Page dengan halaman blog untuk versi seluler, seperti layaknya menghubungkan Halaman Penggemar Facebook dengan halaman blog versi web. Dimana, bila pada halaman blog versi web dan juga  pada artikel sebelumnya yang berjudul "Cara Memasang Kotak Penggemar (Like Box) Pada Blog Seluler" dilakukan dengan memasang kotak penggemar atau ‘Like Box’, maka penerapan yang dilakukan di sini adalah dengan cara memasang tombol like. Hal tersebut dilakukan dengan pertimbangan untuk mempercepat penayangan atau loading halaman ketika dibuka dengan menggunakan perangkat seluler.

Dengan memasang tombol like di halaman blog versi seluler, maka akan mempermudah pengunjung untuk mengikuti Halaman Penggemar Facebook yang kita kelola walaupun menggunakan perangkat seluler dalam mengakses halaman blog. Ini artinya, pengunjung yang menggunakan perangkat seluler tidak perlu repot-repot menampilkan halaman blog dalam versi web atau membuka blog yang dimaksud dengan menggunakan komputer ketika ingin mengeklik tombol like untuk menjadi penggemar dan mengikuti pembaruan artikel pada blog yang kita kelola.

Selanjutnya, dalam hal memasang tombol like pada template blog untuk tampilan seluler, caranya adalah serupa dengan cara pemasangan like box pada halaman blog untuk versi seluler. Terlebih dulu Anda harus membuka Halaman Pengembang Facebook untuk mendapatkan kode plugin like button Anda, dimana langkah-langkahnya adalah sebagai berikut:

1. Buka halaman pengembang Facebook, dalam hal ini adalah dengan membuka URL http://developers.facebook.com/docs/reference/plugins/like/
2. Masukkan URL Halaman Facebook atau Fan Page yang Anda kelola kemudian tentukan setelan untuk tampilan like button. Dalam hal ini misalnya: mengatur layout, ukuran, warna, serta elemen lain yang akan ditampilkan pada like button. Untuk lebih jelasnya perhatikan gambar di bawah ini.
   
   Screenshot: facebook.com
   
   
3. Klik tombol ‘Get Code’ untuk mendapatkan kode plugin like button Anda, seperti terlihat pada gambar di bawah ini.
   
   Screenshot: facebook.com
   
   
4. Salin kode plugin untuk like button Anda, kemudian masuk ke ‘Dasbor Blogger’, buka menu ‘Template’, klik tombol ‘Edit HTML’, klik tombol ‘Lanjutkan’, dan klik kotak yang terdapat di depan pilihan ‘Expand Template Widget’. Dan selanjutnya cari kode <b:includable id='mobile-main' var='top'> untuk menyisipkan kode plugin tersebut.
5. Sisipkan kode plugin like button Anda diantara kode <div class='blog-posts hfeed'> dan <b:include data='top' name='status-message'/> seperti pada contoh di bawah ini.
   

   <b:includable id='mobile-main' var='top'>
       <!-- posts -->
       <div class='blog-posts hfeed'>
   
         <iframe src="//www.facebook.com/plugins/like.php?href=https%3A%2F%2Fwww.facebook.com%2Fsemarbingungweblog&amp;send=false&amp;layout=button_count&amp;width=85&amp;show_faces=false&amp;action=like&amp;colorscheme=light&amp;font&amp;height=21" scrolling="no" frameborder="0" style="border:none; overflow:hidden; width:100px; height:21px;" allowTransparency="true"></iframe>
   
         <b:include data='top' name='status-message'/>

6. Simpan template Anda

Kemudian, dengan menggunakan teknik tersebut, maka ketika halaman blog dibuka memakai perangkat seluler, tombol like atau ‘Like Button’ yang menghubungkan Facebook Fan Page dengan blog yang kita kelola akan ditampilkan di atas halaman posting seperti yang terlihat pada gambar di bawah ini.

Screenshot: eltelu.blogspot.com

Sementara itu untuk melihat hasil dari penerapan teknik tersebut dengan menggunakan komputer, dapat dilakukan dengan menambahkan ?m=1 di belakang URL artikel yang dibuka. Atau untuk lebih jelasnya silakan lihat contoh yang terdapat pada artikel dengan judul “Membuat Daftar Artikel Terkait Pada Template Seluler Blogspot”. Dan perlu diingat pula bahwa teknik ini hanya dapat digunakan bila setelan pada pilihan template seluler yang digunakan adalah ‘Tersesuai’.

UPDATE pada Minggu, 1 April 2012:

Seperti halnya memasang tombol like untuk Facebook Fan Page, Anda juga dapat memasang tombol Follow Twitter pada blog untuk tampilan versi seluler. Dan terkait dengan cara serta langkah-langkahnya,  silakan klik di sini untuk membuka artikel dengan judul "Cara MemasangTombol Follow Twitter Pada Blog Versi Seluler".