How to customize links and tooltips in Markdown?

Adding and customizing links in Markdown

Internal or Anchor Links help users find relevant sections within an article quickly. You can link texts by using Markdown code snippets that you can directly paste in the editor. You can add two types of links:

Internal (anchor) links:

You can create a link that takes readers to a specific section within the same article. This is called an internal anchor link.

Steps:

1. Add a heading in your article.

   For example,

   ## How it works

2. Create the link using the heading name:

   • Write the link text inside square brackets [ ]

   • Add the heading name inside parentheses ( )

   • Before the heading name, add #

   • Convert the heading text to lowercase and replace spaces with hyphens (-)

   For example,

   [Jump to How it works](#how-it-works)

In this example, when users click the link, they are taken directly to the How it works section in the same article.

Cross-article links:

To link to a different article in the knowledge base:

• Add the link text inside square brackets [ ]

• Add the article URL (converted to lowercase with spaces replaced by hyphens) inside parentheses ( )

• Prefix the article URL with ../ to move one level up from the current article’s location before opening the target article

For example,

[Go to Getting Started](../getting-started)

In this example, the link first moves one level up from the current article’s location and then opens the Getting Started article.

PRO TIP

When adding internal/anchor links to texts,

• Remove special characters from heading anchors.

• Anchor links are case-insensitive, and space becomes hyphens -.

Once you’ve added links, you can customize them to improve readability, accessibility, and user experience.

Adding a title attribute

You can add a tooltip (title) that appears when you hover over the link and provides additional context about the link. Markdown doesn't have a built-in way to add tooltips to links. Use the below code snippet to add this customization:

[Troubleshooting guide](#troubleshooting "Click to view troubleshooting section")

For example, the above code snippet adds a tooltip to the hyperlink text that says ‘Click to view troubleshooting section‘ on hover.

Styling links with Markdown + HTML

Markdown supports inline HTML, which allows you to apply styles such as bold or italic within a link. This provides enhanced customization to the hyperlinks that you have added.

For example, use the below code snippet to apply styles such as bold and italic to a hyperlink text.

[**Important update**](../release-notes)  
[_Read the guide_](../setup-guide)  

Opening links in a new tab

By default, Markdown links open in the same tab. If you wish to open a link in a new tab, use the below HTML code snippet.

<a href="https://docs.document360.com/docs/getting-started" target="_blank">Go to Getting Started</a>

For example, by using the above code snippet, you will be navigated to the ‘Getting Started’ article in a new browser tab on click.

Adding tooltips or hover text in Markdown

Tooltips display helpful text when a user hovers over a word or phrase. Use tooltips to explain abbreviations, technical terms, or optional details without cluttering your content. Readers can hover for clarification without needing to navigate away.

Markdown doesn't have a built-in way to add tooltips to hover text. You can use the HTML tags provided in this article as a workaround to achieve this effect.

<span title="display-text">term</span>

For example, the below code snippet shows ‘Search Engine Optimization’ when a user hovers over the term SEO.

<span title="Search Engine Optimization">SEO</span>

Outcome