Laravel dynamic page title in navbar-brand
Stefan Izdrail
Founder & Senior Architect · 2026-06-29
Title: Dynamically Display Page Titles in Laravel Navbar-Brand Using Blade Views
Introduction
In Laravel, having a dynamic page title displayed on your navbar-brand is essential to provide a smooth user experience. This ensures that each page's content is represented accurately while keeping the navigation consistent across all pages of your application. In this article, we will discuss how to dynamically display the page titles in the navbar-brand using Laravel 5.2 and its powerful Blade templates.
Dynamic Page Title in Navbar-Brand
First, let's take a look at our current setup:
<div class="navbar-header">
<!-- Collapsed Hamburger -->
<button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target="#spark-navbar-collapse">
<span class="sr-only">Toggle Navigation</span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
</button>
<!-- Branding Image -->
<a class="navbar-brand" href="/">
*Dynamic page title*
</a>
</div>
// ...
@yield('content')
To dynamically display the page titles in our navbar-brand, we want to pass the current page's name from each specific template extending layouts.app.blade.php. We can achieve this by adding an extra blade directive:
In your templates/layouts folder, create a shared Blade file named 'base.blade.php'. This file will hold the basic HTML structure and common elements that are shared across all pages. Then, add the following to the navbar-brand:
@yield('pageTitle')
This line looks for a specific yield ('pageTitle') from each template extending layouts.app.blade.php, and displays its value within the navbar-brand. Now you can use this directive in your templates to easily display page titles.
Example Usage
Here is an example for your reference:
1. Create a shared Blade file ('base.blade.php') in templates/layouts folder with the following code:
<div class="navbar-header">
<!-- Collapsed Hamburger -->
<button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target="#spark-navbar-collapse">
<span class="sr-only">Toggle Navigation</span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
</button>
<!-- Branding Image -->
<a class="navbar-brand" href="/home">@yield('pageTitle')</a> // Dynamically display page title here.
</div>
// ...
@yield('content')
2. In your templates/views folder, create a new template named 'index.blade.php' with the following code:
@extends('layouts.base') // Extend the shared base layout.
@section('pageTitle', 'Home Page Title') // Set the page title for this specific page.
@yield('content')
3. In your browser, navigate to http://your-domain/index and you will see the 'Home Page Title' displayed in the navbar-brand. This will vary depending on the page being visited.
Conclusion
Now you can easily display dynamic page titles in your Laravel application's navbar-brand using Blade views. By following these simple steps, you can achieve consistency and a smooth user experience across all pages of your website while maintaining the flexibility to change each page's title as needed.