Snippets🔖

Sometimes you want to repeat a certain element, or you want to create your own element. Snippets allow you to do exactly that.

Examples🔖

Example 1: Block🔖

Here is a simple example of a snippet for using a protect element with the same password and id across your hyperbook.

The snippet located in snippets/password.md.hbs:

:::protect{id="1" password="hyperbook" description="The password is the name of this project."}

{{{ content }}}

:::

{{#if hint}}

:::alert{info}

Hyperbook is the password.

:::

{{/if}}

The markdown you need to place in your hyperbook:

:::Snippet{#password}

:smiley:

:::

The result:

Example 2: Block with Parameter🔖

You can also pass parameters to your snippet to make them dynamic. For example our password snippet from above allows to pass a hint parameter. If the hint parameter is true, a alert element will be shown.

:::Snippet{#password hint=true}

::qr{value="https://hyperbook.openpatch.org" size="XL"}

:::

Example 3: Inline🔖

{{#times n}}
  :smiley:
{{/times}}

:Snippet{#smiley n=10}

We are ten smilies: 😃 😃 😃 😃 😃 😃 😃 😃 😃 😃

Parameters🔖

You can use the parameters by using curly brackets and the name of the parameter.

{{{p1}}}

Three curly brackets will give you the raw content.

Two curly brackets will give the HTML-escaped content.

Content🔖

If your snippet spans across multiple lines, you can use the content parameter to use those. See Example 1.

Helpers🔖

You can use the following helpers in your snippets

if🔖

You can use the if helper to conditionally render a block.

{{#if p}}
  content
{{/if}}

unless🔖

You can use the unless helper as the inverse of the if helper. Its block will be rendered if the expression returns a falsy value.

{{#unless hint}}
  content
{{/unless}}

times🔖

You can use the times helper to repeat block.

{{#times 10}}
  Hi
{{/times}}

file🔖

You can use the file helper to include the content of a file.

{{{file "/archives/project-1/main.c"}}}

You can also only use a few lines of the file.

{{{file "/archives/project-1/main.c" "1,3-4"}}}

And you can define an ellipsis.

{{{file "/archives/project-1/main.c" "1,3-4" "// ..."}}}

base64🔖

You can use the bae64 helper to embedded media, even from external folders.

{{base64 "path/relative/to/root/folder"}}

This works best in conjunction with the image block:

![]({{base64 "path/relative/to/root/folder"}})

concat🔖

{{concat "Hi" " there"}}

Hi there

camelcase🔖

{{camcelcase "This is a test"}}

thisIsATest

pascalcase🔖

{{pascalcase "This is a test"}}

ThisIsATest

dashcase🔖

{{dashcase "This is a test"}}

This-is-a-test

lowercase🔖

{{lowercase "This is a test"}}

this is a test

uppercase🔖

{{lowercase "This is a test"}}

THIS IS A TEST

replace🔖

{{replace "Give me Banana Banana" "Banana" "Apple"}}

Give me Apple Banana

replaceAll🔖

{{replaceAll "Give me Banana Banana" "Banana" "Apple"}}

Give me Apple Apple