Tag Archives: elements

CakePHP: working with Elements

One of my favorite PHP framework at the moment is CakePHP, it is not very different from others frameworks like CodeIgniter, Symphony, etc.

In this article I will present you a very handy feature of CakePHP: the Elements.
An element (like it is named) is a part of a web page which can be display into multiple pages (a sort of template if you want). Here are some elements’ examples:

  • A header: with your banner, your brand logo
  • A menu: with your categories, links
  • A footer: company name, copyright

In CakePHP, Elements are located in the app/views/elements/ directory (or if you are using a custom theme you can create specific elements and put them in the /app/views/themed/your_theme_folder/elements/ directory).

So let’s get started. We will create a basic element which will display ‘Hello World!’:

<h1>Hello World</h1>

You can save this Element: app/view/elements/helloworld.ctp
The last step is to include the element in our pages, to do so you just have to request it like that:

/*For instance I want to display Hello Word on my app/views/posts/index.ctp page:*/
echo $this->element('helloworld');

Elements using Controller with requestAction

Displaying basic information is great, but it would be much more better if we could access to our data and request something like the five latest comments or posts added. This is indeed possible through the requestAction method.

First of all, we have to add a method in our controller which will allow us to retrieve the data we want to render.

/* For instance I want to display the 5 latest posts on my index page. */
public function lastposts($limit=5)
	/* We retrieve only the required fields, and configure the query. */
	$posts = $this->Post->find('all', array('fields'=>array('Post.id', 'Post.name', 'Post.created'),
							   'order'=>array('Post.created desc'),
		return $posts;
	$this->set('lastposts', $posts);

Second of all, we create our element. This step is exactly the same as what we have done before, create a page called lastposts.ctp in your app/views/elements/ directory but this time there will be more code’s lines. The first thing to do in your element is to get our data, to do that you will have to use the requestAction method, now you are ready to display your latest posts:

/* First step: get the latest posts, the URL should be like your_controller_name/method_name/params */
$posts = $this->requestAction('posts/lastposts/5');
<h3>Our latest posts</h3>
<?php foreach($posts as $post): ?>
	<li><i><?php echo $post['Post']['created']; ?></i> : <?php echo $post['Post']['name']; ?></li>
<?php endforeach; ?>

To get the job done we have to display our element in a page. We have already done that before, do it again:

echo $this->element('lastposts');

You should now be able to see the posts on the page. You also may see a little issue when you try to display the page, it takes an extra time to load it. The requestAction method is the responsible.

Enable cache for requestAction

To make things right and avoid that extra consuming resources, you can and should enable the caching functionality for your element. It is very simple and your visitors, as much as your server, will see a significant reduce during the pages’ load.

echo $this->element('lastposts', array('cache'=>'1 hour');