Cómo realizar presentaciones Reveal.js con Orgmode

Cómo realizar presentaciones HTML con Reveal, una herramienta libre de Hakim que puedes descargar para su uso independientemente de Orgmode en su repositorio. También puedes usarla en su versión de slides.com. Desde que realicé este tutorial ha habido cambios que pueden afectar a la presentación de los contenidos pero el uso mínimo seguirá siendo igual.

Para que la presentación esté disponible en línea podéis subirla a un repositorio de Github y que se encargue de servirla. También puedes ponerla en un servidor propio, claro.

Org-Reveal

• Necesita org-mode, Reveal y org-reveal.
• Para usarla desde org-mode, hemos de descargarnos org-reveal: https://github.com/yjwen/org-reveal
• jr0cket tiene una guía que se puede utilizar de base: - http://jr0cket.co.uk/2013/10/create-html5-presentations-emacs-revealjs.html.html
• Hay que tener instalado y configurado orgmode en nuestro Emacs

Markdown

1
2
3
4
5
6
7

<section data-markdown>
    <script type="text/template">
	## Título de página

	Un párrafo con algo de texto y un enlace [link](https://infotics.es).
    </script>
</section>

Configuración

Configuración de Emacs

El directorio raíz de Reveal se declara con la variable org-reveal-root en Emacs

1

(setq org-reveal-root "file:///d:/reveal.js")

Esta declaración se puede sobreescribir en el documento:

1

#+REVEAL_ROOT: file:///d:/reveal.js

Activar la librería

• Para activar la librería, cargamos con M-x load-library
• Y seleccionamos (escribimos) ox-reveal
• A partir de ahora ya podremos exportar a Reveal con el atajo C-c C-e R R

Encabezamientos

• Reveal contempla hasta 3 niveles de encabezamientos. En encabezamientos de mismo nivel.
• Actúa como un paginador, de izqda. a dcha., mientras que los encabezamientos de menor nivel se encuentran por debajo.
• Si queremos modificar esto, hemos de cambiar la variable org-reveal-hlevel.

Por ejemplo, si en vez de 3 niveles sólo quisiéramos 2, en el archivo de configuración de Emacs se pondría:

1

(setq org-reveal-hlevel 2)

Para que afecte a un documento concreto, se añadiría la variable de documento:

1

#+REVEAL_HLEVEL 2

Configuración de orgmode

1
2
3

#+OPTIONS: reveal_center:t reveal_progress:t reveal_history:nil reveal_control:t
#+OPTIONS: reveal_mathjax:t reveal_rolling_links:t reveal_keyboard:t reveal_overview:t num:nil
#+OPTIONS: reveal_width:1200 reveal_height:800

Opciones de LaTeX:

1

#+OPTIONS : toc:1 reveal_mathjax:t

Dimensiones:

1
2
3

#+REVEAL_MARGIN: 0.1
#+REVEAL_MIN_SCALE: 0.5
#+REVEAL_MAX_SCALE: 2.5

Temas

Cada tema define unos estilos.

• beige
• black
• blood
• league
• moon
• serif
• simple
• sky
• solarized
• white

Transiciones

Se declaran en el documento con la variable REVEAL_TRANS

1

#+REVEAL_TRANS: linear

• Pueden ser:
  • default
  • cube
  • page
  • concave
  • zoom
  • linear
  • fade
  • none

Velocidad

Se puede configurar la velocidad con la variable REVEAL_SPEED

1

#+REVEAL_SPEED: 1

Dividir

Si una diapositiva tiene mucho contenido, se puede dividir automágicamente en dos con la opción split

1

#+REVEAL: split

Fondo

A través de Properties de org con la opción reveal_background, se declara un color o una imagen.

Color

Un color de fondo con:

1
2
3
4

,:PROPERTIES:
,:reveal_background: #FF0000
,   :EXPORT_HUGO_CUSTOM_FRONT_MATTER+: :authors '("adolflow")
:END:

Una imagen

Una imagen de fondo con:

1
2
3

,:PROPERTIES:
,:reveal_background: ruta-imagen/imagen.png
,:reveal_background_trans: slide

Estructura

1
2
3
4
5
6

* Diapositiva 1
* Diapositiva 2
** Diapositiva 2.1
** Diapositiva 2.2
** Diapositiva 2.3
* Diapositiva 3

Imágenes

Se añaden como en org:

1

file://ruta-imagen.png