1 min read

Show the full page hierarchy in the HTML title tag with Kirby

It's best to show users the current depth of a page using breadcrumbs. You may also want to indicate the same in the browser tab; Kirby provides some handy tools to achieve this.

Kirby provides a built in breadcrumb() function and a handy example to show users their current journey within a site. The order need to be reversed for the browser title so the current page title is listed first so it’s visible to the user.

      
        <?php
      
          // Start off with an empty $title
      
          $title = '';
      
          // Get all the parents (except the homepage) and reverse the array
      
          $parents = $site->breadcrumb()->not('home')->flip();
      
          // Iterate over the array
      
          foreach ($parents AS $parent) :
      
            // Add each title to a variable (with a pike as a separator)
      
            $title .= $parent->title() . ' | ';
      
          endforeach;
      
          // Add the site title last
      
          $title .= $site->title();
      
        ?>
      
        <!-- Echo the title variable inside the <title> tag -->
      
        <title><?php echo $title; ?></title>

view raw kirby-title.php hosted with ❤ by GitHub

Posted November 27, 2014

	<?php

	// Start off with an empty $title
	$title = '';

	// Get all the parents (except the homepage) and reverse the array
	$parents = $site->breadcrumb()->not('home')->flip();

	// Iterate over the array
	foreach ($parents AS $parent) :

	// Add each title to a variable (with a pike as a separator)
	$title .= $parent->title() . ' \| ';

	endforeach;

	// Add the site title last
	$title .= $site->title();

	?>

	<!-- Echo the title variable inside the <title> tag -->
	<title><?php echo $title; ?></title>