2012-08-31

Berbagi tips tentang template

di tutorial sebelumnya aku menjelaskan tentang template standarnya memiliki 3 bagian yaitu:
  1. Header
  2. Middle atau biasa disebut sebagai body.
  3. Footer
Nantinya akan ada lagi sub dari header, body dan footer. Untungnya untuk footer akan static dimana tidak akan/ jarang berubah. Untuk mempermudah pemahaman saya akan mulai dari footer dahulu. Footer biasa berisi :
  • link yang sering di tuju. Mirip seperti menu di header, tetapi kondisinya bila user sudah sampai bawah (biasa mobile), mereka tidak perlu menuju (scroll) kembali ke atas untuk menekan tombol home, about me dan lain-lain.
  • Lisensi.
  • Copyright
  • dan lain sebagainya.
Di template yang terbaru saya lihat, malahan tidak ada lagi footer? atau malah footernya bersifat optional. Tentu saja saya melihat ini di model web bukan mobile. Apalagi model dari template yang saya lihat malah hanya 2 yaitu header dan body. Footer malah tidak ada karena headernya bersifat melayang dan berada di atas. Namun ini masalah kesukaan orang jadi tidak perlu banyak dikomentari.
Berbelok pada penjelasan template, saya menemukan bahwa yang paling sering berubah adalah body. Dimana body terdapat konten yang bersifat dinamis. jadi bisa dibilang dari yang sifatnya tidak berubah hingga sering berubah adalah:

  • Footer
  • Header dan
  • Body
saya mengambil ini dari template yang saya buat. Sebenarnya tugas dia adalah meminta template. Tetapi saya baru menyadari bahwa template yang saya buat seharusnya tidak dibuat jadi 1 HTML. Melainkan menjadi PHP sebanyak minimal 3 atau lebih.

Baik ini ceritanya. Template yang kubuat seperti tertulis di atas terdiri dari Header, Body dan Footer. Dimana body yang akan sering berubah.
Tetapi saya baru menyadari bahwa yang namanya header selalu tidak berubah demikian footer. Hal yang sering berubah dari header adalah link mana yang akan berwarna berbeda (warna dan ukurannya berbeda) sebagai dasar bahwa link tersebut adalah yang sedang dibuka saat ini.

Masalah terjadi saat dia melapor bahwa file A, headernya bermasalah. Dimana headernya memakai font yang salah! Ditambah lagi css yang dipanggil juga bertambah karena adanya slider didalamnya sehingga butuh pemanggilan CSS. Itu belum termasuk pemanggilan js yang lain karena ada JS yang harus di include agar tampilannya lebih bagus.
contoh slider

setelah saya perbaikin file A, barulah masalah baru muncul. ternyata dengan merubah file A, otomatis B-G harus di update headernya. Bisa dibilang saya harus edit file yang lain!! ini tentu merepotkan. Karena itu mulailah saya berfikir membagi templatenya dalam bentuk file-file php terpisah.

Jadi bisa dibilang saya membaginya dalam 3 file yang tentu saja nanti berkembang yaitu:
  • Header.php
  • Footer.php
  • body.php
index.php adalah file A yang saya maksud. didalamnya sebenarnya berisi script untuk untuk body. Karena struktur Body garis besarnya sama, maka index.php hanya memanggil body lalu melakukan update tampilan didalamnya.

Secara singkat isi dari index.php adalah sebagai berikut:
include header.php
include body.php
include footer.php
tetapi tampilan di atas hanya untuk tampilan kosong dan standar saja, perlu dijabarkan apa yang dimasukkan dan standarnya. Yang nantinya akan berubah seperti ini

$pos='index';
include header.php
/*
list apa yang akan dimasukkan ke body
lalu diletakkan di $str; (variable str) dan variable lain yang sesuai.
*/
include body.php
include footer.php
Kerugian dari cara ini adalah, saya akan menyerahkan padanya 5 file (index.php dan other.php tambahannya) atau bisa dibilang bukannya saya serahkan 2 file (file lain seperti css, js dan image tidak di hitung hanya file utama), saya akan menyerahkan banyak file.
Keuntungannya adalah saat ada masalah misal di header. Maka otomatis file lain akan terupdate sendiri (header), jadi ketika ada perbaikan saya tidak perlu edit semua file bersangkutan dan itu akan menghemat pekerjaan.
"berangkat dari kesalahan dalam coding template"

2 komentar:

hadiansyah mengatakan...

saya pernah coba cara ngegabungin beberapa file ke dalam 1 file index.php dimana file index itu berisi file header.php, body.php, footer.php, nah masalahnya ketika saya panggil file index.php hasil nya header dan footer berada statik/tidak bergerak meskipun user melakukan scroll up/down jadi yang bergerak hanya bagian body nya saja, nah apa itu bisa di perbaiki??

Gustav mengatakan...

saat scroll? tampaknya ini udah bukan bentuk dasar template.. tp kl dari pernyataan kamu.. ini lebih kepada CSSnya.. jadi area headernya itu dibuat static berada di atas dan footer ada dibawah..

coba edit cssnya..
tp ada bagusnya kamu jgn bikin isi file header.php di index.php krn nanti index.php jadi gemuk dan kamu susah kl edit2 bila ada error.
memang cara manggil2 menyebalkan.. tp km bs terarah kl edit.. apalagi kl tiba2 ada kesalahan.. harusnya edit header.php.. eh bagian footer ngak sengaja kehapus.. (anggap km ngantuk)