Mohon Tunggu Proses Memuat Konten Halaman

Terbaru

9
Tgl. 20 April 2012

Memasang Widget Blogger Follow Button Pada Blogspot Versi Mobile

Sebagai seorang pengguna internet aktif sekaligus pengelola sebuah blog, tidak jarang saya menggunakan perangkat seluler dalam mengakses i...

Ilustrasi Tombol Follow Blogger
Sebagai seorang pengguna internet aktif sekaligus pengelola sebuah blog, tidak jarang saya menggunakan perangkat seluler dalam mengakses internet, dalam hal ini adalah telepon seluler yang lebih populer disebut dengan istilah ponsel atau HP untuk melakukan kegiatan browsing maupun blogwalking. Pengalaman browsing dengan menggunakan ponsel memang tidaklah semudah seperti bila menggunakan komputer, karena sebuah situs atau blog akan ditampilkan dengan tampilan serba minimalis. Salah satunya adalah dengan tidak dimunculkannya berbagai widget yang umumnya akan tampil bila dibuka dengan menggunakan komputer, termasuk diantaranya adalah gadget Google Friend Connect yang dapat digunakan untuk mem-follow atau mengikuti sebuah blog.

Seringkali saya merasa kesulitan ketika ingin mem-follow atau mengikuti sebuah blog yang saya buka dengan memakai perangkat seluler, karena untuk mengeklik tombol follow terpaksa harus membuka situs atau blog tersebut dalam tampilan web. Belum lagi bila ternyata loading atau penayangan halaman blog cukup berat, yang akhirnya akan semakin mempersulit lagi ketika ingin mengeklik tombol follow yang terdapat pada blog tersebut.

Atas dasar inilah akhirnya saya berpikir bukankah akan lebih baik bila tombol follow Blogger ini juga ditampilkan di blog versi seluler, sehingga akhirnya nanti akan mempermudah pengunjung yang memakai perangkat seluler dalam mengakses halaman blog untuk mem-follow atau mengikuti blog yang dimaksud. Kemudian saya pun berinisiatif untuk memasang Blogger Folow Button di halaman versi seluler dari blog ini, dengan harapan bila ada yang ingin mem-follow atau mengikuti blog ini, maka yang bersangkutan tinggal mengeklik tombol follow yang ditampilkan di halaman blog versi mobile, dan tidak perlu repot-repot menampilkannya dalam tampilan web.

Nah, terkait dengan pemasangan widget Blogger Follow Button pada blog versi mobile atau tampilan seluler, bila Anda juga ingin menerapkannya di blog yang Anda kelola, maka langkah-langkahnya adalah serupa dengan cara memasang tombol follow Twitter pada blog versi seluler dan juga serupa dengan cara memasang tombol like untuk Facebook Fan Page pada blog seluler, seperti di bawah ini.
  1. Login ke akun Blogger Anda.
  2. Pada ‘Dasbor Blogger’ klik nama blog Anda dan kemudian klik menu ‘Template’.
  3. Klik tombol ‘Edit HTML’ kemudian klik tombol ‘Lanjutkan’.
  4. Centang pilihan ‘Expand Template Widget’.
  5. Cari kode <b:includable id='mobile-main' var='top'>
  6. Kemudian perhatikan bahwa di bawah kode tersebut terdapat kode <div class='blog-posts hfeed'>. Nah, sisipkan kode berikut ini tepat di bawahnya.
    <a href="http://www.blogger.com/follow-blog.g?blogID=944413042420217262" target="_blank"><img src="https://lh4.googleusercontent.com/-w9eYnIbsNVo/T5A9BGa7r0I/AAAAAAAAAbI/J0EE4Y502lY/s800/Tombol%2520Follow%2520Blogger.PNG"/></a>
    Catatan: Sebelum template disimpan, ganti terlebih dulu 944413042420217262 dengan ID blog Anda.
  7. Simpan template Anda.

Sehingga akhirnya bila halaman blog dibuka dengan memakai perangkat seluler, maka Blogger Follow Button akan tampil seperti yang tampak pada gambar di bawah ini.
Tampilan Tombol Follow Blogger Pada Blog Seluler
Screenshot: eltelu.blogspot.com

Namun bila Anda ingin memasang Blogger Follow Button, Twitter Follow Button, dan Facebook Like Button sekaligus, maka Anda dapat menggunakan kode di bawah ini sebagai pengganti kode yang terdapat pada langkah nomor 6 (enam).
<div style='-moz-border-radius: 7px 7px 7px 7px; background-color: #599ad6; border: 1px solid rgb(33, 33, 33); height: auto; margin: 0px; overflow: auto; padding: 4px; text-align: center; width: auto;'>
<a href='http://www.blogger.com/follow-blog.g?blogID=944413042420217262' target='_blank'><img src='https://lh4.googleusercontent.com/-eguBrGITq44/T5BLmRWquYI/AAAAAAAAAb4/T8ONJ3MgvxE/s800/Tombol%2520Follow%2520Blogger.PNG'/></a> <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><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=85&amp;show_faces=false&amp;action=like&amp;colorscheme=light&amp;font&amp;height=20' style='border:none; overflow:hidden; width:100px; height:20px;'/>
</div>
Catatan: Sebelum template disimpan, ganti terlebih dulu 944413042420217262 dengan ID blog Anda, semarbingung dengan nama akun Twitter Anda, dan semarbingungweblog dengan nama akun Facebook Fan Page Anda.



Suka? Bagikan artikel ini kepada teman - jaringan Anda.
Label: , .
Silakan klik di sini untuk mengeposkan komentar Anda. Jika Anda ingin membaca artikel lain yang terdapat pada blog ini, maka dapat Anda lakukan dengan cara membuka laman daftar isi. Catatan: Komentar balasan hanya diprioritaskan untuk pertanyaan dan atau pernyataan yang diposkan dengan memakai formulir komentar Blogger.
Admin
Terdapat 9 komentar untuk artikel ELTELU yang berjudul Memasang Widget Blogger Follow Button Pada Blogspot Versi Mobile .
21/04/12 19.21 O

wah bisa ya gan, mantap nie, di coba ah.. tenkyu ya.

rewinsatria
23/04/12 12.14 O

gw coba ah

30/05/12 09.09 O

Sob, kok yang punya saya gak muncul-muncul juga ya?
Apa ya penyebabnya?

30/05/12 09.55 O

@Indra KrisnadiBisa jadi karena Sobat belum menyesuaikan pengaturan untuk tampilan mobile.

Jadi gini, untuk menerapkan teknik ini, maka setelan untuk tampilan mobile terlebih dahulu harus diubah ke pilihan 'Tersesuai'.

Nah, untuk lebih jelasnya silakan Sobat buka dan baca dulu artikel saya yang berjudul "Cara Memasang Gadget Pada Template Blogspot Versi Seluler".

30/05/12 17.52 O

Sob, Blognya sudah lama saya aktifkan untuk Versi Mobilenya, namun kok tetap tidak muncul ya?
Bagaimana caranya?
Thx

31/05/12 04.10 O

@Indra KrisnadiCoba Sobat pelajari lagi dengan cermat tutorial yang ada. Dan coba Sobat praktikkan pada blog yang berbeda sebagai uji coba. Nah, selanjutnya jika sudah berhasil, tinggal menerapkan pada blog yang utama.

21/09/13 12.38 O

Wah makasih banyak om, sekarang versi mobile saya sudah ada widget follownya, thanx banget om

25/09/13 13.16 O

@cibuntublogger.comSyukurlah bila demikian Sob. Dan saya rasa sepertinya kenal dengan template yang Sobat gunakan. :)

06/10/13 19.10 O

@AYAHE MELA Iya sob itu templatenya mas sugeng

o

  • .Ragam Tumbuhan
  • .Unik & Langka
  • .Aneka Buah
  • .Produk Sederhana
  • .Karya Seni
  • .Tempat Wisata
  • .Ragam Kegiatan
  • .Aneka Bunga
  • .Hewan & Serangga
GALERI
KIRIM MASUKAN
E L T E L U
Semar Bingung's Weblog