Buenos días | tardes | noches, seguimos con la segunda parte de los editores de markdown.
La primera parte es esta
En esta entrada os enseñare Marp, software para realizar presentaciones con el lenguaje Markdown.
¿Qué es Marp?
Marp, cómo he explicado en la introducción a la entrada, es un software que nos permite realizar presentaciones en PDF o en su extensión por defecto, MD. Esta aplicación es, en el mundo del software, una recién nacida y lleva poco tiempo.
Marp es una herramienta sencilla e intuitiva cómo MarkdownPad 2 y al igual que ella, tiene una vista previa del código que vayamos escribiendo para que podamos ver el resultado final mientras redactamos.
Marp está soportado en Windows, distribuciones Linux y Mac.
Para poder obtener Marp e “instalarlo” tan sólo tenemos que descargarnos el zip, descomprimirlo y hacerle un enlace simbólico al ejecutable (en el caso de las distribuciones Linux) para poder iniciar la aplicación.
Aprendiendo a usar Marp
Marp es realmente sencillo de utilizar. La sintaxis que utiliza es la misma que Markdown a excepción de la separación de las “diapositivas”, que Marp las separa con tres guiones.
Un ejemplo es el siguiente:
Cómo podemos observar, las “diapositivas” se han separado gracias a los tres guiones definidos entre las dos cabeceras.
Características de Marp
Estilos de vista previa
La principal característica de Marp es que podemos visualizar nuestra presentación de tres formas diferentes:
- Markdown: este estilo mostrará el resultado de la presentación tal y cómo se vería si subieramos el fichero a Github.
- 1:1 Slide: con este formato de vista previa podemos observar nuestra presentación tal y cómo se vería si la guardaramos cómo PDF.
- Slide list: esta vista previa muestra todas las “diapositivas” juntas, es decir, se muestra cómo si fuera una tira de fotomatón.
Emojis
Otra de sus características interesantes es que soporta emojis, si, esas caras de color amarillas que muestran diferentes expresiones faciales.
Los diferentes emojis que podemos insertar se encuentran en este enlace y, aunque no todos están soportados, la mayoría sí lo están.
Imágenes de fondo
Con Marp podemos agregar imágenes de fondo a las “diapositivas” que incluyamos. Tengo que decir que la imagen que definamos de background, sólo se definirá en la “diapositiva” en la que lo definamos.
Un ejemplo sería:
Cómo podemos ver, sólo se insertará en la primera “diapositiva” y no en la segunda ya que no está definida.
Aclarar que esto sólo se verá en el formato PDF y en las vistas previas 1:1 Slide y Slide List. No se verá en la vista previa Markdown ya que no está soportado (al menos yo no he encontrado la forma de hacerlo con la misma sintaxis)
Formulas matemáticas
Marp también permite la inserción de formulas matemáticas en dos formatos (los ejemplos usados son los definidos en su web):
No me meteré mucho en el mundillo de las formulas matemáticas avanzadas ya que no tengo el suficiente nivel para mostraros ejemplos.
Temas
Por defecto y únicos temas desarrollados a día de hoy, Marp cuenta con dos:
Default: el tema por defecto, con el fondo en blanco, colores sencillos y el tipo de letra común. (se puede ver un ejemplo en la imagen del ejemplo anterior)
Gaia: tema alternativo a Default, usa un fondo amarillento, mismos colores asignados a las letras y distinto tipo de letra para hacerla más gruesa (un estilo a bold).
Al cambiar de un tema a otro, nos aparecerá una directiva en la “diapositiva”, esto se aplicará para todas las demás.
En el siguiente apartado hablaremos sobre las directivas de Marp.
Directivas de páginas
Con Marp podemos hacer uso de las directivas de páginas para hacer más atractivas nuestras “diapositivas”. Podemos definir las directivas de páginas escribiendo al principio de la “diapositiva” lo siguiente:
<!-- $<nombre de la directiva>: <valor> -->
Gracias a ellas, podemos:
- Tamaño y grosor:
<!-- $width: 12in --> <!-- $size: 16:9 -->
- Insertar los números de páginas:
<!-- page_number: true -->
- Invertir los colores del tema (sólo afecta al tema Gaia):
<!-- template: invert -->
- Insertar un pie de página (uno por “diapositiva”/página):
<!-- footer: esto es un pie de página -->
- Insertar redenrizar para evitar errores al cargar imágenes de alta calidad:
<!-- prerender: true -->
Para insertar todas las directivas de páginas en un sólo “bloque”:
<!-- directiva1: valor1 directiva2: valor2 directiva3: valor3 ... -->
Si queremos que una directiva afecte sólo a una página, le incluimos un asterisco ( * ) delante del nombre de la directiva, ejemplo:
<!-- *$theme: gaia -->
Repositorio oficial
En el caso de que tengáis algún problema, podéis buscarlo o reportarlo en el repositorio oficial de Marp.
Recomendaciones de lectura
Si queréis tener aún más información acerca de Marp, los compañeros de ks7000 te dan mucha más información acerca de este recién nacido software.
Espero que os haya gustado, que hayais aprendido un poco más sobre las herramientas disponibles para Markdown y que conozcais ese mundillo que nos ofrece tal lenguaje.
Saludos y nos vemos en la siguiente entrada!
[…] “Editores de Markdown: MarkdownPad 2 y Marp (II)” por Aitor León. […]
Me gustaMe gusta
¡Muy buen resumen! Es que nosotros nos extendemos demasiado al realizar nuestras entradas, je, je, je 😉; un detallito que investigamos es la lista completa de los emoticones soportados:
https://github.com/markdown-it/markdown-it-emoji/blob/6a65f5183fe0145219805040988341bf76ade32e/lib/data/full.json (porque es una librería que se complia en Marp, [i]si no estamos equivocados[/i]).
Y NO MENOS IMPORTANTE la lista completa de los signos y código matemáticos (nosotros que estudiamos ingeniería mecánica en la Universidad de Carabobo “se nos quemaron las pestañas” con las matemáticas): https://khan.github.io/KaTeX/function-support.html
¡Gracias, feliz día y feliz exposición!
Me gustaLe gusta a 1 persona