Sanity check/review? Breadcrumbs

Here’s what I’ve done for breadcrumbs based on the hints from @DavidDarnes

post.hbs and page.hbs includes a {{> breadcrumbs.hbs}}


<nav class="breadcrumb">
    <ul class="breadcrumbs">
        <li class="breadcrumb-item"><a href="/">Home</a><span>&gt;</span></li>
            <li class="breadcrumb-item"><a href="{{url}}">{{name}}</a><span>&gt;</span></li>
        <li class="breadcrumb-item breadcrumb-item-current"><a href="{{url}}">{{title}}</a></li>
<script type="application/ld+json">
      "@context": "",
      "@type": "BreadcrumbList",
      "itemListElement": [
      {{#if primary_tag}}
            "@type": "ListItem",
            "position": 1,
            "name": "{{}}",
            "item": "{{primary_tag.url}}"
            "@type": "ListItem",
            "position": 1,
            "name": "Posts",
            "item": "{{@site.url}}"
            "@type": "ListItem",
            "position": 2,
            "name": "{{title}}",
            "item": "{{url absolute="true"}}"            

I only use the primary_tag as I have a routes.yaml entry specifically for primary tag.
The end result being something like: “Home > Blogs > Today I Made Breadcrumbs”

How’s it look? Is there a better way to generate the ld+json? I don’t know where the other schema objects come from in Ghost. What generates those?

This looks good to me! However you’ll need to replace the existing {{ghost_head}} helper so you can replace the JSON LD metadata.

1 Like