Rumahweb Journal

Cara Membuat Web Template Tanpa Table – Bagian 3

Setelah di bagian ke 2 kita belajar membuat file HTML dan CSS sederhana, pada panduan ini kami akan melanjutkan cara membuat web template tanpa table yaitu pada pengaturan layout dan mengisi content.

Pastikan Anda sudah membuat file HTML dan CSS, sesuai dengan artikel bagian ke 2. Sebelumnya, kita sudah menyinggung bahwa pada web template yang kita buat terdapat kode yang diawali dengan # dan diakhir dengan #. Tanda ini dijadikan penunjuk kepada engine bahwa #…# akan diganti dengan content tertentu.

Terdapat beberapa tanda #….#, yaitu:

  • #JUDUL_WEBSITE#, ini akan kita ganti dengan judul website.
  • #BLOCK_KIRI#, akan diganti dengan content untuk blok sebelah kiri, misalnya menu dan lain sebagainya.
  • #CONTENT#, akan diganti dengan content utama.
  • #BLOCK_KANAN#, akan diganti dengan content untuk blok sebelah kanan.

Kita tidak akan menggunakan database untuk menyimpan informasi letak content, melainkan dengan menyimpan content pada folder tertentu sebagai penggantinya. Misalnya content yang akan ditampilkan di blok kiri akan disimpan di folder kiri, content utama disimpan dalam folder content, dan content blok kanan disimpan dalam folder kanan.

Membuat Script PHP

Kita tentukan dulu content apa saja yang akan ditampilkan, misalnya:

  • Blok Kiri, nama folder kiri:
  • Menu Vertikal, dengan nama file menu-vertikal.php
  • Kotak Weblogin, dengan nama file kotak-weblogin.php
  • Content, nama folder content:
  • Home, dengan nama file home.php
  • Berita Terbaru, dengan nama file berita-terbaru.php
  • Blok Kanan, nama folder kanan:
  • Polling, dengan nama file polling.php
  • ShoutBox, dengan nama file shoutbox.php

Berikut ini kode program masing-masing file PHP:

Script Blok Kiri

Buatlah sebuah file dengan nama menu-vertikal.php dan simpan dalam folder kiri atau lokasinya seperti : kiri/menu-vertikal.php

Lalu isi file menu-vertikal.php dengan script berikut:

<?php
<ul>
 	<li><a>Menu 1</a></li>
 	<li><a>Menu 2</a></li>
 	<li><a>Menu 3</a></li>
</ul>
';
?>

[php]

‘;
?>;
[/php]

kiri/kotak-weblogin.php

[php]

WEBLOGIN

Username Password

‘;
?>
[/php]

content/home.php

[php]
Selamat datang di Web Saya
Silakan melihat-lihat dan ambil apa yang bisa diambil dengan suka cita, kami menyediakan free stuff, dan dengan girang hati kami sediakan untuk anda dengan percuma.
‘;
?>
[/php]

content/berita-terbaru.php

[php]
Berita 1
Disini berita 1, isinya bermacam-macam berita jadi satu, silakan baca. Mari, mari, kita baca.


Berita 2

Disini berita 2, apapun isinya tidak duanya ditempat lain. Baiklah silakan menikmati berita dari kami.
‘;
?>
[/php]

kanan/polling.php

[php]
Web siapa paling keren?
Pilih jawaban kamu, web siapa paling keren?

  • Sangat Setuju
  • Setuju
  • Ragu-ragu
  • Tidak Setuju
  • Sangat Tidak Setuju

‘;
?>
[/php]

kanan/shoutbox.php

[php]

ShoutBox

Nama Url / Email Pesan

Joko: Keren yah webnya, ajarin dunkz? [12-11-06 | 18:50]
Siska: Hmmm, lam kenal aja deh …  [11-11-06 | 08:30]

‘;
?>
[/php]

Kode program diatas hanyalah contoh, jadi tidak aplikatif.

Bersambung.

Bermanfaatkah Artikel Ini?

Klik bintang 5 untuk rating!

Rating rata-rata 0 / 5. Vote count: 0

Belum ada vote hingga saat ini!

Kami mohon maaf artikel ini kurang berguna untuk Anda!

Mari kita perbaiki artikel ini!

Beri tahu kami bagaimana kami dapat meningkatkan artikel ini?

VPS Murah Indonesia