As your site grows beyond a few pages, you need clear ways to help visitors navigate your content. Xanthan provides multiple navigation patterns, each suited for different types of content and site structures.
This section covers the built-in navigation systems—from simple menu bars to dynamic card grids and interactive maps.
The top navbar is the horizontal menu at the top of every page. It’s your site’s main navigation structure, visible on all pages.
Key features:
_data/top-nav.yml)Cards are visual navigation elements that automatically generate links to pages in a folder. Think of them as automatic directories that pull titles, authors, and summaries from your page metadata. There are several styles of cards that come with Xanthan, and of course you can create your own.
Compact, text-focused cards in a grid layout
Wide horizontal cards in a vertical stack
Traditional card grid layout
When to use: Student essay collections, project portfolios, team directories, any folder of similar pages you want to showcase.
The left sidebar provides persistent navigation for all pages in a specific folder, visible while reading any page in that section.
Key features:
When to use: Collaborative class projects, documentation sites, any collection where it’s useful to have a ToC style of list links always on the screen so readers can easily jump between related pages.
A map page automatically displays markers for any pages with geographic coordinates. Clicking a marker shows the page title and summary.
Key features:
How it works: Add geo: [latitude, longitude] and placename: to any page’s YAML header, and it automatically appears on the map.
Mix and match! You can use multiple navigation types together. For example, a class project might use: