Folder Breadcrumb Bar
Media folder toolbar with a clickable path, grid and list view toggle, sort picker, and New Folder and Upload actions.
Media folder toolbar with a clickable path, grid and list view toggle, sort picker, and New Folder and Upload actions.
Search blocks by description or jump to a page.
The source for every Application block is included with Basic and Pro. Pick a plan to copy the code.
Already purchased? Log in
Folder Breadcrumb Bar is the toolbar that sits above a media grid, showing the current path as Acme / Brand / 2026 with each ancestor segment a clickable link. The right side carries a grid vs list view toggle with aria-pressed states, a sort picker (Name A to Z, Last modified, Largest first), and two action buttons: New folder and Upload files. Below the divider a second row reports 148 items and 2.4 GB used, giving the folder context before the user touches anything.
Breadcrumbs are one array; the last segment renders as plain text, all earlier ones as links. The item count and size stat are the two numbers that answer the where am I and how full is this question before the grid loads.
Reach for this block at the top of any media or file browse view, wired to your folder tree and storage stats. Wire the view toggle to local state and persist the sort preference per user session.
A natural flow around it on an Application Pro page:
Before
After
One strong use is the brand asset library toolbar. Other breadcrumb bar contexts:
Tip: the folder meta row below the divider is prime space for a storage quota warning when a folder nears its limit.