Links

Write links the plain Markdown way and OwnDocs picks the behavior from the destination. A trailing .mdx or .md is stripped from the href first, then the result decides the rendering: internal paths go through the Next.js Link component for client-side navigation, external URLs open in a new tab with rel="noopener noreferrer", and # targets stay on the page.

Quick Start

One internal path, written as an ordinary Markdown link.

Introduction

[Introduction](/getting-started/introduction)

Adding Options

Internal and external side by side

Both forms sit in the same sentence, and only the external one gets the new-tab treatment.

Read the code blocks page, then check the Next.js documentation.

Read the [code blocks page](/features/code/code-blocks), then check the
[Next.js documentation](https://nextjs.org/docs).

Titles

A quoted string after the destination becomes the title attribute, which browsers show as a tooltip on hover. It works on internal and external links alike.

Hover Lists or the Next.js docs.

Hover [Lists](/features/markdown/lists 'Nesting and task lists') or the
[Next.js docs](https://nextjs.org/docs 'App Router reference').

Wrap the destination in angle brackets when it contains spaces, as in [text](</my page>), and the parser encodes them for you.

Advanced

Anchors and relative paths

Every heading gets an id slugified from its text, so ## Adding Options answers to #adding-options. Relative paths resolve against the current page, and the last two links below land on the same route because the extension is dropped.

• Anchor: Jump to Adding Options
• Relative with extension: Lists
• Relative without extension: Lists

- Anchor: [Jump to Adding Options](#adding-options)
- Relative with extension: [Lists](./lists.mdx)
- Relative without extension: [Lists](./lists)

Stripping runs on every href, external ones included, so [Spec](https://example.com/spec.md) requests https://example.com/spec. Point at a raw file through a query string or a redirect instead.

Reference-style links

Move the destination out of the sentence and give it a label. The full form names the label in a second bracket pair; the collapsed form leaves that pair empty and reuses the link text as the label. Definitions can sit anywhere in the file and never render.

The App Router and the MDX guide both cover routing. The same definition also backs an image: .

The [App Router][next-router] and the [MDX guide][mdx-guide] both cover routing.
The same definition also backs an image: ![OwnDocs icon][icon].
 
[next-router]: https://nextjs.org/docs/app
[mdx-guide]: https://mdxjs.com/docs/what-is-mdx/
[icon]: /img/icon.png 'OwnDocs icon'

Markdown also allows a shortcut form, [next-router] with no second bracket pair at all. It resolves, but this repo's remark lint rules reject it, so use the collapsed form [next-router][] when you want the label to be the text. For zoomable screenshots, reach for ImageZoom instead of a bare Markdown image.

Autolinks

GFM links bare URLs and email addresses as you type them. Two shapes have no live example on this page, because remark lint asks for an explicit [text](url) link and MDX rejects the angle-bracket form outright.

https://example.com      linked as-is
www.example.com          linked, with http:// added
name@example.com         linked as mailto:name@example.com
example.com              plain text, no scheme and no www
<https://example.com>    breaks the build; MDX reads < as JSX

Trailing punctuation stays out of the link, so see https://example.com/a. keeps the full stop as prose.

Footnotes

A [^label] marker in the text plus a [^label]: definition anywhere in the file gives you a numbered reference. Labels can be words rather than digits, and reusing one marker twice points both numbers at the same note.

Reading time is estimated at 200 words per minute¹, and the same figure drives the meta bar¹.

Reading time is estimated at 200 words per minute[^wpm], and the same figure
drives the meta bar[^wpm].
 
[^wpm]: Set in `lib/reading-time.ts`.

Note bodies do not stay where you wrote them. Every footnote on the page collects into a single Footnotes section at the very bottom, below the last heading, with a back-arrow to each reference.

Options