Recent Post

Sponsored

Labels

addressbook Membuat Blogger Menjadi Mobile Version

Diposting oleh dev | , , | 87 komentar »

Blogger MobileSudah 4 bulan lebih blog ini tidak saya update karena sibuk mengerjakan beberapa web project yang sedang dikejar deadline, bahkan untuk membalas beberapa komentar yang masuk pun harus saya panding terlebih dahulu. Setelah 4 bulan tidak membuka account blogger tentu saja membuat saya sedikit "ketinggalan jaman" dengan perkembangan dunia blogging. Salah satu perkembangan yang membuat saya tertarik adalah dengan bertambahnya fitur mobile template yang dikeluarkan oleh blogger, menurut saya fitur ini merupakan fitur yang telah lama ditunggu oleh para blogger ditengah-tengah meroketnya pengguna smartphone di Indonesia.

Sayangnya, setelah saya coba untuk mengaktifkan fitur ini melalui setting blogger dan mencoba mengakses alamat blog saya melalui browser blackberry ternyata blogger belum mampu mendeteksi mobile browser secara otomatis, saya masih harus mengetikkan secara manual URL mobile version blog saya dengan menambahkan /?m=1 pada akhir alamat blog saya contohnya (http://www.devbook.net/?m=1). Saya juga kurang begitu paham apakah hal ini memang belum disupport oleh blogger atau karena blog ini menggunakan custom template yang bukan bawaan blogger. Karena rasa keinginan saya untuk membuat blog ini memiliki tampilan yang proporsional saat diakses melalui mobile browser akhirnya saya mencoba membuat sedikit barisan kode javascript untuk membaca mobile browser agar begitu blog diakses melalui mobile browser maka secara otomatis pengunjung akan diarahkan ke alamat mobile version blog kita.

Buat teman-teman blogger yang menginginkan blognya menjadi mobile version silahkan mengikuti beberapa langkah dibawah ini:
1. Login blogger kemudian masuk ke menu Settings kemudian pilih menu Email & Mobile


2. Pada pilihan Mobile template klik pada "yes, on mobile device, show the mobile version of my template", teman-teman blogger juga bisa mencobanya terlebih dahulu dengan mengklik mobile preview. Setelah selesai jangan lupa mengklik "Save" untuk menyimpan settingan.

Setelah selesai dengan settings blogger sekarang kita tinggal menambahkan beberapa kode javascript di template kita agar begitu pengunjung mengakses blog kita melalui mobile browser maka pengunjung akan diarahkan ke template mobile version blog kita.
1. Pilih menu Design >> Edit HTML

2. Masukkan kode dibawah ini tepat diatas kode <b:skin>
<script src='http://jqueryjs.googlecode.com/files/jquery-1.3.2.min.js' type='text/javascript'/>

<script src='http://viemonsta.googlecode.com/files/dev_mobile_for_blogger.js' type='text/javascript'/>
NB: bagi teman-teman blogger yang sudah menggunakan jquery di template blognya maka teman-teman cukup mengcopy code yang berwarna hitam.

3. Save Template

Setelah itu silahkan coba akses blog teman-teman melalui mobile browser seperti blackberry, iphone ataupun opera mini. Semoga sedikit tips diatas bermanfaat buat teman-teman blogger semua. Have nice blogging :)

Related Posts by Categories

Silahkan klik di sini untuk membaca melalui feed reader anda. Atau masukkan alamat email anda di kolom dibawah ini untuk berlangganan artikel DevBook.net langsung ke alamat email anda.

feed

Page copy protected against web site content infringement by Copyscape

Ada 87komentar ke “Membuat Blogger Menjadi Mobile Version”
dev said...
 date:

Test kirim komentar lewat handphone :D

Herdoni Wahyono said...
 date:

Kode diatas ketika kami masukkan ke kolom edit template 'Info Seputar Kita' tidak mau di save. Namun ketika "text/javascript"> kami tambahkan / sehingga menjadi 'text/javascript'/> baru direspon oleh blogger. 'Perubahan Anda telah disimpan'. Trims tutorialnya Sobat. Salam blogger. Sukses selalu.

dev said...
 date:

@Herdoni: terima kasih koreksinya mas, memang kemarin saya copy dari page source lewat mozilla blog saya :D
sekarang sudah saya benarkan..

Beben Koben said...
 date:

oh ternyata ada script buat redirectnya jg yah...hihihihi
mangtab nich \m/

eko said...
 date:

mantapp sob, ngomong2 gaya kotak komentnya dapet dari mana. gokil : D
follow back yaa : )

anak-nias said...
 date:

thanks gan infonya.. ane rada bingung settingannya, untung nemu disini :)

Izul said...
 date:

blog ini jg dpasang script diatas ya! Akibat script diatas jika dlihat dari browser mobile, blog tdak bs dlihat versi aslinya, meski sudah dklik "view web version"blog ini jg dpasang script diatas ya! Akibat script diatas jika dlihat dari browser mobile, blog tdak bs dlihat versi aslinya, meski sudah dklik "view web version"

suarakamu said...
 date:

Test sekali lagi :)

dev said...
 date:

@beben & anak-nias: sama2 makasih juga kunjungannya :) mdh2an bermanfaat ya..

@eko: gaya kotak komentar sebenernya iseng2 aja biar pengunjung ga boring sama tampilan standart blogger :D klo mau coba bisa googling tentang jquery superbox..

@izul: iya dgn menggunakan script ini memang tampilan asli tdk bisa terlihat di mobile browser karena script langsung meredirect mobile browser ke tampilan versi mobile. Tp tentu saja sangat membantu pengunjung yg mengakses blog kita lewat mobile browser, selain tampilannya yg proporsional di mobile browser, kecepatan loading juga pasti lebih cepat..
Mungkin ada masukan dan solusi yg lebih baik? silahkan dishare :)

Gaptek said...
 date:

q jg prnh make skrip direct semcm ini , tp ternyata dianggap keseringan melakukan direct ke link laen / trafik mencurigakan.
Alhasil blogkq jd gak bs diakses sama skali kl dbuka lwat hp,
Padahl kan directnya ke mobile blogger jg, tp tetap berbhy, he.

dev said...
 date:

@gaptek: kok saya baru denger kasus kaya gini ya :D coba cek di kode js yang dulu dipake..mungkin kesalahannya ada disana atau mungkin karena browser handphonenya dimatikan javascriptnya.

blog item said...
 date:

mantap mas artikelnya,,siap untuk langsung dicoba,,

mery said...
 date:

keren artikelnya aku coba bisa kok diblogku yang freegreats.blogspot.com tnx yah buat om momod artikelnya berguna bgt .

Izul said...
 date:

mungkin akan lbih baik kalo view web version msih bisa berfungsi. Jd pengunjung mobile ttep bs tahu wujud asli blog kita

Ririn Rimayanti said...
 date:

two thumbs up buat artikelnya..bgus bgt...
makasih......^^

dev said...
 date:

@all: semoga bermanfaat ya :)

@Izul: kendalanya blogger kan tidak mengijinkan kita menambahkan programming, tidak seperti wordpress.org yang bisa dicustomize sesuka kita.
mungkin blogger akan mengeluarkan fitur seperti itu kedepannya karena mobile template yg sekarang masih dalam status beta.

onqie said...
 date:

Waah menarik niih ..
Dunia blogging makin asikk ya om..
Dh lama jg g ngblog ...
Sibuk dagang ..

dirtyraspberry said...
 date:

Gak bisa web view lagi...?
Gan minta info...
tau cara biar widget/menu nongol juga di versi mobile ga...?

Oalld said...
 date:

kalo pake script ini diblog, traffic dari pengunjung yang menggunakan Opera mini ke track gak sama Google Analytic? :) Thanks Infonya

Admin said...
 date:

thanks tutor ya boy

ananda said...
 date:

alus euy make lightbox nya ieu teh? bagi script na aya teu brow?

Ande said...
 date:

skrg ud bs otomatis tnpa js lg y kang hhi.. Tp ane pnh liat blog mobile view m=1 na d edit bkn tmpilan default lg ..background wrn item jd tmpilan touch .keren skrg ud bs otomatis tnpa js lg y kang hhi.. Tp ane pnh liat blog mobile view m=1 na d edit bkn tmpilan default lg ..background wrn item jd tmpilan touch .keren

YOGYAKARTA said...
 date:

wow this really good blog content
visit : http://uii.ac.id

Wallpaper Persib Bandung said...
 date:

trims tutor nya mas,kebetulan lg nyari,sekarang mau dipraktekan

deari widodo said...
 date:

slamat sob anda dapet award slahkan diambil

zuLiG said...
 date:

wah ud otomatis yah jdi gak perlu lagi pake tambahan :D

eko susilo said...
 date:

Wow baru lihat form komentar yg menaraik (maaf jauh dr tema), salam kenal dr saya ya gan....

Belajar Marketiva said...
 date:

mkasih infonya mas,,kebetulan lg nyari nih :)

Tiliyas said...
 date:

thanks mastah..
tapi udah dari dulu blog saya pake mobile:D

widodo said...
 date:

tambah manteb aja sob udah lamanih gak berkunjung kesini

Novera said...
 date:

mantap mastah, tapi sekarang udah bisa otomatis yah tinggal ceklis aja lg:)

Cara Membesarkan said...
 date:

makasih... tutorialnya, saya coba dulu.

Bang Oji said...
 date:

wah pke javascript
kra2 blognya berat gk ya ?

Seputar_Software said...
 date:

I admire your piece of work, thankyou for all the good posts .
Ban Terbaik di Indonesia GT Radial

StofMaps said...
 date:

makasi untuk infonya... menarik dan bagus

syaem said...
 date:

sipp gan

CaraJual ulsa said...
 date:

pengetahuan baru bagi aq..sepertinya bermanfaat ya..

rusydi hikmawan said...
 date:

saya udah coba neh. tapi sayangnya gak punya hape, jadi gak tahu gimana tampilannya, hehehe

Zhw Download Center said...
 date:

Link sudah terpasang di blog saya.
silahkan cek http://zhw-downloadcenter.blogspot.com/

ditunggu backlink nya :)

cerita anak kost said...
 date:

wah mantap ni gan, bisa fersi mobile. ane coba dulu ya gan. makasih sharenya.

tips bisnis online said...
 date:

keren,,coba dulu ah,

Ahyar said...
 date:

Makasih nih devbook.net. saya terapin di blog saya dan succeded. Thx!

adi susanto said...
 date:

wah ini ni ..yang lagi di cari malahan ketemunya disi makasih gan infonya ..

Tips Simple said...
 date:

Alhamdulillah script jquery-nya sudah tersetting di template blog saya
trims buat info dan tutorialnya

Lust and Love said...
 date:

WAH BRO TUTORIALNYA OKE BANGET,, SOB BANNER SOBAT uda masuk di blog aku, mohon verifikasinya agar jika sobat berkenan, banner/link blog aku bisa masuk ke blog sobat.. hehehe.. thanks ya. salam kenal.

seribuan satu said...
 date:

thanks atas infonya kak...

Trica Jus said...
 date:

salam kenal gan ,sukses selalu yah, ku tunggu dah kunjungan baliknya :D

Trica Jus said...
 date:

salam kenal gan , sukses selalu dah, ku tunggu yah kunjungan baliknya :D

obat darah tinggi herbal said...
 date:

bagi2 kata bijak gan, semoga bermanfaat

================================================
Hidup itu maju kedepan! Bukan mundur ke belakang! Lupakan yg telah berlalu! Jadikan ia patokan untuk lebih baik dimasa depan.

obat penyakit asam urat said...
 date:

Aku kasi satu Motivasi ea ..

Hidup itu Akan terasa indah , apabila disaat kita hidup , kita mampu menerima kekurangan orang laen dan menyalurkan kelebihan kita untuk membantu orang lain .. :D

semoga bermanfaat , salam kenal :D

jus kulit manggis said...
 date:

berbagai Kata Kata Mutiara Mario Teguh gan
Orang-orang yang berhenti belajar akan menjadi pemilik masa lalu. Orang-orang yang masih terus belajar, akan menjadi pemilik masa depan.

semoga bermanfaat dan di terima yah :D

obat penyakit jantung alami said...
 date:

ih waw !

Phạm Minh Tâm said...
 date:

( Thank blog for you great - http://www.vatinam.net )

Trica Jus said...
 date:

berbagi kata kata indah gan,
Orang yang gagal selalu mencari jalan untuk menghindari kesulitan, sementara orang yang sukses selalu menerjang kesulitan untuk menggapai kesuksesan.
semoga bermanfaat dan dapat di terima yah :D , salam kenal dan sukses selalu ya :D

campor bawor said...
 date:

salam kenal gan ,sukses selalu yah, bila ada waktu knjungi balik ya gan salam blogger

jus kulit manggis said...
 date:

berbagi Kata Kata Motivasi
Bahagia dan memilih sendiri jalan hidup adalah sesuatu yg harus kamu sadari. Jangan biarkan seorangpun yg menentukannya untukmu.
semoga bermanfaat dan ku tunggu kunjungan baliknya ya :D

obat darah tinggi herbal said...
 date:

berbagi Kata Kata Motivasi
Senyumlah, tinggalkan sedihmu. Bahagialah, lupakan takutmu. Sakit yg kamu rasa, tak setara dengan bahagia yg akan kamu dapat.
Air mata tak selalu menunjukkan kesedihan, terkadang karena kita tertawa bahagia bersama sahabat terbaik kita.
semoga bermanfaat dan dapat di terima :D. ku tunggu kunjungan baliknya gan :D

obat kista herbal said...
 date:

so nice its content

petuboy said...
 date:

Thks mas brOO tips tutornya...!

obat rematik herbal said...
 date:

liket

Ulan News said...
 date:

nice info gan, ijin sedot xD

Senja Berita said...
 date:

wew mantap, salam kenal sob :D

cara menghilangkan bekas jerawat said...
 date:

liked

penyembuhan hepatitis c said...
 date:

so nice this content

mp3 download said...
 date:

thanks for explaining that.. blogger indonesia go to internasional.. here we go...

obat kanker herbal said...
 date:

Berbagi Kata Kata Motivasi
Jangan Pernah Menghitung Kerugian Karena Akan Membuat Kita Malas Untuk Membangun Kembali Usaha Yang Rugi Tersebut. Kerugian Cukup Sebagai Bahan Instropeksi Diri Agar Kita Tidak Jatuh Pada Lubang Yang Sama.moga bermanfaat salam kenal.

Pengobatan Kanker Kelenjar Getah Bening said...
 date:

sip... makasih

jus manggis murah said...
 date:

memang apa keuntungannya

obat manggis herbal said...
 date:

nice post gan

obat radang sinusitis said...
 date:

semoga artikelnya bermanfaat

Free domain Asli Indonesia said...
 date:

oooo Baru tau, kalau mau versi mobile, harus pakai kode gituan.

Mas Aan said...
 date:

makasih udah share trik ini gan...

abicom said...
 date:

keren sob,,,
lanjutkan!!!!!

odoy said...
 date:

mantapp sob, ngomong2 gaya kotak komentnya dapet dari mana. gokil : D
follow back yaa

rida said...
 date:

wah mantap ni gan, bisa fersi mobile. ane coba dulu ya gan. makasih sharenya.

yani said...
 date:

nice post.,.,

warungjamtangan said...
 date:

mas, kalau membuat blog dengan alamat di awali ( m. ) bukan ( www ) bgaiamana ya? contoh : m.tabloidpulsa.co.id,. alamat itu bisa dibuka di web brwoser komputer..trims

apk said...
 date:

makasih untuk tutorialnya bang dev...
sangat membantu sekali

bestagaric said...
 date:

Thanks infonya gan...
sangat bermanfaat

kunjungi web sy ya
bestagaric
obat maag kronis
obat maag untuk ibu hamil

Adu gadget said...
 date:

Makasi ya mas gan..tutorial membuat blog menjadi mobile version sangat membantu ane,,,, salam hangat

Halo Muda said...
 date:

Kalau saya sih mending pakai theme yang responsive, ayodeal.

deric santoso said...
 date:

we.. baru tau ane gan. makasih ya inpo nya

Tanda tanda Kehamilan
Spesifikasi Samsung Galaxy S6
http://breaktime.co.id/

harga sepeda mudah dan berkualitas said...
 date:

wew.. mantep juga nih tipsnya..
aku coba dulu gan..makasih bnyk :D

tentang ibu
beragam manfaat

Bahaya Minum Kopi Bagi Ibu Hamil said...
 date:

wowwww kereeeen

Cara Mencegah Kehamilan Tanpa KB Katalogibu.com said...
 date:

wahhh keren banget gann!

cara menguruskan badan gorrygourmet.com said...
 date:

waaaah keren bingitttt

Toko Wallpaper Dinding Murah Jakarta Decorindoperkasa.com said...
 date:

waaah kereeen


leave comment
back to top
comment notes

Post a Comment

devbook.net