Links Images, and Math (the basics)

Links

More documentation on links can be found here: Fumadocs link documentation

Other Pages

Use the Link component to link to other pages in your documentation. The href prop should be the path to the page you want to link to, starting within the docs directory.

Syntax

<Link href="/docs/test">Link to Test page</Link>

Example

Heading on Current Page

You can link to a heading on the current page by using the href="#<HEADING_NAME>" syntax, where HEADING_NAME is the name of the heading, all lowercase and with spaces replaced by hyphens.

Syntax

<Link href="#the-last-heading">Link to last heading on current page</Link>

Example

Heading on Another Page

You can combine the two previous methods to link to a heading on another page. Syntax

<Link href="/docs/test#code-blocks">
  Link to code block heading on another page
</Link>

Example

External Links

You can create external links using the normal markdown syntax or using the Link component with the external prop. If you'd prefer HTML, you can use also use the normal anchor (<a></a>) tag.

Normal Markdown Syntax

Syntax

[Kagi Search Engine](https://kagi.com/)

Example

Kagi Search Engine

Link component with external Prop

Syntax

<Link href="https://kagi.com/" external>
  Kagi Search Engine
</Link>

Example

HTML Anchor Tag

Of course, you can also use the normal HTML anchor tag to create external links. Make sure to use the target="_blank" attribute if you'd like to open the link in a new tab.

Syntax

<a href="https://kagi.com/" target="_blank">Kagi Search Engine</a>

Example

The Last Heading

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.

Images

Syntax Import the image using the normal markdown syntax, specifying the path to the image file. In this example, the image is in the same directory as the current file. We give it an image description within the brackets.

![A black cat with yellow eyes](./cat.jpeg)

Example

Math

Inline

Syntax

Here's my math equation: $c = \pm\sqrt{a^2 + b^2}$, it's inline!

Example

Here's my math equation: $c = \pm\sqrt{a^2 + b^2}$, it's inline!

Block

Syntax

Here's my math equation, it's a block!

$$
c = \pm\sqrt{a^2 + b^2}
$$

Example

Here's my math equation, it's a block!

What's Next?