Slot Sugar for Layouts

Some layouts can provide multiple contributing points using Vue's named slots.

For example, in two-cols layout, you can have two columns left (default slot) and right (right slot) side by side.

---
layout: two-cols
---

<template v-slot:default>

# Left

This is shown on the left

</template>
<template v-slot:right>

# Right

This is shown on the right

</template>

Left

This shows on the left

Right

This shows on the right

We also provide a shorthand syntactical sugar ::name:: for slot name. The following works exactly the same as the previous example.

---
layout: two-cols
---

# Left

This is shown on the left

::right::

# Right

This is shown on the right

You can also explicitly specify the default slot and provide it in the custom order.

---
layout: two-cols
---

::right::

# Right

This shows on the right

::default::

# Left

This is shown on the left