Create a breadcrumb navigation for a WordPress site

To create a breadcrumb navigation for a WordPress site, where you want to include the parent page's title and links, you can use custom PHP code. Here's how you can implement it:

Code to Add Breadcrumb Navigation with Parent Page Support

You can add the following code to your WordPress theme's functions.php file or create a custom plugin:

?

1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55

function custom_breadcrumbs() {     // Options     $separator = ' » ';     $home_title = 'Home';       // Get the query & post information     global $post;       // Do not display on the homepage     if (is_front_page()) {         return;     }       // Start the breadcrumb with a link to home     echo '<nav class="breadcrumbs">';     echo '<a href="' . home_url() . '">' . $home_title . '</a>' . $separator;       if (is_single()) {         // For single posts, show the category         $categories = get_the_category();         if (!empty($categories)) {             $category = $categories[0];             echo '<a href="' . get_category_link($category->term_id) . '">' . $category->name . '</a>' . $separator;         }         echo '<span>' . get_the_title() . '</span>';     } elseif (is_page() && $post->post_parent) {         // For child pages, show parent pages         $parent_id = $post->post_parent;         $breadcrumbs = [];         while ($parent_id) {             $page = get_page($parent_id);             $breadcrumbs[] = '<a href="' . get_permalink($page->ID) . '">' . get_the_title($page->ID) . '</a>';             $parent_id = $page->post_parent;         }         $breadcrumbs = array_reverse($breadcrumbs);         foreach ($breadcrumbs as $crumb) {             echo $crumb . $separator;         }         echo '<span>' . get_the_title() . '</span>';     } elseif (is_category()) {         // For category archives         echo '<span>' . single_cat_title('', false) . '</span>';     } elseif (is_archive()) {         // For other archives         echo '<span>' . post_type_archive_title('', false) . '</span>';     } elseif (is_search()) {         // For search pages         echo '<span>Search results for: "' . get_search_query() . '"</span>';     } elseif (is_404()) {         // For 404 pages         echo '<span>Page not found</span>';     }       echo '</nav>'; }

How to Use:

1. Add the above function to your functions.php file.
2. Call the breadcrumb function in your theme's template files (e.g., header.php or page.php) where you want the breadcrumbs to appear:

?

1	if (function_exists('custom_breadcrumbs')) custom_breadcrumbs();

Styling the Breadcrumbs

You can add the following CSS to style the breadcrumbs:

?

1 2 3 4 5 6 7 8 9 10 11 12 13 14

.breadcrumbs {     font-size: 14px;     margin-bottom: 20px; } .breadcrumbs a {     text-decoration: none;     color: #0073aa; } .breadcrumbs a:hover {     text-decoration: underline; } .breadcrumbs span {     color: #333; }

Features:

1. Parent Pages: Automatically includes parent pages in the breadcrumb trail.
2. Category Support: For posts, includes the category in the breadcrumbs.
3. Customizable Separator: You can change the $separator variable to use a different symbol.

Let me know if you need additional customization or have further questions!