Breadcrumbs Navigation Guide

What are Breadcrumbs?

Breadcrumbs are a navigational aid that shows users their current location within your website's hierarchy. They appear as a trail of links, typically near the top of a page, showing the path from the homepage to the current page.

Example: Home › Blog › SEO Tips › Current Article

ProRank SEO's breadcrumbs feature provides automatic generation, customizable display options, and 2025-compliant structured data markup for optimal SEO performance.

Key Features

Quick Start

[prorank_breadcrumbs]

Display Settings

Schema Markup Options

ProRank SEO supports multiple schema formats to ensure compatibility with all search engines and themes:

Supported Page Types

ProRank SEO automatically generates appropriate breadcrumbs for all WordPress page types:

Shortcode Usage

The [prorank_breadcrumbs] shortcode supports various parameters for customization:

[prorank_breadcrumbs]

[prorank_breadcrumbs separator="→"]

[prorank_breadcrumbs separator="/" home_text="Start" show_current="false" style="slash" class="my-custom-breadcrumbs"]

Available Parameters

Styling & Appearance

.prorank-breadcrumbs { /* Main container */ }
.prorank-breadcrumbs-list { /* The <ol> element */ }
.prorank-breadcrumb-item { /* Each breadcrumb item */ }
.prorank-breadcrumb-separator { /* Separator element */ }
.prorank-breadcrumb-current { /* Current page text */ }

/* Style variations */
.prorank-breadcrumbs.style-arrow { }
.prorank-breadcrumbs.style-slash { }
.prorank-breadcrumbs.style-pipe { }
.prorank-breadcrumbs.has-background { }
.prorank-breadcrumbs.style-compact { }
.prorank-breadcrumbs.style-large { }

Display Location Settings

Control where breadcrumbs appear on your site:

You can customize these settings in the Breadcrumbs settings page under "Display Settings".

WooCommerce Integration

ProRank SEO automatically detects WooCommerce and provides enhanced breadcrumbs for:

• Shop Page: Home › Shop
• Product Categories: Home › Shop › Parent Category › Subcategory
• Single Products: Home › Shop › Category › Product Name
• Product Tags: Home › Shop › Tag Name

Schema Markup Output

When schema is enabled, ProRank SEO generates structured data that helps search engines understand your site structure:

{
  "@context": "https://schema.org",
  "@type": "BreadcrumbList",
  "itemListElement": [
    {
      "@type": "ListItem",
      "position": 1,
      "name": "Home",
      "item": "https://example.com/"
    },
    {
      "@type": "ListItem",
      "position": 2,
      "name": "Blog",
      "item": "https://example.com/blog/"
    },
    {
      "@type": "ListItem",
      "position": 3,
      "name": "SEO Tips"
    }
  ]
}

Troubleshooting

Developer Hooks

ProRank SEO provides filters for developers to customize breadcrumb output:

add_filter('prorank_seo_breadcrumbs_trail', function($breadcrumbs, $args) {
    // Modify breadcrumbs array
    // Each item has 'name' and 'url' keys
    
    // Example: Add custom item
    $breadcrumbs[] = [
        'name' => 'Custom Section',
        'url' => 'https://example.com/custom/'
    ];
    
    return $breadcrumbs;
}, 10, 2);

Best Practices

• Keep it Simple: Use clear, descriptive text for breadcrumb items
• Maintain Consistency: Use the same separator style throughout your site
• Mobile Optimization: Test breadcrumb display on mobile devices
• Use Schema Markup: Always enable structured data for SEO benefits
• Logical Hierarchy: Ensure your content structure makes sense to users
• Avoid Redundancy: Don't duplicate the page title in breadcrumbs

Next Steps