Having been brought up developing PHP using templating systems like Smarty, I’m very used to segmenting my page elements into reusable block, and swapping out blocks of HTML codes, nesting blocks of code within other blocks and so on.

Trying my hands at using CodeIgniter, one of the first obstacles I had was how to organize my ‘blocks’ on a page. Without knowing any better, I thought I had to reiterate the same view calls in every function within the controller, making the controller codes very messy.

It turns out that CodeIgniter allows us to nest views within views, and that has made things a lot simplier for me.


If you’re new to CI, and you just read the CI Docs as is, the way you would have called your views within the controller would have been like so:

load->view('header');
		$this->load->view('menu');
		$this->load->view('content', $data);
		$this->load->view('footer');
	}
}
?>

and if you wanted to create another page with a different layout for say the ‘content’ view, the most obvious way would have been

load->view('header');
		$this->load->view('menu');
		$this->load->view('content', $data);
		$this->load->view('footer');
	}

	// the second 'page' using the content2 layout for the body.
	function page2() 
	{
		$data['page_title'] = 'Your title for content 2';
		$this->load->view('header');
		$this->load->view('menu');
		$this->load->view('content2', $data);
		$this->load->view('footer');
	}
}
?>

whilst reusing the ‘header’, ‘menu’ and ‘footer’ view. I’m sure you can imagine once this starts to scale, it would be quite messy and hard to maintain. At this point, I was thinking that there were probably better ways of doing this, and there are if you Google around a bit.

For me, I decided to try nesting the views. Instead of calling the ‘header’, ‘menu’, ‘footer’, ‘content’ views from the controller, what if I called these views from within another view, and the controller just needs to call this new view (which I named a ‘container’) and pass in the parameter of which ‘content’ view to use.

With that in mind, I created a ‘container.php‘ view, inside /system/application/view/ like so:



load->view('meta');
?>


load->view('header');
$this->load->view('menu');
$this->load->view($page);
$this->load->view('footer');
?>


So now, within the controller, I just need to call the ‘container’ view and pass in the right parameters to use for $page

load->view('container',$data);
	}
	
	function page2() {
		$data['page_title'] = 'Your title for content 2';
		$data['page'] = 'content2'; // pass the actual view to use as a parameter
		$this->load->view('container',$data);
	}
}
?>

As you can see, the controller now becomes less verbose. What I’ve also noticed is that $data[‘page_title’] will carry into the nested views, and the $title parameter will still get populated. Also, once you are able to nest views within views, the added benefit is your HTML code would be much neater. You can avoid cases where the open HTML tag is in one view and the closing tag is in another view.

Well, that’s it. At the most simplistic level, this is how I like to organize my views. Of course, as your site or application grows with more views, you should make use of folders and dynamic variables to further help in organizing the grow number of views you bound to have.