Налаштування мікророзмітки хлібних крихт (BreadcrumbList Schema) для сайту

Налаштування мікророзмітки хлібних крошок (BreadcrumbList Schema) для сайту

BreadcrumbList Schema дозволяє Google показувати шлях навігації прямо у сніпеті — замість URL відображається ієрархія сторінок. Це поліпшує CTR та допомагає користувачам розуміти структуру сайту.

Розмітка хлібних крошок

{
    "@context": "https://schema.org",
    "@type": "BreadcrumbList",
    "itemListElement": [
        {
            "@type": "ListItem",
            "position": 1,
            "name": "Головна",
            "item": "https://example.ru"
        },
        {
            "@type": "ListItem",
            "position": 2,
            "name": "Електроніка",
            "item": "https://example.ru/electronics"
        },
        {
            "@type": "ListItem",
            "position": 3,
            "name": "Смартфони",
            "item": "https://example.ru/electronics/smartphones"
        },
        {
            "@type": "ListItem",
            "position": 4,
            "name": "iPhone 15 Pro"
        }
    ]
}

Динамічна генерація в Laravel

class BreadcrumbSchemaGenerator
{
    private array $crumbs = [['name' => 'Головна', '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))
        ];
    }
}

// У контролері
$breadcrumbs = (new BreadcrumbSchemaGenerator())
    ->add('Електроніка', '/electronics')
    ->add('Смартфони', '/electronics/smartphones')
    ->add($product->name);

Синхронізація з видимими хлібними крошками

Дані схеми повинні збігатися з видимими хлібними крошками на сторінці. Найкращий підхід — генерувати схему з того ж масиву, що й HTML-компонент.

Час налаштування: кілька годин.