Breadcrumbs
Show visitors where they are and help search engines understand it.
Breadcrumb trails for pages, posts, products, categories, archives, search and 404, with plain, pill or arrow styles, shortening on phones and BreadcrumbList schema.
Elementor widget
Requirements
- Elementor 3.5 or newer
- WordPress 6.2 or newer
- PHP 7.4 or newer
- Licence: Pro ($2 / year) — add it to the cart in Moduly
Add it to a page
- Edit the page with Elementor.
- In the widget panel, search for Breadcrumbs. Our widgets sit in the Moduly category and carry the Moduly badge.
- Drag it onto the page.
- Set it up in the Content tab, style it in the Style tab, and use Advanced for spacing, motion and visibility.
Settings
Trail
| Setting | What you can set |
|---|---|
| Trail | Automatic — the page being viewed or Custom items |
| Build For | The page being viewed, Example: latest post, Example: a child page, Example: a post category, Example: latest product, Example: a product category, Example: the shop page, Example: an author archive, … (11 in all) · For designing templates: shows the trail as it will look on that kind of page. Keep “The page being viewed” on live pages. |
| Items | each item: Label or Link |
| Start With Home | On / off |
| Home Label | Text |
| Home Icon | Icon picker |
| Icon Only (No Text) | The label stays for screen readers. |
| Include the Blog Page on Posts | On / off |
| Include the Shop on Products | On / off |
| Posts Show Their | Category (with parents), First tag or Nothing · The SEO plugin’s primary category is used when set (Yoast, Rank Math). |
| Products Show Their Category | On / off |
| Show the Current Page | On / off |
| Link the Current Page | On / off |
| Show on the Front Page | Off = no trail on the home page, where it would be just “Home”. |
| Shorten Titles To (characters) | Number |
| Structured Data | BreadcrumbList as JSON-LD, BreadcrumbList as microdata or None (my SEO plugin adds it) · Helps search engines show the trail in results. |
Layout
| Setting | What you can set |
|---|---|
| Style | Plain text, Pills or Arrow tabs |
| Separator | ›, /, →, •, |, Custom text or Icon |
| Separator Text | Text |
| Separator Icon | Icon picker |
| Text Before | Text |
| Alignment | Start, Center or End |
| Long Trails | Wrap onto more lines, One line, scroll sideways or Shorten: Home › … › parent › page · Per device — phones shorten by default. |
Labels
| Setting | What you can set |
|---|---|
| Search Results | %s is replaced by the search terms. |
| Page Not Found | Text |
| Author Archive | Text |
| Page Number | Text |
| Tag Archive | Text |
Style tab: design controls for Box, Items, Home, Separator or Current Page — colours, typography, spacing, borders and hover states.
Tips
- Start with the Style choice — it changes the overall look the most; fine-tune the rest afterwards.
Troubleshooting
- Changes not showing on the live page? Regenerate CSS in Elementor → Tools → Regenerate CSS & Data and clear any page cache.
Related
- Also available for Gutenberg (Breadcrumbs).
- Works well with: Advanced Search, Mega Menu, Nav Menu.