---
title: "Como personalizar links e dicas de ferramentas no Markdown"
slug: "using-links-and-tooltips-in-markdown"
updated: 2026-06-22T08:58:57Z
published: 2026-06-22T08:58:57Z
canonical: "docs.document360.com/using-links-and-tooltips-in-markdown"
stale: true
---
> ## Documentation Index
> Fetch the complete documentation index at: https://docs.document360.com/llms.txt
> Use this file to discover all available pages before exploring further.
# Como personalizar links e dicas de ferramentas no Markdown
O editor Markdown suporta sintaxe padrão de links e, por meio de HTML inline, uma série de melhorias — dicas de ferramenta para passar o mouse de texto, estilo de link, abertura de links em novas abas e ícones ou emojis personalizados. Este artigo aborda todas essas técnicas.
---
## Quando usar essas técnicas
- **Links âncora internos** — ajudam os leitores a saltar para uma seção específica dentro de um artigo longo sem precisar rolar a página.
- **Links entre artigos** — conecte artigos relacionados na sua base de conhecimento para guiar os leitores por um tema.
- **Dicas** — explique abreviações, termos técnicos ou detalhes opcionais em linha sem sobrecarregar a página.
- **Links estilizados** — use texto em negrito ou itálico para chamar atenção para referências importantes.
- **Abrir em uma nova aba** — mantenha os leitores no artigo atual enquanto permite que abram uma referência em segundo plano.
- **Ícones e emojis** — adicione sinais visuais a chamadas, rótulos ou indicadores de status.
---
## Referência rápida
| Objetivo | Sintaxe |
| --- | --- |
| Elo âncora interno | `[Link text](#heading-slug)` |
| Link cruzado entre artigos | `[Link text](../article-slug)` |
| Link com dica de ferramenta | `[Link text](#section "Tooltip text")` |
| Texto do link em negrito | `[**Bold text**](url)` |
| Texto do link itálico | `[_Italic text_](url)` |
| Abrir em uma nova aba | `<a href="url" target="_blank">Link text</a>` |
| Passe o mouse sobre a dica de texto | `<span title="Full term">Abbreviation</span>` |
| Emoji inline | Cole diretamente — 📌 ⚠️ ✅ |
| Ícone inline a partir da URL | `<img src="icon-url" width="16" height="16"> Label` |
---
## Como adicionar links no Markdown
### Links âncora internos
Um link âncora interno leva os leitores a um título específico dentro do mesmo artigo.
1. Adicione um título ao seu artigo. Por exemplo:
```
## How it works
```
2. Crie o link usando este padrão:
```
[Jump to How it works](#how-it-works)
```
Quando um leitor clica neste link, ele é levado diretamente para a `## How it works` seção.
- Texto do link dentro de colchetes quadrados `[ ]`
- `#` seguido pelo texto do título entre parênteses `( )`
- Converta o cabeçalho para minúsculas e substitua os espaços por hífens
DICA PROFISSIONAL
Links âncora são insensíveis a maiúsculas minúsculas e espaços se tornam hífens automaticamente. Remova quaisquer caracteres especiais do rumo antes de construir o slug âncora.
### Links entre artigos
Para linkar para outro artigo na sua base de conhecimento, use o prefixo do artigo slug com `../` para avançar um nível em relação à posição atual do artigo.
```
[Go to Getting Started](../getting-started)
```
Este link sobe um nível em relação ao artigo atual e abre o `Getting Started` artigo.
### Adicionando uma dica de ferramenta a um link
Adicione uma dica de ferramenta que apareça ao passar o curso, colocando o texto da dica entre aspas após o alvo do link, dentro dos parênteses.
```
[Troubleshooting guide](#troubleshooting "Click to view troubleshooting section")
```
Passando o mouse sobre o link exibe: *Clique para ver a seção de solução de problemas*.
### Texto do link de estilo
Aplique formatação em negrito ou itálico ao texto de link, envolvendo o texto dentro dos colchetes quadrados com a sintaxe padrão do Markdown.
```
[**Important update**](../release-notes)
[_Read the guide_](../setup-guide)
```

### Abrindo um link em uma nova aba
Por padrão, os links do Markdown abrem na mesma aba. Use uma tag HTML `<a>` com `target="_blank"` para abrir o link em uma nova aba.
```
Go to Getting Started
```
---
## Como adicionar dicas de hover ao texto
Use a tag HTML `<span>` com um `title` atributo para exibir uma dica de ferramenta quando um leitor pairar sobre qualquer palavra ou frase — não apenas links.
```
term
```
**Exemplo — expanda uma abreviação para o hover:**
```
SEO
```
Passando o mouse sobre os displays *SEO* : *Otimização para Mecanismos de Busca*.

**Desfecho:**

---
## Como adicionar ícones e emojis
### Usando emojis
Copie e cole emojis diretamente no seu conteúdo. Eles renderizam em linha sem nenhuma sintaxe adicional.
```
📌 Important note
⚠️ Caution
✅ Completed
```
### Usando ícones de uma URL
Use uma tag HTML `<img>` para inserir um ícone de uma URL externa alinhada com seu texto.
```
Information
```
Substitua a `src` URL, `width`, `height`, e rotule o texto pelos valores necessários.

---
## Melhores práticas
- **Use texto descritivo do link** — evite "clique aqui" ou "leia mais". Use texto que indique aos leitores para onde o link vai, como "Guia de Iniciação" ou "Referência da API".
- **Teste links âncora após editar títulos** — se você renomear um título, qualquer link âncora apontando para ele vai quebrar. Atualize o slug em todos os links que referenciam o título.
- **Use tooltips para abreviações, não definições** — tooltips são lidos apenas no passa-mouse e não são acessíveis a todos os usuários. Para definições essenciais, inclua a explicação no texto principal.
- **Mantenha o uso consistente de emojis e ícones** — concorde com um pequeno conjunto de ícones ou emojis para sua base de conhecimento (por exemplo, ⚠️ para avisos, ✅ para etapas concluídas) e use-os de forma consistente entre os artigos.