Hello everyone, welcome back to another Shopify app review! In this video, I’ll review the PH Breadcrumbs app, which allows you to add breadcrumbs to your Shopify product pages. Breadcrumbs are crucial for user navigation, especially if you have a complex hierarchy of collections and sub-collections. This app stands out by offering up to 5 levels of breadcrumbs and enhancing SEO through HTML-based JSON-LD structured data.
Why You Need Breadcrumbs
Breadcrumbs help users navigate through your store efficiently, especially if you have a multi-level product hierarchy. Additionally, they improve your SEO by adding structured data that search engines can easily read, helping your products appear more prominently in search results.
Unique Features of PH Breadcrumbs
- Up to 5 Levels of Breadcrumbs: Unlike other apps, PH Breadcrumbs allows up to 5 levels of product hierarchy.
- SEO-Friendly: Adds JSON-LD structured data in HTML, making it faster and easier for search engines to crawl your site compared to JavaScript-based solutions.
- Customizable: You can adjust font, color, alignment, and other CSS properties to match your store’s design.
Installation and Setup
- Install PH Breadcrumbs:
- Go to the Shopify App Store and search for “PH Breadcrumbs.”
- Click “Add app” and then “Install app.”
- You’ll get a 30-day free trial. After that, it’s $4.98 per month or $49.99 annually.
- Basic Configuration:
- After installation, go to the app settings.
- Configure global UI settings such as font size, color, alignment, and CSS customization.
- For example, set the font size to 16px and choose a font family that matches your store’s theme.
- Add Breadcrumbs to Your Product Page:
- Navigate to Online Store > Themes > Customize.
- Go to your product page template.
- Click Add section and select Breadcrumbs provided by the app.
- Customize the appearance of the breadcrumbs according to your preferences. Custom Navigation for Nested Breadcrumbs
- Create Custom Navigation:
- Go to Online Store > Navigation and click Add menu.
- Name it something like “New Breadcrumbs.”
- Add menu items corresponding to your collections (e.g., Collection 1, Collection 2, Collection 3).
- Nest these items to reflect your desired hierarchy.
- Link Custom Navigation in App Settings:
- Copy the handle of the newly created menu.
- Paste it into the Menu handles for breadcrumbs field in the app settings.
- This allows you to display up to 5 levels of breadcrumbs on your product pages. Verifying Structured Data
- View Page Source:
- Open your product page and view the page source.
- Look for the JSON-LD structured data, ensuring it is correctly formatted and readable by search engines.
- Test in Google Search Console:
- Use Google Search Console to test your live URL and verify the structured data.
- This ensures that your breadcrumbs are indexed correctly, enhancing your SEO.
Conclusion
PH Breadcrumbs is a powerful app that enhances both user navigation and SEO for your Shopify store. Its ability to support up to 5 levels of breadcrumbs and use HTML-based structured data makes it superior to many alternatives. Give it a try with the 30-day free trial and see the benefits for yourself!