Wiki-specific Markdown

{{< details >}}

  • Tier: Free, Premium, Ultimate
  • Offering: GitLab.com, GitLab Self-Managed, GitLab Dedicated

{{< /details >}}

The following topics show how links inside wikis behave.

When linking to wiki pages, you should use the page slug rather than the page name.

Direct page link

A direct page link includes the slug for a page that points to that page, at the base level of the wiki.

This example links to a documentation page at the root of your wiki: 

[Link to Documentation](documentation)

A direct file link points to a file extension for a file, relative to the current page.

If the following example is on a page at <your_wiki>/documentation/related, it links to <your_wiki>/documentation/file.md: 

[Link to File](file.md)

A hierarchical link can be constructed relative to the current wiki page by using relative paths like ./<page> or ../<page>.

If this example is on a page at <your_wiki>/documentation/main, it links to <your_wiki>/documentation/related: 

[Link to Related Page](related)

If this example is on a page at <your_wiki>/documentation/related/content, it links to <your_wiki>/documentation/main: 

[Link to Related Page](../main)

If this example is on a page at <your_wiki>/documentation/main, it links to <your_wiki>/documentation/related.md: 

[Link to Related Page](related.md)

If this example is on a page at <your_wiki>/documentation/related/content, it links to <your_wiki>/documentation/main.md: 

[Link to Related Page](../main.md)

A root link starts with a / and is relative to the wiki root.

This example links to <wiki_root>/documentation: 

[Link to Related Page](/documentation)

This example links to <wiki_root>/documentation.md: 

[Link to Related Page](/documentation.md)

diagrams.net editor

{{< history >}}

{{< /history >}}

In wikis, you can use the diagrams.net editor to create diagrams. You can also edit diagrams created with the diagrams.net editor. The diagram editor is available in both the plain text editor and the rich text editor.

For more information, see Diagrams.net.

Plain text editor

To create a diagram in the plain text editor:

  1. On the wiki page you want to edit, select Edit.
  2. In the text box, make sure you’re using the plain text editor (the button on the bottom left says Switch to rich text editing).
  3. In the editor’s toolbar, select Insert or edit diagram ({{< icon name=”diagram” >}}).
  4. Create the diagram in the app.diagrams.net editor.
  5. Select Save & exit.

A Markdown image reference to the diagram is inserted in the wiki content.

To edit a diagram in the plain text editor:

  1. On the wiki page you want to edit, select Edit.
  2. In the text box, make sure you’re using the plain text editor (the button on the bottom left says Switch to rich text editing).
  3. Position your cursor in the Markdown image reference that contains the diagram.
  4. Select Insert or edit diagram ({{< icon name=”diagram” >}}).
  5. Edit the diagram in the app.diagrams.net editor.
  6. Select Save & exit.

A Markdown image reference to the diagram is inserted in the wiki content, replacing the previous diagram.

Rich text editor

To create a diagram in the rich text editor:

  1. On the wiki page you want to edit, select Edit.
  2. In the text box, make sure you’re using the rich text editor (the button on the bottom left says Switch to plain text editing).
  3. In the editor’s toolbar, select More options ({{< icon name=”plus” >}}).
  4. In the dropdown list, select Create or edit diagram.
  5. Create the diagram in the app.diagrams.net editor.
  6. Select Save & exit.

The diagram as visualized in the diagrams.net editor is inserted in the wiki content.

To edit a diagram in the rich text editor:

  1. On the wiki page you want to edit, select Edit.
  2. In the text box, make sure you’re using the rich text editor (the button on the bottom left says Switch to plain text editing).
  3. Select the diagram that you want to edit.
  4. In the floating toolbar, select Edit diagram ({{< icon name=”diagram” >}}).
  5. Edit the diagram in the app.diagrams.net editor.
  6. Select Save & exit.

The selected diagram is replaced with an updated version.