Cara Membuat Blog Menjadi Versi Mobile

Cara Membuat Blog Menjadi Versi Mobile

February 5, 2010 by isnuansa

in : Blog / 58 Comments

Beberapa waktu yang lalu saya sudah pernah mencoba membuat blog ini menjadi versimobile. Awalnya, hanya gara-gara loadingnya yang lama ketika dibuka melalui hand phone saya yang keluaran lama itu. Saya coba sendiri otak-atik berdasarkan baca postingan teman sana-sini, gagal!

Akhirnya saya kapok. Bosan gagal melulu. Belom ada tutorial yang pas bisa saya praktekkan.

Sampe akhirnya, kemarin saya chatting dengan David, blogger yang pernah menulis sebagai Guest Blogger di blog ini. Namanya ada di blogroll sidebar blog ini, tuh! 

Jangan tanya saya berapa lamanya kami chatting. Beberapa jam lah, pokoknya. Malah sempet saya tinggal makan siang segala.

Alasan lain, kemarin lusa saya buka analytics saya, terkaget-kaget dengan kenyataan bahwa sudah 15% jumlah pengakses blog ini menggunakan Opera Mini! Itu berarti, bulan ini saja sudah lebih 1.500 yang hadir dari hand phone. Wow.

Jika terus-terusan saya ‘paksa’ mereka membuka halaman yang ‘berat’, bisa gawat. Kabur lama-lama nantinya, bukan malah menjadi loyal.  Makanya saya langsung berusaha cari informasi untuk secepatnya bisa merubah blog ini menjadi versi mobile.

Ini nih, hasil chatting saya dengannya, sampe akhirnya blog ini sudah bisa dibuka dengan lebih ringan versi mobilenya. Yang awalnya harus berukuran sekitar 20kb, kini hanya 2 atau 3kb. Sangat signifikan perbedaannya. Jika nggak percaya, coba aja dibuka dari hand phone Anda. 

Nunik: udah mo oflen ga?
David: belum

Nunik: dari tadi aku buka blogmu tapi belom baca malah aku tinggal makan siang
David: lagi nyetting blogku supaya dia bisa dipublish via email, kenapa? hahaha dassar

Nunik: aku mo setting versi mobile tapi themeku ga bisa jadi harus ganti theme
David: gak usah ganti theme

Nunik: soalnya aku buka analitic, hampir 15% pembaca pake opera mini
David: betul. download aja plugin mobilepress atau wordpress mobile pack, punyaku pakai mobilepress. coba lihat ini tampilan mobilenya http://davidjuly.cz.cc?=mobile

Nunik: aku pernah coba tapi pluginnya nggak bisa dipasang error
David: horeeeeee…. aku berhasil posting dari email

Nunik: pake apaan?
David: bisa… apakah diblog kamu terinstall plugin WpEasy uploader? Plugin tersebut memudahkan kita untuk mengupload files, termasuk mengupload file plugin Aku posting dari email dengan mensetting pengaturan di menu Settings -> Writing

Nunik: pluginnya sih bisa dipasang tapi ada yang ga kompatibel kayaknya
David: Kompatibel kok. Plugin ini bekerja hanya bagi pengunjunng yang membuka blog kita dari browser mobile, macam HP, Opera Mini, UCWeb dsb

Nunik: iya, setelah aku pasang, aku liat via hape, tetep aja masih sama
David: saat dibuka dari PC, ia tampil dengan pesona PC.
Okay, sini biar aku bantu
hapus dulu plugin tersebut dari server kamu

Nunik: udah, akhirnya aku hapus tuh plugin
David: nah sekarang kamu upload file ini ke folder wp-content/plugins/ http://downloads.wordpress.org/plugin/mobilepress.1.1.4.zip
upload file itu.
Atau aku bantu uploadin?

Nunik: udah aku upload, trus?
udah diaktifin
David: Okay. Apakah penempatan penguploadannya sudah benar? Di folder ini kan? Wp-content/plugins

Nunik: yoi
David: Nah sekarang masuk ke http://isnuansa.com/plugins.php?plugin_status=inactive
maksudku http://isnuansa.com/wp-admin/plugins.php?plugin_status=inactive
Temukan plugin yang baru diupload. Namanya Mobilepress. Aktifkan plugin itu

Nunik: udah sip
Mobilepress Version 1.1.4 | By Aduity
David: betul. Tekan activate

Nunik: ok, udah
David: Nah sekarang masuk ke http://isnuansa.com/wp-admin/admin.php?page=mobilepress

Nunik: udah, trus
David: Isi kotak blog title dengan judul blog, blog description dengan tagline blog. Biarkan kotak Mobile Themes Directory terisikan oleh kata mobile-themes.

Nunik: trus, save changes?
David: betul

Nunik: udah
David: Pastikan pilihan “Force Mobile Site” berada pada posisi “No”
Sekarang buka http://isnuansa.com/?mobile
horeeee… berhasiil
berhasillll
Itu adalah tampilan blog isnuansa.com ketika dilihat dari HP atau Opera Mini

Nunik: tar dulu, aku coba buka lewat hape dulu ya…
David: Yup! Coba buka lewat HP

Nunik: Asyikkk…
Berhasil!
Trims ya…

David: sama-sama 

Nunik: Biasanya sekali buka halaman 20an kb, sekarang hanya 2!
David: betul.. dan tema ini sangat ramah dengan Google. Google kan punya search mobile. Blog kamu bisa sering tampil disana dengan menggunakan tema ini
Nunik: Yoi…
cup cup muah muah
bodoh banget aku ini
nginstal gitu aja nggak tahu caranya
Hihihihi

David: hehehehe…. Mau dibikin post via email juga? Biar bisa nulis sambil leyeh-leyeh di kamar?
Nunik: Padahal lewat analitik bulan ini saja hampir 2000 page view dari opera mini
semoga dengan dibikin mobile, nambah banyak lagi yg datang dari hand phone

David: Tapi untuk bisa melacak statistic isnuansa.com yang versi mobile ini, maka kamu harus memasukkan kode meta dari google analytic ke tema mobilepress
Nunik: doh, gimana caranya?
kalo soal posting dari email, jangan dulu deh
soalnya saya harus proof read beberapa kali sebelum publish
kalo lewat email, bawaannya pengen cepet2 mulu
15 menit

David: hahahah… Okay, untuk memasang kode analytic, masuk ke folder /wp-content/plugins/mobilepress/system/themes/default/header.php
dan tambahkan kode meta dari google analytic sebelum kode head

~~~

Buat yang pengen merubah blog menjadi versi mobile, bisa belajar dari chattingan saya dengan David di atas.