Using Cells in CakePHP

In CakePHP, a view cell is a "small mini-controller that can invoke view logic and render out templates."  A concept borrowed from Ruby, CakePHP's cells are a great way to encapsulate a view component such as a shopping cart icon or a sidebar.

This tutorial covers the basics of creating a view cell based upon an “articles” table, similar to the one from CakePHP's blog tutorial. It is written using CakePHP 3.

In this tutorial, we’re going to create a “recent articles” cell that can be used on the front page, a sidebar, or pretty much anywhere else where it might be needed (that’s the beauty of a cell). To get started, I recommend completing the blog tutorial and using that project as your starting point.

From your project’s root directory, bake a template for your new cell:

bin/cake bake cell RecentArticles

This will create two files:

src/View/Cell/RecentArticlesCell.php
src/Template/Cell/RecentArticles/display.ctp

RecentArticlesCell.php is where the logic for your cell will go, and RecentArticles/display.ctp is the default display template.

In the empty display method of RecentArticlesCell.php, we want to put in the necessary code to return the five most recent articles posted to our Articles table:

public function display()
{
$this->loadModel('Articles');
$recent = $this->Articles->find()
->limit(5)
->order(['modified' => 'DESC']);
$this->set('recent_articles', $recent);
}

As you can see, we’re bringing in the model for “Articles” and using Cake ORM (Object-Relational Mapping) to return the articles, limiting the query to five rows and sorting them by the “modified” date in descending order.

Next, we set the template variable “recent_articles” to contain our data. This allows us to show the data in the display.ctp file that was generated in template/cell/RecentArticles by our bake.

<table cellpadding="0" cellspacing="0">
<thead>
<tr>
<th><?= $this->Paginator->sort('title') ?></th>
<th><?= $this->Paginator->sort('modified') ?></th>
<th class="actions"><?= __('Actions') ?></th>
</tr>
</thead>
<tbody>
<?php foreach ($recent_articles as $recent_article): ?>
<tr>
<td><?= h($recent_article->title) ?></td>
<td><?= h($recent_article->modified) ?></td>
<td class="actions">
<?= $this->Html->link(__('View'),
['controller' => 'articles',
'action' => 'view',
$recent_article->id]) ?>
</td>
</tr>
<?php endforeach; ?>
</tbody>
</table>

In our display.ctp, we’re doing a foreach, creating the new variable $recent_article to iterate through the passed-in $recent_articles. Now, all we have to do is use our cell on a page.

To display the cell, on - say - your home.ctp page, we simply need to include the following line anywhere on the page:

<?= $this->cell('RecentArticles') ?>

That’s it; that’s a cell. All of the logic needed to produce the content of the cell is conveniently encapsulated in RecentArticlesCell.php, preventing clutter in our main controller and allow us to follow DRY standards. Likewise the display.ctp houses the additional HTML and logic needed to display the cell’s contents without any convolution to our home.ctp. The cell can be used throughout our application, with changes to the formatting and content being done in one place.