Plantillas #

Plantillas integradas #

As themes may override layouts behaviour, the best way to know exactly the usage, parameters and examples is referring their documentation.

center #

Displays the content in the middle of the screen.

cover #

Used to display the cover page for the presentation, may contain the presentation title, contextualization, etc.

default #

The most basic layout, to display any kind of content.

end #

The final page for the presentation.

fact #

To show some fact or data with a lot of prominence on the screen.

full #

Use all the space of the screen to display the content.

image-left #

Shows an image on the left side of the screen, the content will be placed on the right side.

Usage #

---
layout: image-left

# the image source
image: ./path/to/the/image

# a custom class name to the content
class: my-cool-content-on-the-right
---

image-right #

Shows an image on the right side of the screen, the content will be placed on the left side.

Usage #

---
layout: image-right

# the image source
image: ./path/to/the/image

# a custom class name to the content
class: my-cool-content-on-the-left
---

image #

Shows an image as the main content of the page.

Usage #

---
layout: image

# the image source
image: ./path/to/the/image
---

iframe-left #

Shows a web page on the left side of the screen, the content will be placed on the right side.

Usage #

---
layout: iframe-left

# the web page source
url: https://github.com/slidevjs/slidev

# a custom class name to the content
class: my-cool-content-on-the-right
---

iframe-right #

Shows a web page on the right side of the screen, the content will be placed on the left side.

Usage #

---
layout: iframe-right

# the web page source
url: https://github.com/slidevjs/slidev

# a custom class name to the content
class: my-cool-content-on-the-left
---

iframe #

Shows a web page as the main content of the page.

Usage #

---
layout: iframe

# the web page source
url: https://github.com/slidevjs/slidev
---

intro #

To introduce the presentation, usually with the presentation title, a short description, the author, etc.

none #

A layout without any existent styling.

quote #

To display a quotation with prominience.

section #

Used to mark the beginning of a new presentation section.

statement #

Make an affirmation/statement as the main page content.

two-cols #

Separates the page content in two columns.

Usage #

---
layout: two-cols
---

# Left

This shows on the left

::right::

# Right

This shows on the right

Plantillas personalizadas #

Crea un directorio layouts/ en la raíz de tu proyecto, y simplemente pon los componentes de la plantilla (layout) Vue en él.

Lee más en la sección de personalización.

Plantillas proveídas por temas #

Los temas pueden proveer plantillas o reemplazar aquellas existentes. Por favor, lea su documentación para aquello que provean.