craig
6eff12e8ac
SmartCrawl plugin reference (11 docs): - Overview, configuration, titles & meta, schema, sitemaps, social/OG, redirects, breadcrumbs, content analysis, hooks/filters, known issues SEO strategy playbook (6 docs): - Keyword research, per-page-type selection, on-page optimization, local SEO, technical SEO, content strategy Reusable templates (3): - Site audit checklist, keyword research worksheet, page optimization checklist Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
147 lines
3.5 KiB
Markdown
147 lines
3.5 KiB
Markdown
# Breadcrumbs
|
|
|
|
SmartCrawl provides breadcrumb navigation with built-in Schema.org `BreadcrumbList` markup. Breadcrumbs improve both UX (users can navigate up the site hierarchy) and SEO (Google displays breadcrumb trails in search results).
|
|
|
|
## Enabling Breadcrumbs
|
|
|
|
1. Go to **SmartCrawl > Advanced Tools > Breadcrumbs**
|
|
2. Toggle the module ON
|
|
3. Configure separator and display options
|
|
4. Add the breadcrumb output to your theme
|
|
|
|
## Adding Breadcrumbs to Your Theme
|
|
|
|
### Method 1: Shortcode
|
|
|
|
```
|
|
[smartcrawl_breadcrumbs]
|
|
```
|
|
|
|
Place this in any post, page, widget, or theme template.
|
|
|
|
### Method 2: Shortcode with Custom Wrapper
|
|
|
|
```
|
|
[smartcrawl_breadcrumbs before="<nav aria-label='Breadcrumb'>" after="</nav>"]
|
|
```
|
|
|
|
The `before` and `after` parameters wrap the breadcrumb trail with custom HTML.
|
|
|
|
### Method 3: PHP (Theme Template)
|
|
|
|
```php
|
|
<?php
|
|
if ( function_exists( 'smartcrawl_breadcrumbs' ) ) {
|
|
smartcrawl_breadcrumbs();
|
|
}
|
|
?>
|
|
```
|
|
|
|
Place this in your theme's `header.php`, `single.php`, `page.php`, or a custom template part.
|
|
|
|
## Configuration
|
|
|
|
### Separator
|
|
|
|
Choose from presets or enter custom HTML:
|
|
|
|
| Preset | Output |
|
|
|--------|--------|
|
|
| `>` | Home > Category > Page |
|
|
| `/` | Home / Category / Page |
|
|
| `»` | Home » Category » Page |
|
|
| Custom | Any HTML character or element |
|
|
|
|
**Recommendation:** Use `>` or `»` — they visually indicate hierarchy.
|
|
|
|
### Display Options
|
|
|
|
| Option | Description |
|
|
|--------|-------------|
|
|
| Show on homepage | Whether breadcrumbs appear on the homepage (usually no — it would just show "Home") |
|
|
| Home link text | Default "Home" — can be customized (e.g., site name) |
|
|
| Post breadcrumb type | Show category hierarchy or just parent page |
|
|
|
|
## Schema Output
|
|
|
|
SmartCrawl automatically outputs `BreadcrumbList` schema markup alongside the visible breadcrumbs:
|
|
|
|
```json
|
|
{
|
|
"@context": "https://schema.org",
|
|
"@type": "BreadcrumbList",
|
|
"itemListElement": [
|
|
{
|
|
"@type": "ListItem",
|
|
"position": 1,
|
|
"name": "Home",
|
|
"item": "https://example.com/"
|
|
},
|
|
{
|
|
"@type": "ListItem",
|
|
"position": 2,
|
|
"name": "Services",
|
|
"item": "https://example.com/services/"
|
|
},
|
|
{
|
|
"@type": "ListItem",
|
|
"position": 3,
|
|
"name": "Basic Rider Course"
|
|
}
|
|
]
|
|
}
|
|
```
|
|
|
|
This produces breadcrumb navigation in Google search results:
|
|
|
|
```
|
|
example.com > Services > Basic Rider Course
|
|
```
|
|
|
|
## Styling
|
|
|
|
SmartCrawl outputs breadcrumbs with CSS classes you can target:
|
|
|
|
```css
|
|
/* Breadcrumb container */
|
|
.smartcrawl-breadcrumbs {
|
|
font-size: 14px;
|
|
padding: 10px 0;
|
|
color: #666;
|
|
}
|
|
|
|
/* Individual breadcrumb links */
|
|
.smartcrawl-breadcrumbs a {
|
|
color: #0066cc;
|
|
text-decoration: none;
|
|
}
|
|
|
|
.smartcrawl-breadcrumbs a:hover {
|
|
text-decoration: underline;
|
|
}
|
|
|
|
/* Separator */
|
|
.smartcrawl-breadcrumbs .separator {
|
|
margin: 0 8px;
|
|
color: #999;
|
|
}
|
|
|
|
/* Current page (last item, no link) */
|
|
.smartcrawl-breadcrumbs .current {
|
|
color: #333;
|
|
font-weight: 500;
|
|
}
|
|
```
|
|
|
|
## White Label Support
|
|
|
|
SmartCrawl Pro supports white labeling the breadcrumb module — you can remove WPMU DEV branding from the output.
|
|
|
|
## Best Practices
|
|
|
|
1. **Place breadcrumbs near the top of the page** — above the main content, below the header
|
|
2. **Don't show on homepage** — it adds no value (just "Home")
|
|
3. **Keep the trail short** — Home > Category > Page is ideal. Avoid deep nesting.
|
|
4. **Validate the schema** at [Google Rich Results Test](https://search.google.com/test/rich-results)
|
|
5. **Ensure the hierarchy makes sense** — breadcrumbs should reflect the actual site structure
|