Pada pembahasan kali ini kita akan memulai membuat tampilan utama website, penulis telah merancang tampilan ala kadarnya menggunakan libreoffice untuk memperkirakan seperti apa hasil akhir dari tampilan website nantinya.


pada gambar dapat dilihat bagian web ada 4 bagian utama, yaitu:

wrapper(lapisan paling luar dari rancangan tampilan)
header
kontenweb (didalam kontenweb baru terdapat sidebar dan konten)
footer
nb: untuk selanjutnya bagian-bagian dalam web (termasuk 4 bagian diatas disebut dengan ‘div’)

Langkah pertama yang harus dilakukan adalah mengubah file index.php (hapus semua skrip yang di buat pada pembahasan sebelumnya) hingga file index.php akan seperti ini:



jika selesai, selanjutnya jalankan di browser localhost/blog, maka hasilnya akan seperti dibawah ini…



hanya tulisan biasa. mengapa demikian? karena div yang telah kita buat belum tersentuh dengan css agar tampilan lebih cantik.
untuk meng css kan, maka buat file bernama style.css dalam folder css.
adapun isi dari file style.css adalah sebagai berikut:


selanjutnya ubahlah file index.php menjadi seperti di bawah ini…