jekyll
지킬 테마를 변경하고 싶어서 학습하는 지킬 링크를 학습중
raw tag 를 사용하자
이 문서를 작성하며 liquid 문법을 사용하면서 문제가 발생했다. 예제 코드를 작성하면서 liquid tag를 써야했는데, 그런 경우 liquid compiler가 에러를 반환한다. 내 예제 코드에 정의되지 않은 변수가 추가된건데. 그걸 해결하기 위해 아래처럼 raw tag를 이용한다.
2. Liquid
https://jekyllrb.com/docs/step-by-step/02-liquid/
2.1 Objects
Objects tell Liquid to output predefined variables as content on a page. Use double curly braces for objects: {{ and }}.
For example, {{ page.title }} displays the page.title variable.
변수를 출력하게 해주는 객체. duble culry braces {{}}
사용
2.2 Tags
Tags define the logic and control flow for templates. Use curly braces and percent signs for tags: {% and %}.
For example:
{% if page.show_sidebar %}
<div class="sidebar">
sidebar content
</div>
{% endif %}
로직과 컨트를 제어하는 태그. {%
와 %}
로 감싸진다.
Filters
Filters change the output of a Liquid object. They are used within an output and are separated by a |.
For example:
{{ "hi" | capitalize }}
filter는 liquid object output을 변경한다. |
로 구분된다.
2.3 Front Matter
Jekyll이 Liquid를 처리하게 하려면 front matter
를 추가한다.
html 앞부분에 ---
로 시작하는 아래 내용을 추가한다.
---
# front matter tells Jekyll to process Liquid
---
실제론 이렇게 보인다.
---
---
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>Home</title>
</head>
<body>
<h1>{{ "Hello World!" | downcase }}</h1>
</body>
</html>
4. Layouts
Layouts are templates that can be used by any page in your site and wrap around page content. They are stored in a directory called _layouts.
Layouts은 사이트의 모든 페이지에서 사용될 수 있는 템플릿이다. 페이지 컨텐츠를 감싸고 있다. _layouts
디렉토리에 저장된다.
<!-- _layouts/default.html -->
<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>{{ page.title }}</title>
</head>
<body>
{{ content }}
</body>
</html>
위 코드를 보면 content
라는 변수가 있고 이를 html이 감싸고 있다. content
는 speical 변수이며 페이지의 내용이 들어간다.
layout을 사용하기 위해서 아래처럼 front matter
에 layout
을 추가한다.
---
layout: default
title: Home
---
<h1>{{ "Hello World!" | downcase }}</h1>
위처럼 front matter
를 추가 후 내용을 추가하면 content
에 hello world 가 들어간다.
5. Includes
include 추가하기 https://jekyllrb.com/docs/step-by-step/05-includes/