Nuxt

Setting up a Nuxt site

A Nuxt site built with Nuxt Content — or a theme on top of it, like Docus — keeps its pages as Markdown in content/. Add a short content map to orbit.config.yaml, at the root of the site, and Orbit edits them through a form.

The quickest start is the Docus docs site in Orbit Extras, already set up.

The content map

For a Docus site — pages in section folders, a landing page at content/index.md:

# orbit.config.yaml
assetsDir: public

sections:
  docs:
    files: content/*/*.md
    template: nuxt.config.ts
  home:
    files: content/index.md

data:
  - path: content/1.getting-started/.navigation.yml
    label: Getting Started (menu)
  • files — content/*/*.md keeps pages inside the section folders; the landing page is its own fixed section.
  • template — Nuxt Content (and Docus) render every file in content/ with a catch-all page. If that page is in your site (app/pages/[...slug].vue), name it; with Docus it lives inside the theme, so name nuxt.config.ts, where Docus is switched on. Either way, it’s your word that a new file becomes a page.
  • Folder menus — each section’s .navigation.yml (its title and icon) can be listed under data:.

With no fields, Orbit works the form out from your pages — title, description and Docus’s navigation and seo groups.

Things to know

  • Order — Nuxt Content orders pages by a number in front of the file name (2.introduction.md). A page added in Orbit has no number, so it comes last.
  • Components in Markdown — Nuxt’s component syntax (::u-page-hero, :::u-button) is kept exactly as written and renders on the site, but editors see it as text. Keep component-heavy pages (like a landing page) for developers.
  • Images in public/ are written from the site root (/mountains.webp).

Check it

Open the site in Orbit and go to Site settings ▸ What Orbit edits: each section should list its pages and say new pages built by your template.