breadcrumb navigation tutorial image

Breadcrumb Navigation is a type of secondary navigation that shows the user where they are currently on a website. This is a very simple but highly requested tutorial for you all to enjoy!

Check out our demo and take a look at Breadcrumb Navigation in action.

The term came from the Hansel and Gretel fairy tale in which the main characters create a trail of breadcrumbs in order to track back to their house. This similar idea allows a user to easily navigate backward through a website’s categories, and then finally to home. Use this incredibly easy tutorial to apply it to your site today.

Breadcrumb Navigation Tutorial:

Step 1:

Step 2:

  • Login to your WP Admin > Themify > Hook Content
  • Add a new hook content, select "content_start" location

Step 3:

  • Paste in: [breadcrumb]

Step 4:

  • If you want the breadcrumb to appear on the page view only: Click "+ Conditions", on the "General" tab, and checkmark the "Page Views" checkbox.

It’s a useful tool for websites of all kinds, especially for eCommerce sites, blogs, and portfolios. Now with this tutorial, you can add a breadcrumb navigation without editing the PHP template.

If you enjoyed this tutorial, please let us know in the comments below. We'd also love to hear about any future tutorials you'd like to see. Enjoy!