Path links menu; WordPress browsing

I have used the theme Twenty Eleven a couple of times as the father theme for my web creations, and it works for me very well, but sometimes when the website grows to much with a lot of contents and several child pages; while users are browsing, they might get confused; due to the default absence of path links in most WordPress themes, sometimes happens after the user goes inside the menu and clicks on a few links they don’t know where are they, so a functionality that shoes the path to the page where you are is very useful sometimes.

Path links menu

Path links menu


Pic. 1 Browsing path links.

To create a path functionality you can do 2 main things:

  1. Install a plugin, there are a few in, you can do it easily you can find a useful plugin, but installing plugins brings some other problems;
  2. Why should I install a heavier plugin if I can program it my self with a few lines of code. Well this is what we will do today we program the website path our serves.

First we have to create the function under funcions.php or add the following function in your child theme (if you have a child theme) existing file functions.php:

/* Declare Function, it will receive the ID of a page */
function show_path_to_page ($id_page)
//Take the URL and Page title and create the link to the page.
 $aux_link = post_permalink($id_page, 'page');
 $aux_page_title = get_the_title($id_page);
 $aux_html_links = "<strong><a href='".$aux_link."'>".$aux_page_title."</a><strong>";
// Determine if it has ancestors and if it has link them.
 $aux_ancestors_array = get_post_ancestors($id_page);
 if ($aux_ancestors_array[0] != "")
//Count ancestors
 $ancestors_nodes = count($aux_ancestors_array);
//check every ancestor and make it part of the array.
 for ($i = 0; $i < $ancestors_nodes;$i++)
//Create the rest of the path links
$aux_link = post_permalink($aux_ancestors_array[$i], 'page');
 $aux_page_title = get_the_title($aux_ancestors_array[$i]);
 $aux_html_links = "<a href='".$aux_link."'>".$aux_page_title."</a> |> ".$aux_html_links;
// Return the links on a string.
 return $aux_html_links;

The functionality is done, we just need to call it on the header.php or where ever we want to use the wordpress path links and that’s it.

<div>&nbsp;&nbsp;Path: <?php echo show_path_to_page(get_the_ID()); ?></div>

Path links work fine, but they require some extra work, like styling and allocate it in the right place.


Leave a Reply

Your email address will not be published. Required fields are marked *