TSF v5.0 added breadcrumbs to every post, page, term, and archive. These are outputted for search engines via structured data, but you can also output them directly on your site via a shortcode.

Basic syntax

The most basic form of the shortcode, [tsf_breadcrumb], which will look like this:

Separator attribute

You can add a custom separator to the breadcrumb. [tsf_breadcrumb sep="👉"] will look like this:

Please note that the separator is added via the CSS content property. HTML-encoded entities, like •, won’t work. And, because WordPress sometimes outputs backward solidi (\) incorrectly, you may need to add two backslashes to use CSS-encoded Unicode. So, for a bullet (•), you’d have to use [tsf_breadcrumb sep="\\2022"].

WordPress is perfectly capable of storing Unicode since version 4.2. So, to work around all these issues, we recommend inserting special entities directly. [tsf_breadcrumb sep="•"] will look like this:

Home attribute

You can add also rename the first breadcrumb entry, “Home.” [tsf_breadcrumb home="TSF Home"] will look like this:

You can combine the syntax and also change the separator. [tsf_breadcrumb home="TSF Home" sep="⇒"] will look like this:

Title attribute

You can choose which title type to use for breadcrumb items. By default, the shortcode uses the setting configured under SEO Settings → Schema.org → Breadcrumbs.

To override the setting, use [tsf_breadcrumb title="meta"] to consider meta titles which may include custom overrides, or [tsf_breadcrumb title="page"] to use plain page titles.

Class attribute

Finally, you can change the class. You’ll need this if you want to output a different type of separator (we did that without telling you for the examples above). The syntax is as follows, and is meant for developers that implement custom CSS: [tsf_breadcrumb class="my-example-class"]