Menus and links

The header and footer menus

Both menus are in site.yaml, under menus:. main is the header; footer is the footer.

menus:
  main:
    - { name: Home, url: / }
    - { name: Menu, url: /menu/ }
    - { name: About, url: /about/ }
    - { name: Contact, url: /contact/ }
  footer:
    - { name: Tags, url: /tags/ }
    - { name: Feed, url: /articles/feed.xml }
    - { name: Privacy, url: /privacy/ }

Each line is one link: name is what people see, url is where it goes. They appear in the order you list them.

To add a link, copy a line, keep its indentation, and change the name and address. To remove one, delete its line. To link to another site, use its full address and add external: true:

    - { name: Our shop, url: "https://shop.example.org", external: true }

Put quotation marks around an address with : in it, like the https:// one above.

In the editor, menus are changed in Files: open site.yaml, change the lines, and save. The editor shows exactly what changed before it saves.

Links between pages

In a page, link to another page of your site by its address, starting with /:

See our [opening hours](/opening-hours/), or [get in touch](/contact/).

Link to a heading on a page by adding # and the heading in lowercase, with dashes for spaces: /about/#how-we-bake goes to the heading "How we bake".

If you link to a page that doesn't exist, the checks say so before you publish, with the page the broken link is on.

When a page moves

If you rename a page's file, its address changes, and anyone who saved or shared the old one would find nothing. Add a redirect in site.yaml, so the old address sends people to the new one:

redirects:
  - from: /hours/
    to: /opening-hours/

In the editor, Move… does all of this in one step: it renames the file, adds the redirect, and updates older redirects that pointed at the old address. Redirects in the site view lists them all.

Importing a site adds a redirect for every old address by itself.