휴고는 글을 꾸미기 위해 markdown 문법을 사용하며 테마에서 shortcode로 추가적인 서식 설정이 가능하다.
hugo에서 지원하는 markdown

기본서식

Heading

글의 수준을 의미한다. hugobook에서는 # 은 ToC에 포함되지 않는다.
# ~ ######

# 제목
#### 강조

bold, italic

볼드처리된 텍스트 입니다.
기울임처리된 텍스트 입니다.

볼드처리된 **텍스트** 입니다.
기울임처리된 *텍스트* 입니다.

줄바꿈 (Line Breaks)

텍스트 이후___
스페이스 3개를 입력하면 됩니다.

연속적인 줄바꿈은 html

태그를 사용해야합니다

수평선

---
________________________
- - -
***
<hr>

인용구

안녕하세요

반갑습니다.

테스트

> 안녕하세요
> > 반갑습니다.
> # **테스트**

이모지 shortcode

:fire: :fire:
https://gist.github.com/rxaviers/7360908

shortcode

이미 만들어진 shortcode

https://hugo-book-demo.netlify.app/docs/shortcodes/buttons/
각각 들어가서 확인하면 된다.

expand shortcode의 실제 코드이다.

{{ warnf "Expand shortcode is deprecated. Use 'details' instead." }}
<div class="book-expand">
  <label>
    <div class="book-expand-head flex justify-between">
      <span>{{ default (i18n "Expand") (.Get 0) }}</span>
      <span>{{ default "↕" (.Get 1) }}</span>
    </div>
    <input type="checkbox" class="hidden" />
    <div class="book-expand-content markdown-inner">
      {{ .Inner | markdownify }}
    </div>
  </label>
</div>

Shortcode 만들기

가장 필요한 shortcode를 먼저 만들어보겠다.
hugo에서는 code영역이라도 shortcode가 적용되기 때문에 shortcode 형식의 코드는 작성할 수 없다.
{{_< ... >}} 에서 _부분을 제거하면 에러가 발생한다.
그렇다고 {으로 적으면 code 영역에서는 문자 그대로 출력된다.

이를 해결하기 위해 open_sc_brace 라는 shortcode를 생성했다.
개행을 없애기 위해 echo -n 으로 파일에 redirect했다.

$ echo -n "&#123;&#123;<" > layouts/shortcodes/open_sc_brace.html

{{< open_sc_brace >}}

이제 정상적으로 출력할 수 있게됐다.