0 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 Pageatau Halaman Penggemar Facebook yang nantinya dimunculkan dalam bentuktombol di halaman blog versi seluler. Yang maksudnya adalah ketikahalaman blog dibuka dengan memakai perangkat seluler, maka tombol like atau ‘Like Button’yang menghubungkan Halaman Penggemar Facebook dengan blog yang kitakelola akan ditampilkan secara otomatis pada halaman blog untuktampilan versi seluler, seperti layaknya bila halaman blog tersebutdibuka 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 Pagedengan halaman blog untuk versi seluler, seperti layaknya menghubungkanHalaman Penggemar Facebook dengan halaman blog versi web. Dimana, bilapada halaman blog versi web dan juga  pada artikel sebelumnya yangberjudul "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 PenggemarFacebook yang kita kelola walaupun menggunakan perangkat seluler dalammengakses halaman blog. Ini artinya, pengunjung yang menggunakanperangkat seluler tidak perlu repot-repot menampilkan halaman blogdalam versi web atau membuka blog yang dimaksud dengan menggunakankomputer 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 membukaURL 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.
   
   Sumber: facebook.com
   
   
3. Klik tombol ‘Get Code’ untuk mendapatkan kode plugin like button Anda, seperti terlihat pada gambar di bawah ini.
   
   Sumber: 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=450&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:450px; height:21px;" allowTransparency="true"></iframe>
   
         <b:include data='top' name='status-message'/>

6. Simpan template Anda

Sumber: http://eltelu.blogspot.com/2012/03/memasang-tombol-like-untuk-facebook-fan.html#ixzz3qCTDr3CJ
Terimakasih bila Anda tetap menyertakan dan mencantumkan URL lengkap sumber artikel ini.

Read more

0 cara Memasang Tombol Follow Twitter Pada Blog Versi Seluler

           Seperti halnya pemasangan tombol Facebook Like, salah satu fungsi dan tujuan dari memasang tombol Followatau Ikuti adalah untuk mempermudah pengguna ketika ingin terhubungserta mengikuti akun Twitter kita. Dan mengingat bahwa tidak semuapengguna menggunakan komputer ketika mengunjungi blog yang kita kelola,maka untuk lebih mempermudah pengguna yang menggunakan perangkatseluler dalam mengikuti akun Twitter kita, salah satunya dapatdilakukan dengan memasang tombol Follow di halaman blog untuk versi atau tampilan seluler.

Cara pemasangan tombol Follow untuk halaman blog dalam tampilan versi seluler sebenarnya serupa dengan cara memasang tombol like untuk Facebook Fan Page pada blog seluler. Kita tinggal menyisipkan scripttertentu ke dalam template untuk menghubungkan blog dengan akun Twitterkita. Dimana langkah-langkahnya adalah seperti pada uraian di bawah ini.

1. Pertama, untuk mempermudah proses, login terlebih dulu ke akun Twitter Anda dan kemudian buka URL https://twitter.com/about/resources/buttons sehingga tampil halaman seperti gambar di bawah ini.
   
   Sumber: twitter.com *Klik pada gambar untuk memperbesar tampilan
   
   
2. Pilih jenis tombol yang akan digunakan. Dalam hal ini karena yang akan dilakukan adalah memasang tombol Follow, maka dari beberapa pilihan tombol tersebut yang dipilih adalah pilihan Follow, sehingga tampilan akan berubah menjadi seperti pada gambar di bawah ini.
   
   Sumber: twitter.com *Klik pada gambar untuk memperbesar tampilan.
   
   Langkah berikutnya adalah menentukan opsi untuk tombol yang akandigunakan, dalam hal ini adalah terletak pada pilihan ‘Buttonoptions’.  Dan selanjutnya salin kode yang diberikan oleh Twitter,dalam hal ini seperti yang tampak pada contoh gambar di atas.
   
   
3. Kedua, login ke akun Blogger Anda.
4. Pada ‘Dasbor Blogger’ klik nama blog Anda dan kemudian klik menu ‘Template’.
5. Klik tombol ‘Edit HTML’ kemudian klik tombol ‘Lanjutkan’.
6. Centang pilihan ‘Expand Template Widget’.
7. Cari kode <b:includable id='mobile-main' var='top'>
8. Kemudian perhatikan bahwa di bawah kode tersebut terdapat kode <div class='blog-posts hfeed'>. Nah, sisipkan script yang sebelumnya telah disalin dari Twitter tepat di bawah kode tersebut, seperti tampak pada contoh di bawah ini.
   

   <b:includable id='mobile-main' var='top'>
       <!-- posts -->
       <div class='blog-posts hfeed'>
   
         <a href="https://twitter.com/semarbingung" class="twitter-follow-button" data-show-count="false" data-show-screen-name="false">Follow @semarbingung</a>
   <script>!function(d,s,id){var js,fjs=d.getElementsByTagName(s)[0];if(!d.getElementById(id)){js=d.createElement(s);js.id=id;js.src="//platform.twitter.com/widgets.js";fjs.parentNode.insertBefore(js,fjs);}}(document,"script","twitter-wjs");</script>
   
         <b:include data='top' name='status-message'/>

   
   
   Namun bila sebelumnya Anda telah memasang tombol Like untuk Facebook Fan Page dengan menggunakan cara seperti yang diuraikan dalam artikel dengan judul “Memasang Tombol Like Untuk Facebook Fan Page Pada Blog Seluler”, maka script untuk tombol Followdapat langsung diletakkan tepat di belakang kode yang digunakan untukmemasang tombol Like pada blog seluler tersebut. Sebagai contohperhatikan kode di bawah ini.
   

   <b:includable id='mobile-main' var='top'>
       <!-- posts -->
       <div class='blog-posts hfeed'>
   
         <iframe allowTransparency='true' frameborder='0' scrolling='no' src='//www.facebook.com/plugins/like.php?href=https%3A%2F%2Fwww.facebook.com%2Fsemarbingungweblog&amp;send=false&amp;layout=button_count&amp;width=100&amp;show_faces=false&amp;action=like&amp;colorscheme=light&amp;font&amp;height=21' style='border:none; overflow:hidden; width:100px; height:21px;'/><a class='twitter-follow-button' data-lang='id' data-show-count='false' data-show-screen-name='false' href='https://twitter.com/semarbingung'>Ikuti @semarbingung</a>
   <script>!function(d,s,id){var js,fjs=d.getElementsByTagName(s)[0];if(!d.getElementById(id)){js=d.createElement(s);js.id=id;js.src=&quot;//platform.twitter.com/widgets.js&quot;;fjs.parentNode.insertBefore(js,fjs);}}(document,&quot;script&quot;,&quot;twitter-wjs&quot;);</script>
   
         <b:include data='top' name='status-message'/>
   
   
9. Simpan template Anda.

Sumber: http://eltelu.blogspot.com/2012/03/cara-memasang-tombol-follow-twitter.html#ixzz3qCU2xTzb
Terimakasih bila Anda tetap menyertakan dan mencantumkan URL lengkap sumber artikel ini.

Read more