Setting up Breadcrumb Schema Markup for a Website
BreadcrumbList Schema allows Google to display the navigation path directly in the snippet — the page hierarchy is shown instead of the URL. This improves CTR and helps users understand site structure.
Breadcrumb Markup
{
"@context": "https://schema.org",
"@type": "BreadcrumbList",
"itemListElement": [
{
"@type": "ListItem",
"position": 1,
"name": "Home",
"item": "https://example.ru"
},
{
"@type": "ListItem",
"position": 2,
"name": "Electronics",
"item": "https://example.ru/electronics"
},
{
"@type": "ListItem",
"position": 3,
"name": "Smartphones",
"item": "https://example.ru/electronics/smartphones"
},
{
"@type": "ListItem",
"position": 4,
"name": "iPhone 15 Pro"
}
]
}
Dynamic Generation in Laravel
class BreadcrumbSchemaGenerator
{
private array $crumbs = [['name' => 'Home', 'url' => '/']];
public function add(string $name, ?string $url = null): self
{
$this->crumbs[] = ['name' => $name, 'url' => $url];
return $this;
}
public function toSchema(): array
{
return [
'@context' => 'https://schema.org',
'@type' => 'BreadcrumbList',
'itemListElement' => array_map(fn($crumb, $index) => array_filter([
'@type' => 'ListItem',
'position' => $index + 1,
'name' => $crumb['name'],
'item' => $crumb['url'] ? url($crumb['url']) : null
]), $this->crumbs, array_keys($this->crumbs))
];
}
}
// In controller
$breadcrumbs = (new BreadcrumbSchemaGenerator())
->add('Electronics', '/electronics')
->add('Smartphones', '/electronics/smartphones')
->add($product->name);
Synchronization with Visual Breadcrumbs
Schema data must match visible breadcrumbs on the page. The best approach is to generate the schema from the same array used for the HTML component.
Setup timeline: a few hours.