First, why is breadcrumb SEO useful for a Shopify store?

Because it allows you to display your breadcrumb trail directly in search results. Here’s an example (screenshot):

You can see the last breadcrumb”Vedeldad badtunna” for the product, and “pw-spa” for the collection.

Now, compare that with a website that doesn’t have a good BreadcrumbList SEO schema setup (screenshot example):

This store is missing the last breadcrumb. It just ends at “products”.

Having a better breadcrumb in the search results can lead to higher CTR in the search results.

Other benefits of having a good BreadcrumbList SEO Schema are:

• Better internal linking
• Mobile-friendly navigation
• Hierarchy understanding for search engines.

How to test which Shopify app generates the best BreadcrumbList Schema?

Now that we’ve established the usefulness of having a good BreadcrumbList SEO schema, what are the ways we can determine which breadcrumb app has the best SEO for Shopify store?

There are two primary ways in which Shopify apps differ regarding auto-generated BreadcrumbList SEO schema:

1. how deep the hierarchy goes. Basic Shopify apps can only do 2-3 levels of basic breadcrumbs. Advanced Shopify apps should be able to go up to 5 levels.
2. whether it is outputted straight away as raw HTML, or whether it requires JS to generate the BreadcrumbList SEO schema.

 

Search engines crawl raw HTML much faster than it takes to crawl Javascript-generated HTML, because it takes much more computing resources to run Javascript than to simply look at the raw HTML. So Google “Javascript crawlers” are run much less frequently than their plain-HTML crawlers.

Here’s one screenshot from an authoritative blog post saying it takes 9x longer for Google to crawl JS than HTML:

I’ve personally analyzed all 6 breadcrumb apps currently available in the Shopify store. Based on the two metrics I outlined, none of them are as good as “PH Breadcrumbs”. I will showing screenshots from each of these apps as proof of my testing.

The testing methodology is simple:

1. Setup a menu navigation that goes to 5 levels. (see screenshot after this numbered list)
   1. The 5-levels are: Home > Collection 1 > Collection 2 > Collection 3 > Product
2. Install and configure breadcrumb
3. Look at how the BreadcrumbList SEO schema is generated

1. PH Breadcrumbs

I’m looking at the HTML generated by the app (view-source). You can see in this screenshot it goes up to 5-levels of breadcrumbs (the deepest allowed by Shopify menu navigation). And also that it does not require Javascript to render. Googlebots can simply look at the raw HTML.

5/5 on both metrics 1 and 2.

2. Schema & Breadcrumbs by Bogdan

On the same product page that the “PH Breadcrumb” app generated 5-levels, this app only generates two levels.

On the plus side, the BreadcrumbList is outputted as raw HTML. 5/5 there. But also, it really only generates 2-levels, the most basic level. You are welcome to test it out yourself.

3. TT ‑ Breadcrumbs & SEO Schema

On the same product page that the “PH Breadcrumb” app generated 5-levels, this app only generates two levels.

On the plus side, the BreadcrumbList is outputted as raw HTML. 5/5 there. But also, it really only generates 2-levels, the most basic level. You are welcome to test it out yourself.

Additional Note: for those who know Javascript, you will be interested in the screenshot on lines 74-76. That is Javascript to remove every other SEO schema that is NOT generated by TT Ninja. When I first realized they were doing that, I thought it was quite funny. Really kneecapping your competitors, eh?

It explains why they got this one bad review (screenshot):

Link to the review is here: https://apps.shopify.com/tt-schema-breadcrumbs/reviews?ratings%5B%5D=2

4. Category Breadcrumbs

Well it’s compressed on a single line, so it’s hard to parse. I’ve expanded it using a JSON beautifier, and you can see this app also fails.

On the plus side, the BreadcrumbList is outputted as raw HTML. 5/5 there. But also, it generates only 3 levels. It ignores the “Home” and the “Product” breadcrumbs.

You are welcome to test it out yourself.

5. Breadcrumbs by Byte Apps

This app does not generate the BreadcrumbList as raw HTML. It requires Javascript to render the BreadcrumbList. Screenshot proof:

In this screenshot, the BreadcrumbList is generated using a Javascript function “generateBreadcrumbScript”.

On the page’s “view-source” (which is the raw HTML), there is no other mention of “BreadcrumbList”.

On the other hand, it looks like their generated BreadcrumbList is 5-levels (screenshot)

So, 5/5 for generating the correct depth of Breadcrumbs. But 1/5 for requiring Javascript instead of outputting as raw HTML.

 

6. Breadcrumbs Galore

Last but not least.

These guys are also using Javascript to generate the BreadcrumbList schema. It’s in the function “initRichSchema”.

Even worse than that though, a look through the live HTML on the page shows no occurrences at all of any BreadcrumbList. It didn’t even generate the SEO Schema.

So, 0/5 on both metrics, sadly.

Conclusion

As the developer of “PH Breadcrumbs”, am I biased? Yea.

But also, these are based in facts.

You are welcome to try it out yourself.

I’ve also recorded a video doing live analysis of all 6 apps. However, I haven’t published it to youtube yet. Email me hello@programmerhat.com if you would like to see the video.

If you’re looking for an app that can generate raw HTML of 5-level BreadcrumbList SEO Schema, then this app “PH Breadcrumbs” is the app for you. I provide free support to help you get started.