Przejdź do treści
Manuilau | Bureau

Wzorzec · TypeScript

BreadcrumbList w JSON-LD dla stron wewnętrznych

Jeden helper na okruszki w markupie, zgodny z UI.

·

Poziom: podstawowySzacunek czasu: ~15 min

“

Jedna tablica danych zasila Breadcrumb i itemListElement w JSON-LD — bez rozjazdu nazw i URL.

  • Zgodna kolejność zmniejsza ryzyko błędów w rich results
  • obiekt gotowy do wstawienia w @graph
  • po zmianie tras uruchom walidator

Okruszki w interfejsie i w application/ld+json muszą się zgadzać kolejnością i etykietami.

Kod

export function buildBreadcrumbListLd(items: { name: string; url: string }[]) {
  return {
    '@type': 'BreadcrumbList' as const,
    itemListElement: items.map((item, index) => ({
      '@type': 'ListItem' as const,
      position: index + 1,
      name: item.name,
      item: item.url,
    })),
  }
}

Weryfikacja

  • W UI i JSON-LD te same podpisy punktów i kanoniczne URL ze slashem na końcu, jeśli tak przyjęto na stronie.
  • Rich Results Test / walidator Schema.org bez błędów dla ListItem.

Źródła

Wdrożyć pod Twoją domenę i stack?

Krótki formularz: imię, telefon, strona. Po wysłaniu — odpowiedź z kolejnością prac i orientacją etapów; szczegóły doprecyzujemy na kontakcie.