[Jekyll] Escape liquid template

{{ 여기 쓴 내용 }} 그대로 출력하는 법

🌊 Liquid Template(Code)

Jekyll은 Liquid Template을 준용한다. Liquid Template은 {{, }}나 {%, %}로 둘러싸인 코드인데, 문장 안에 코드를 넣어 다양한 표현을 가능하게 한다. Liquid Template은 크게 Object, Tag, Filter로 구분하여 사용한다. 간단하게 살펴보면 다음과 같다.

- Object

이중 중괄호로 둘러싸인 코드가 Object이다. 주로 변수를 출력할 때 사용한다.

{{ text }}
{{ false }}

- Tag

{% %}로 둘러싸인 코드가 Tag이다. 대부분의 Tag는 시작 태그와 종료 태그로 짝을 지어 사용하며, 변수 선언, 조건문, 반복문, 주석문, raw문 등으로 사용된다.

{% assign age = 26 %}
{% for fruit in fruits %}
{% endfor %}

- Filter

Filter는 오브젝트 또는 태그와 함께 사용되며, 출력 결과에 영향을 줄 수 있는 문법 요소이다. 아래와 같이 append를 사용하여 문자열을 이어붙일 수도 있고, abs로 절대값을 반환할 수도 있으며, at_least, at_most 등으로 출력값의 범위를 지정할 수도 있다.

{{ "Hello" | append: " World!" }}

 

⛔️ Escape Liquid Template

이런 Liquid Template을 변수가 아니라 그대로 출력하기 위해서는 두 가지 방법이 있다.

1. {% raw %}, {% endraw %} 태그 사용

변수가 아니라 liquid template을 그대로 보여주고 싶은 부분의 앞, 뒤에 {% raw %}, {% endraw %}를 사용해 감싸주면 된다. 사용 예시는 다음과 같다.

{% raw %} {{ content }} {% endraw %}

2. 쌍따옴표와 이중 중괄호 사용

{% raw %}, {% endraw %}를 출력하기 위해 찾은 방법이다. 예시를 통해 설명하자면 다음과 같다.

# 실제 코드
{{ "{%" }} raw %}
# 출력 형태
{% raw %}

# 실제 코드
{{ "{{" }} sample }}
# 출력 형태
{{ sample }}

이런 식으로 출력하고자 하는 코드의 시작 괄호, 즉 {%나 {{를 {{ "여기" }} 에 넣으면 정상적으로 보이는 것을 확인할 수 있다.

참고 : Liquid Template, How to escape liquid template tags