jekyll 설정

jekyll은 매우 유연한 시스템으로 사이트를 제작하기 위한 많은 설정 옵션들을 제공하고 있습니다. 설정은 _config.yml 파일에 작성합니다. 여기에서는 우리가 사용하는 옵션들 위주로 설명합니다.

변수

설정 파일 내용을 설명하기 앞서, 이해를 돕기 위해 jekyll이 기본적으로 가지고 있는 변수에 대해서 간단히 설명하겠습니다. 자세한 내용은 jekyll 홈페이지(변수)를 참고하세요.

변수 구분

site: 사이트 전반에 대한 정보입니다. _config.yml에 설정한 정보 및 기본적으로 jekyll이 제공하는 정보가 포함되어 있습니다.
page: 현재 페이지에 대한 정보를 가지고 있습니다. 페이지 상단에서 yml형식으로 작성한 정보가 포함되어 있습니다.
content: _layouts 폴더에 있는 layout 파일에서 사용되는 변수입니다. page에 작성된 내용이 담겨있습니다.

site 변수

_config.yml에 원하는 변수를 선언하여 site.변수명으로 해당 변수를 사용할 수 있습니다. 상단히 많은 플로그인들이 _config.yml에 플러그인에 필요한 변수들을 설정하여 사용하고 있습니다. 여기서는 전역 변수 site가 가지고 있는 변수들중 우리가 자주 사용하는 변수들만 설명합니다.

site.time: jekyll 명령을 실행한 시간입니다. 우리는 sitemap.xml에서 갱신된 시간을 표시하기 위해서, head에서 css의 캐시를 방지하기 위한 버전으로 사용하고 있습니다.
site.pages: _posts폴더에 있는 페이지 이외에 모든 페이지를 담고 있는 변수입니다. 우리는 역시 sitemap.xml에서 post 이외에 페이지들을 표시하기 위해 사용되며, Top 하단에 표시하는 카테고리 페이지를 표시하기 위해 사용합니다.
site.posts: _posts폴더에 있는 모든 페이지를 가지고 있습니다.
site.url: 해당 사이트의 URL입니다. 해당 사이트에 실제 URL(https://dev-yakuza.github.io)을 설정해서 사용합니다. bundle exec jekyll serve를 사용하여 로컬에서 테스트를 하는 경우, jekyll은 해당 URL을 무시하고 http://localhost:4000으로 설정합니다. 사이트를 실제 서버에 배포시 bundle exec jekyll build로 빌드할 때, 이 URL이 사용되여 빌드됩니다.

page 변수

전역 변수 page가 가지고 있는 변수들로써 page 상단에 yml 형식으로 설정한 내용이 포함되어 있습니다.

page.title: 해당 페이지에 제목을 나타냅니다. 우리는 <head> 태그안에 <title>태그에서 사용하고 있으며, 포스트 상단에 제목과 category 페이지에서 post의 리스트를 표시할때도 사용하고 있습니다.
page.url: 해당 페이지의 url입니다. sitemap.xml 등 페이지의 링크가 필요한 곳에서 사용하고 있습니다.
page.date: 포스트에 할당된 날짜입니다.
page.categories: 해당 포스트가 속한 카테고리 목록입니다.

jekyll 기본 설정

jekyll 홈페이지에 모든 설정 옵션에 대해 설명이 나와있습니다.
jekyll 홈페이지: https://jekyllrb.com/docs/configuration/
여기에서는 우리가 주로 사용하는 설정 옵션들을 설명합니다.

기본 설정 파일 내용

_config.yml 파일에 있는 내용입니다.

title: ...
email: '[email protected]'
description: ...
baseurl: ...
url: https://dev-yakuza.github.io
twitter_username: ...
github_username: ...
author: [email protected]

markdown: kramdown
plugins:
  - jekyll-feed
  - jekyll-paginate-v2
  - jekyll-polyglot
  - jekyll-seo-tag

exclude:
  - Gemfile
  - Gemfile.lock

# pagination
permalink: /:year/:month/
pagination:
  enabled: true
  per_page: 12
  sort_reverse: true
  limit: 0
  sort_field: 'date'
  permalink: '/page/:num/'
  title: ':title'
  trail:
    before: 2
    after: 2

# multilang
languages: ['ja', 'ko', 'en']
default_lang: 'ja'
exclude_from_localization: ['javascript', 'images', 'css']
parallel_localization: false

기본 설정

title: 사이트의 타이틀을 작성합니다. 기본적으로 head에서 사용되지만 우리는 페이지의 title을 사용함으로 이 설정 변수는 사용하고 있지 않습니다.
email: 사이트에 이메일을 설정합니다. 우리는 이 설정값으로 문의하기 페이지에서 메일 발송 기능에 사용하고 있습니다. 메일 발송 기능에 관해서는 메일 발송을 참고하세요.
description: title과 마찬가지로 페이지 head에 표시될 내용을 작성합니다. 하지만 우리는 페이지의 description을 사용하여 표기함으로 사용하지 않고 있습니다.
url: 해당 사이트의 URL입니다. 해당 사이트에 실제 URL(https://dev-yakuza.github.io)을 할당해서 사용합니다. bundle exec jekyll serve를 사용하여 로컬에서 테스트를 하는 경우, jekyll은 해당 URL을 무시하고 http://localhost:4000을 할당합니다. 사이트를 실제 서버에 배포시 bundle exec jekyll build로 빌드할 때, 이 URL이 사용되여 빌드됩니다.
author: 사이트의 작성자입니다. head의 author 메타 태그에 사용됩니다.
plugins: 사이트에서 사용할 플러그인들을 설정합니다.

플러그인용 설정

플러그인용 설정에 대한 설명은 해당 블로그 포스트에서 자세히 설명하겠습니다.

Pagination 플러그인 설정

Pagination 플러그인을 참고하세요.

permalink: /:year/:month/
pagination:
  enabled: true
  per_page: 12
  sort_reverse: true
  sort_field: 'date'
  title: ':title'
  trail:
    before: 2
    after: 2

다국어 플러그인 설정

다국어 플러그인을 참고하세요.

languages: ['ja', 'ko', 'en']
default_lang: 'ja'
exclude_from_localization: ['javascript', 'images', 'css']
parallel_localization: false

페이지 설정 파일 내용

_posts에 블로그 포스트 파일에 있는 내용입니다.

layout: 'post'
permalink: '/jekyll/configuration/'
paginate_path: '/jekyll/:num/configuration/'
lang: ...
categories: 'jekyll'
comments: true

title: ...
description: ...
image: '/assets/images/category/jekyll/configuration.jpg'

layout: page가 사용할 레이아웃을 설정합니다.
title: page의 타이틀을 설정합니다.
description: page의 설명을 설정합니다.