CakePHP 4 How To Set Dynamic Page Title Tutorial

Reading Time: 4 minutes
3,714 Views

Inside this article we will see CakePHP 4 how to set dynamic page title of web pages. This article contains classified information about settings up dynamic page title of web pages.

In CakePHP 4 we need to follow very simple steps by which we can set our own titles of application. We will use two methods in this. Methods are – set() & assign(). If you follow this tutorial then surely you will be able to set dynamic pages title.

Page Title means what we see Page Label in Title bar of web pages.

Lear More –

Let’s get started.

CakePHP 4 Installation

To create a CakePHP project, run this command into your shell or terminal. Make sure composer should be installed in your system.

$ composer create-project --prefer-dist cakephp/app:~4.0 mycakephp

Above command will creates a project with the name called mycakephp.

Create Controller

Open project into terminal and run this command –

$ bin/cake bake controller Site --no-actions

It will create a file SiteController.php inside /src/Controller folder.

Open SiteController.php and write this code into it.

<?php

declare(strict_types=1);

namespace App\Controller;

class SiteController extends AppController
{
    public function initialize(): void
    {
        parent::initialize();
        $this->viewBuilder()->setLayout("app");
    }

    public function index()
    {
        // your code
        $this->set("title", "CakePHP 4 How To Set Dynamic Page Title");
    }
}

We have a set a title value in title key for index method.

$this->set("title", "CakePHP 4 How To Set Dynamic Page Title");

Also we are using a layout app for this controller

$this->viewBuilder()->setLayout("app");

Create Layout

Create a file app.php inside /templates/layout folder.

Open app.php and write this following code into it.

<html>

<head>
    <title><?= $this->fetch("title") ?></title>
</head>

<body>
    ...
  
    <?= $this->fetch("content") ?>
</body>

</html>

We can see to fetch dynamic title value, we have a placeholder inside <title>…</title>.

Next, we need to assign value for this title key.

Create Template

Let’s create a template for index method of SiteController.php file.

Create a folder Site inside /templates folder. Next create a file index.php inside /templates/Site folder.

Open index.php and write this code into it.

<?php
if (isset($title) && !empty($title)) {
    $this->assign("title", $title);
}
?>

<h3>Welcome to index Page of Application</h3>
  

Here, it checks the title variable and it’s value which is coming from controller file. If it contains value then it settings up for the placeholder key title.

Create Route

Open routes.php file from /config folder. Add this given route into it.

//...

$routes->scope('/', function (RouteBuilder $builder) {

     $builder->connect('/my-title', ['controller' => 'Site', 'action' => 'index']);

});

//...

Application Testing

Open project into terminal and run this command to start development server.

$ bin/cake server

URL: http://localhost:8765/my-title

We hope this article helped you to learn about CakePHP 4 How To Set Dynamic Page Title Tutorial in a very detailed way.

Online Web Tutor invites you to try Skillshike! Learn CakePHP, Laravel, CodeIgniter, Node Js, MySQL, Authentication, RESTful Web Services, etc into a depth level. Master the Coding Skills to Become an Expert in PHP Web Development. So, Search your favourite course and enroll now.

If you liked this article, then please subscribe to our YouTube Channel for PHP & it’s framework, WordPress, Node Js video tutorials. You can also find us on Twitter and Facebook.