Explore tidyverse with the funny monsteRs

How to add panelsets in plain markdown posts.

By Allison Horst in Theme features

January 2, 2021

Hi, I'm the here-bot cat!

Use me to find your way in your website.

Here I am:
content/blog/2021-01-25-panelsets-md/index.md

To remove me, delete this line inside that file: {{< here >}}

My content section is:
blog
My layout is:
single
Images in this page bundle:
/blog/2021-01-25-panelsets-md/featured.jpg

Courtesy of panelset.js by Garrick Aden-Buie, from his xaringanExtra package: https://pkg.garrickadenbuie.com/xaringanExtra/#/panelset

For example, this panelset:

Hello! 👋

hello

Goodbye 💨

goodbye

Was created by combining this theme’s panelset and panel shortcodes:

{{< panelset class="greetings" >}}
{{< panel name="Hello! :wave:" >}}
  hello
{{< /panel >}}
{{< panel name="Goodbye :dash:" >}}
  goodbye
{{< /panel >}}
{{< /panelset >}}

You could also revert to HTML as well. For example, this panelset:

Question

Which came first: the 🐔 or the 🥚?

Answer 🐣

Team 🥚 FTW!

Was created with this HTML code:

<div class="panelset">
  <div class="panel">
    <div class="panel-name">Question</div>
    <!-- Panel content -->
    <p>Which came first: the 🐔 or the 🥚?</p>
  </div>
  <div class="panel">
    <div class="panel-name">Answer 🐣</div>
    <!-- Panel content -->
    <p>Team 🥚 FTW!</p>
  </div>
</div>
Posted on:
January 2, 2021
Length:
1 minute read, 166 words
Categories:
Theme features
See Also: