目次
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: jekyllを使って作るサイトの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: jekyllを使って作るサイトの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プラグインの設定
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のディスクリプションの設定です。
プラグイン設定
プラグインやサイトを管理するため、私たちが使っている設定です。詳しい内容は各ブログを確認してください。
- paginate_path: Paginationプラグインへ必要な設定。PaginationのURLを決定する。
- lang: 多言語プラグインが使う設定。現在ポストの言語が何であるか示す。
- comments: Disqusコメントのサービスのための設定です。
- description: ポストの上部へタイトルと一緒に表示する説明を設定する変数です。ヘッダーのデスクリプションにも活用します。
- image: ポストの代表イメージです。ポスト上部のバックグラウンドで使ってますし、ヘッダーのog:imageでも使ってます。
参考サイト
- jekyllホームページ(変数)): https://jekyllrb.com/docs/variables/
- jekyllホームページ(設定): https://jekyllrb.com/docs/configuration/
私のブログが役に立ちましたか?下にコメントを残してください。それは私にとって大きな大きな力になります!
アプリ広報
今見てるブログを作成た
興味がある方はアプリをダウンロードしてアプリを使ってくれると本当に助かります。
Deku
が開発したアプリを使ってみてください。Deku
が開発したアプリはFlutterで開発されています。興味がある方はアプリをダウンロードしてアプリを使ってくれると本当に助かります。