Sunday, August 11, 2013

Cara mengedit template web PHP


Pendahuluan
Dalam membuat sebuah web, selain kita membuat sendiri templatenya dengan bantuan script CSS. ada cara cepat yang bisa kita lakukan yaitu dengan mengedit sebuah template web. template diibaratkan sebuah “kulit” yang langsung dilihat oleh user atau pengunjung. sehingga kita harus pandai-pandai dalam menentukan template sebuah web yang sesuai dengan isi atau content dari web kita secara keseluruhan.
Tahap Persiapan
Misalnya kita membutuhkan efisiensi waktu, tidak mau di pusingkan dengan pembutaan script template CSS, lebih konsentrasi pada core system atau content yang disajikan. maka pilihan kita jatuhkan pada template web gratisan.
banyak sekali situs penyedia templateweb  gratis yang bertebaran di internet. misalnya kita mencari di google dengan kata kunci Free CSS templates maka akan muncul situs-situs seperti dibawah ini :
atau jika ingin lebih efektif, anda bisa menggunakan google image http://images.google.com/ dengan kata kunci misalnya template web. maka anda bisa langsung melihat tampilan dari template. dan pilih salah satu gambarnya untuk menuju ke situs yang menyediakan template tersebut.
Tahap Selanjutnya
  1. Misalnya kita menggunakan situs http://www.freecsstemplates.org/ untuk mencari teplate kita.
  2. Setelah menemukan template yang bagus, kita dapat men download nya. misalnya http://www.freecsstemplates.org/preview/solutions/
  3. Setelah di download, simpan di htdocs dengan nama folder sesuai keinginan anda. (saya asumsikan anda sudah mengenal XAMPP atau aplikasi untuk mengembangkan web dengan PHP)
Tahap Pengaturan

  1. Setelah file template web di ekstrak, maka buka file index.html sebagai file untuk homepage atau halaman utamanya. Anda bisa membuka filenya dengan editor dreamweaver. dan anda juga bisa mengganti ekstensi filenya dengan PHP (index.php). karena selanjutnya kita akan membuat sebuah web menggunakan bahasa pemrograman PHP.
  2. Tahap selanjutnya adalah dengan memisahkan per blok coding CSS dari file index.php. misalnya blok coding untuk menu di pisahkan menjadi menu.php, blok coding untuk isi dipisahkan menjadi isi.php. nantinya file-file tersebut akan di include kedalam file index.php
  3. bagian terpenting ada pada file isi.php, karena konsep dari template yang kita gunakan adalah memanggil (include) masing-masing halaman file content kedalam halaman index.php sesuai dengan URL yang dipanggil melalui halaman menu.php
  4. Jika coding di dalam file index.php sudah di pisah-pisahkan menjadi file menu.php dan isi.php,  maka hasilnya sebagai berikut.
Tahap Coding
Buka file menu.php dan edit menjadi seperti ini :
<ul>
<li>
<h2>MENU UTAMA</h2>
<ul>
<li><a href=”?page=home”>Home</a></li>
<li><a href=”?page=profil”>Profil</a></li>
<li><a href=”?page=gallery”>Gallery</a></li>
<li><a href=”?page=katalog”>Katalog</a></li>
</ul>
</li>
</ul>
Buat dan buka file isi.php kemudian ketik coding nya :
<?php
$page=htmlentities($_GET['page']);
$halaman=”$page.php”;
if(!file_exists($halaman) || empty($page)){
include “home.php“;
}else{
include “$halaman“;
}
?>
Buka file home.php dan edit seperti ini :
<div>
<h2><a href=”#”>Welcome to my Blog </a></h2>
<p><em>Sunday, April 26, 2009 7:27 AM Posted by <a href=”#”>Someone</a></em></p>
<div>
<p>Selamat datang di template web. semoga bermanfaat untuk anda semua :) </p>
<div><a href=”#”>Full Story</a></div>
</div>
</div>
Untuk halaman file profil.php, gallery.php, katalog.php silahkan copy paste file home.php menjadi masing-masing file tersebut dan ubah isinya sesuai dengan kebutuhan. untuk selanjutnya content bisa diambil dari database.
Download
http://www.4shared.com/file/yfoTIwFI/template_web_ri32.html
Sekian tutorial sederhana ini saya buat, semoga bermanfaat untuk anda semua…aamin

No comments:

Post a Comment