Bismillah..
Baru  kali ini saya berkesempatan menyelesaikan misi membuat dan merekonstruksi template jadi dan berfungsi 100 persen. Biasanya, baru ngedit kode dikit, sudah diganggu bocah ngajak main kuda-kudaan. Maklum, sayang anak.
Nah, kali ini saya akan berbagi dengan kawan pembaca sekalian, sekaligus menuntaskan keingintahuan kalian tentang bagaimana membuat web mobile seperti detik mobile itu.
Pertama yang harus kawan catat, bahwa saya merekonstruksi website detik, lalu mengujinya page per page sehingga bisa berjalan sebagaimana mestinya.
Dalam misi ini, saya menyiapkan alat dan bahan sebagai berikut.

  •  Smartphone samsung galaxy ACE S5830
  • Kartu GSM beserta paket internet 3
  • Aplikasi andorid Offline Browser

 
 
 Langkah Kerja
1. Downloadlah aplikasi android “Offline Browser” di googleplay, Install dan Jalankan

  1. Mulai menjalankan aplikasi “Offline Browser” untuk mendownload halaman detik mobile. Klik tombol “OK & Dwnld”, jika sudah 100%, klik logo sebelah kanan, (parsing html).
  1. Jika sudah selesai semua, maka file download dari m.detik.com itu ada di kartu SDCard anda, buka aplikasi “My Files”, lalu point ke “offline Browser” > pilih Cache. Nanti akan ada folder dengan angka.

  2. Pindahkan folder cache tadi ke komputer, maka bersiapkan langkah pembedahan.

Folder cache tadi merupakan kumpulan file yang didownload dari m.detik.com. isinya page html, image,javascript dan juga css. Nah, yang penting cssnya itu yang akan kita ambil.
setidaknya seperti yang terlihat di image dibawah ini, style beragam detik dapat. misalnya detik ramadan, detik bandung, detik foto dll.

dalam contoh ini, saya cuman ambil dua file saja. dua css yang saya ambil, saya salinkan ke file baru bernama  style.css. file inilah yang nanti dipanggil untuk menangani css.

  1. Untuk melakukan rekosntruksi, kawan harus paham hirarki wordpress. dan bagi kawan yang belum mengerti cara merekonstruksi dari HTML ke wordpress silakan belajar digugel, jgn malas mau lgs jadi àja. Nah, dalam contoh ini saya hanya membuat theme dengan komposisi
  •  header.php
  • footer.php
  • single.php
  • index.php
  • archieve.php
  • style.css

 
untuk langkah 5 diatas, kawan harus paham betul kode apa saja yang harus dimasukkan. sebagai contohnya, untuk header.php saya buat kodennya seperti ini.














 
 
 
 
 
 









<?php wp_title(' - ', true, 'right'); ?> |M| 








semua file harus kawan jadikan dalam satu folder, yang nantinya akan jadi theme.

  1. selanjutnya, wordpress saya pasang plugin Any Mobile Theme Switcher, plugin ini berfungsi untuk mengubah theme untuk pengunjung yang menggunakan smartphone.
  1. Hasilnya seperti ini. Atau Cek Lewat Android KAwan disini