Assalamualikum Wr Wb
Hello guys, welcome back with me di blog kesayangan kalian
Kali ini gue mau membahas tentang cara membuat template dengan program HTML dan PHP. Mungkin kalian agak asing dengan kata template. Apasih template itu??
Gue akan jelasin apaitu template sesuai dengan apa yang ada di otak gue oke.. hehe. Template itu adalah sebuah dasar untuk membuat suatu tampilan web. Pada umumnya template terdiri atas header, menu, konten, dan footer. Dengan membuat template kita akan dimudahkan dalam membuat konten yang ingin kita tampilkan karena kita tidak perlu lagi membuat desain webnya. Intinya kita hanya perlu mengisi konten yang ingin kita tampilkan.
Kurang lebih seperti itu penjelasan awal dari template biar lo mengetahui konsep dan fungsi dari template. Lebih baik kita langsung saja ke prakteknya okey, biar lo bisa lebih paham lagi tentang template.
Yang pertama kali lo harus buat adalah program pada PHP sebagai tampilan awal dari web yang lo buat. Contohnya seperti yang sudah gue buat dibawah ini:
Dengan program yang seperti itu maka tampilannya adalah seperti ini:
Pada kolom menu bisa kita lihat ada 5 list link yaitu, home, tabel, array, biodata, dan kontak. Misi kita selanjutnya adalah mengisi semua list dengan konten, yang mana kontennya akan ditampilkan di kotak yang berwarna biru. So Lets do it!!
mari kita awali dengan membuat program dari list link home. Program yang gue buat ialah seperti ini:
Untuk mengisi list linknya lo hanya perlu menyalin program dari tampilan awal sampai baris ke 26. Setelah itu isi baris selanjutnya dengan konten yang ingin lo tampilkan. Untuk tampilan dari program list link home adalah seperti ini:
Setelah itu kita akan mengisi list link Tabel dengan cara yang sama seperti sebelumnya dan program yang seperti ini:
Dengan program yang seperti itu, maka jika kita klik Tabel pada kolom menu maka tampilannya akan seperti ini:
Setelah itu kita akan mengisi list link Array dengan cara yang sama seperti sebelumnya dan program yang seperti ini:
Dengan program yang seperti itu, maka jika kita klik Array pada kolom menu maka tampilannya akan seperti ini:
Setelah itu kita akan mengisi list link Biodata dengan cara yang sama seperti sebelumnya dan program yang seperti ini:
Yang gue gunakan dalam program tersebut juga menyangkut foto gue yaa. Tentunya di program yang lo buat, bisa lo ganti link foto gue dengan link foto lo sendiri. Dengan program yang seperti itu, maka jika kita klik Biodata pada kolom menu maka tampilannya akan seperti ini:
Dan yang terakhir kita akan mengisi list link Kontak dengan cara yang sama seperti sebelumnya dan program yang seperti ini:
Dengan program yang seperti itu, maka jika kita klik Kontak pada kolom menu maka tampilannya akan seperti ini:
Nah gimana broo, mudahkan…
Dengan langkah – langkah diatas maka jadilah template yang kita inginkan. Semoga bermanfaat, kita ketemu lagi minggu depan dengan bahasan yang lagi seru. Okeyyy
Terimakasih sudah mau mampir walaupun sementara…
Wassalamualaikum Wr Wb
Recent Comments