Pembagian Posisi Template

Template yang kita gunakan terdiri dari:

• Header

• Navigasi Atas

• Sisi Kiri

• Isi

• Footer

 

Muncul Pertanyaan:

Bagaimana caranya agar setiap saya klik menu Navigasi atas maka yang berubah hanya isinya saja sedangkan Header, Navigasi Atas, Sisi Kiri dan Footer tetap sama … ?

Jawaban:

Ikuti langkan berikut ini:

 

Membuat file header.php

Buka file application/views/template.php

Lalu cut kode dari 

 

<div id="logo">

 

Sampai

 

<!—end #header-wrapper -- >

 

Lalu copy ke file baru dan simpan sebagai header.php dalam direktori application/views.

 

Membuat isi

Buka file application/views/template.php

Lalu cut kode dibawah ini:

 

<div id="content"

 

Dan  sebelum  kode dibawah ini

 

</div>

<!—end #content -->

 

Lalu copy ke file baru dan simpan sebagai isi.php dalam direktori application/views.

 

Membuat Sisi Kiri

Buka file application/views/template.php

Lalu cut kode dari 

<div id=”sidebar”>

 

Sampai

 

<!—end #sidebar -- >

Lalu copy ke file baru dan simpan sebagai kiri.php dalam direktori application/views.

 

Membuat Footer

Buka file application/views/template.php

Lalu cut kode dari 

<div id=”footer-bgcontent”>

 

Sampai

 

<!—end #footer -- >

 

Lalu copy ke file baru dan simpan sebagai footer.php dalam direktori application/views.

Sekarang file template.php menjadi seperti berikut ini:

 

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">

<!--

Design by Free CSS Templates

http://www.freecsstemplates.org

Released for free under a Creative Commons Attribution 2.5 License

 

Name       : Spontaneous 

Description: A two-column, fixed-width design for 1024x768 screen resolutions.

Version    : 1.0

Released   : 20090623

 

-->

<html xmlns="http://www.w3.org/1999/xhtml">

<head>

<meta http-equiv="content-type" content="text/html; charset=utf-8" />

<title>Spontaneous  by Free CSS Templates</title>

<meta name="keywords" content="" />

<meta name="description" content="" />

<link href="style.css" rel="stylesheet" type="text/css" media="screen" />

 

<?php $this->load->helper('HTML'); echo link_tag('css/style.css')?>

 

</head>

<body>

<div id="wrapper">

 

 

<div id="page">

<div id="page-bgtop">

<div id="content">

 

</div>

<!-- end #content -->

 

 

<div style="clear: both;">&nbsp;</div>

</div>

</div>

<!-- end #page -->

<div id="footer-bgcontent">

 

</div>

</body>

</html>

Sekarang simpanlah file template.php

 

 

Penutup
Sekian dan terima kasih.
2016 © Fahmi Basya Kartapura