Recursos de Sintaxe Markdown Estendida para Blogs Técnicos

Geração Automática de Sumário

Para criar um índice navegável automaticamente no início do documento, utilize a diretiva específica abaixo. O sistema renderizará a lista de cabeçalhos baseada nesta marcação.

@[TOC](Índice do Conteúdo)

Estilização Avançada de Texto

Realce e Cores

É possível destacar trechos importantes utilizando duplo igual ou tags HTML para coloração personalizada.

==Texto em realce==
<font color=purple>Texto Roxo</font>
<font color=orange>Texto Laranja</font>

Exemplo renderizado: Texto em realce Texto Roxo Texto Laranja

Código Inline

Para mencionar comandos ou variáveis dentro do parágrafo, use crases simples.

`comando_exemplo`

Exemplo: comando_exemplo

Listas de Definição

Utilize dois pontos para associar um termo à sua descrição, criando uma lista semântica.

Termo Técnico
: Explicação detalhada do conceito

API
: Interface de Programação de Aplicações que permite a comunicação entre diferentes softwares

Adicione referências bibliográficas ou notas explicativas sem interromper o fluxo principal do texto.

Este padrão é amplamente adotado na indústria.[^1]
[^1]: Martin, R. C. Clean Code: A Handbook of Agile Software Craftsmanship. 2008.

O resultado exibe um link saltável para a referência no final da página: Este padrão é amplamente adotado na indústria.1

Blocos de Citação

Para destacar trechos de documentação ou conceitos extenros, utilize o símbolo de maior.

> O uso de índices em bancos de dados melhora a velocidade de recuperação de consultas, mas pode reduzir a performance em operações de escrita devido à manutenção da estrutura.

O uso de índices em bancos de dados melhora a velocidade de recuperação de consultas, mas pode reduzir a performance em operações de escrita devido à manutenção da estrutura.

Para exibir o caractere literal >, utilize a barra invertida antes: \>.

Subscritos e Sobrescritos

Notação matemática ou química pode ser representada usando til e circunflexo.

H~2~O e E=mc^2^

Resultado: H2O e E=mc2

Navegação Interna com Ancoras

Crie links que levam o leitor para seções específicas dentro da mesma página.

<a href="#secao-destino" >Ir para a seção</a>
...
<span id="secao-destino">Conteúdo do Destino</span>

Ao clicar no link, a página rola até o elemento com o ID correspondente.

Imagens com Parâmetros

A sintaxe permite definir dimensões e alinhamento diretamente na URL da imagem.

  • Com tamanho específico: Adicione =larguraxaltura ao final.
  • Centralizada: Adicione #pic_center ao final.
  • Centralizada com tamanho: Combine ambas as opções.
!(https://exemplo.com/imagens/foto.jpg =100x100)
!(https://exemplo.com/imagens/foto.jpg #pic_center)
!(https://exemplo.com/imagens/foto.jpg #pic_center =100x100)

Blocos de Código com Destaque

Selecione o tema de highlighting nas configurações do editor. O bloco abaixo demonstra a sintaxe para linguagens específicas.

// Configuração do sistema
let estado = "inicializado";
const limite = 100;

Tags: Markdown syntax-extension technical-writing html-formatting

Publicado em 9-20 13:26