Botones

Los enlaces de Markdown se pueden convertir en botones gráficos agregando unas pocas propiedades CSS predefinidas.

Configuración

Los botones se habilitan con el plugin Attribute Lists:

Botones - Habilitación

# "mkdocs.yml"
markdown_extensions:
  - attr_list

El botón se crea agregando la propiedad CSS .md-button a continuación del enlace MD:

Botón vacío

[Texto botón](ruta_enlace){.md-button}

Botón vacío

[Texto botón](#){.md-button}

La propiedad CSS debe rodearse entre corchetes para funcionar.

El relleno se le agrega al botón con ayuda de la propiedad CSS .md-button--primary:

Botón primario

[Texto botón](#){.md-button .md-button--primary}

La clase .md-button debe incluirse; de otro modo el enlace se verá como un texto remarcado:

Botón primario - clase faltante

[Texto botón](#){ .md-button--primary}

Los íconos y emojis se agregan como parte del texto del enlace:

Botones con íconos

[Texto botón :fontawesome-brands-whatsapp:](#){.md-button}
[Texto botón :fontawesome-solid-paper-plane:](#){.md-button .md-button--primary}

Los iconos se manejan con la notación habitual de MkDocs. Más sobre el uso de íconos y emojis