Can breadcrumbs display longer names? (etc.)

Is it possible – either as a feature addition or perhaps a CSS workaround – to make breadcrumbs display longer (or even complete) names?

Currently all but the shortest names are clipped, which needlessly restricts the breadcrumbs’ ability to reveal the context of the zoomed item. Here’s a typical example, with clipped names and wasted space:

(Zooming out yields no less clipping, only more wasted space. Disabling my custom CSS also doesn’t solve the problem.)

I would love to be able to either expand or eliminate the limit on the length of breadcrumb names, and also to allow the breadcrumbs to be split across multiple lines if necessary.

Does anyone else have similar wishes, or an idea for how to achieve it?

(A possible model for how Dynalist could one day extend breadcrumbs even further is Zim Desktop Wiki’s Pathbar. Like many path bars, its items have flexible width. More interestingly, the Pathbar offers five display modes:

  1. None (hidden)
  2. Recent pages (without duplication)
  3. Recently Changed pages
  4. History (which can include duplicates)
  5. Page Hierarchy (like Dynalist’s current breadcrumbs).

In my opinion, all of these possibilities fit with the concept of breadcrumbs: a simple device for more easily retracing one’s path through a forest of notes.)

For custom CSS:

.DocumentBreadcrumb-item {
     max-width: 200px;

Original is 150px, you can increase that as much as you want. It might not look super good but it should work! :slight_smile:

1 Like

One nice little thing that Dynalist had in the past was the visualiation of the full breadcrumb text as kind of a tooltip when you hovered the mouse onto any of its items. This way you could easily read the full name of a breadcrumb’s hop (when it’s contracted with “…” in the end) without having to click on it and be directed to another page.

At least in my computer (W10) and browser (Latest Chrome) this doesn’t show up any longer…

Do you think that’s feasible to be brought back?

Thanks Erica, that’s exactly what I was looking for! (In my opinion it does, in fact, look super good :smile:. Thankfully, because it’s a CSS tweak, everyone need not agree.)

I also found the word-wrap property. Between that and max-width, I was able to get the example pictured above to look like this:

or this (in a narrower window):


.DocumentBreadcrumb-item {
 max-width: 500px;
 word-wrap: normal;