「Jekyll」の版間の差分

提供: ArchWiki
ナビゲーションに移動 検索に移動
(同期)
1行目: 1行目:
 
[[Category:ウェブサーバー]]
 
[[Category:ウェブサーバー]]
 
[[en:Jekyll]]
 
[[en:Jekyll]]
  +
[[es:Jekyll]]
 
[http://jekyllrb.com/ Jekyll] はシンプルなブログなどの静的サイト作成プログラムです。Ruby で書かれており GitHub の共同創立者 [http://tom.preston-werner.com/ Tom Preston-Werner] によって開発されました。テンプレートディレクトリ (ウェブサイトの型を記述します) を使って、Textile や Markdown と Liquid コンバーターで動作し、Apache などのウェブサーバーで公開できる完全な静的ウェブサイトを吐き出します。Jekyll は [http://pages.github.com/ GitHub Pages] で使われているエンジンでもあります。
 
[http://jekyllrb.com/ Jekyll] はシンプルなブログなどの静的サイト作成プログラムです。Ruby で書かれており GitHub の共同創立者 [http://tom.preston-werner.com/ Tom Preston-Werner] によって開発されました。テンプレートディレクトリ (ウェブサイトの型を記述します) を使って、Textile や Markdown と Liquid コンバーターで動作し、Apache などのウェブサーバーで公開できる完全な静的ウェブサイトを吐き出します。Jekyll は [http://pages.github.com/ GitHub Pages] で使われているエンジンでもあります。
   
34行目: 35行目:
 
== マークアップ言語の選択 ==
 
== マークアップ言語の選択 ==
   
There are numerous different markup languages that are used to define text-to-HTML conversion tools. Jekyll has two defaults; [[Wikipedia:Textile (markup language)|Textile]] and [http://daringfireball.net/projects/markdown/ Markdown]. Implementations of both are required as dependencies of Jekyll.
+
テキストから HTML に変換するツールを定義するマークアップ言語は様々なものが存在します。Jekyll はデフォルトで2つのマークアップ言語に対応しています。[[Wikipedia:Textile (markup language)|Textile]] [http://daringfireball.net/projects/markdown/ Markdown] です。Jekyll の依存パッケージとして両方の実装がインストールされます。
   
 
=== Textile ===
 
=== Textile ===
   
[[Wikipedia:Textile (markup language)|Textile]] is a markup language used by Jekyll.
+
[[Wikipedia:Textile (markup language)|Textile]] Jekyll によって使用されるマークアップ言語です。
{{note|RedCloth, a module for using the Textile markup language in Ruby, fails to install with gcc 4.6.0 (see: [http://jgarber.lighthouseapp.com/projects/13054/tickets/215-native-ext-compilation-failure RedCloth Ticket 215] and [http://jgarber.lighthouseapp.com/projects/13054/tickets/219-427-installation-issue-on-arch-linux-x64 219]). It is recommended that you install the current stable version 4.2.2 by {{ic|gem install RedCloth --version 4.2.2}}.}}
+
{{note|RedCloth (Ruby Textile マークアップ言語を使うためのモジュール) gcc 4.6.0 でインストールすることができません (参照: [http://jgarber.lighthouseapp.com/projects/13054/tickets/215-native-ext-compilation-failure RedCloth Ticket 215] [http://jgarber.lighthouseapp.com/projects/13054/tickets/219-427-installation-issue-on-arch-linux-x64 219]){{ic|gem install RedCloth --version 4.2.2}} コマンドで安定版の 4.2.2 をインストールすることを推奨します。}}
   
 
=== Markdown ===
 
=== Markdown ===
   
[http://daringfireball.net/projects/markdown/ Markdown] is a markup language and text-to-HTML conversion tool developed in Perl by [http://daringfireball.net/ John Gruber]. A Perl and a Python implementation of Markdown can be found in the official repositories, while numerous other implementations are available in the [https://aur.archlinux.org/packages.php?O=0&K=markdown&do_Search=Go AUR]. The default implementation of Markdown in Jekyll is [http://maruku.rubyforge.org/index.html Maruku].
+
[http://daringfireball.net/projects/markdown/ Markdown] はマークアップ言語であり、[http://daringfireball.net/ John Gruber] によって Perl で開発された、テキストから HTML に変換するツールのことも指します。Markdown Perl Python 実装は公式リポジトリに存在します。他の実装は [https://aur.archlinux.org/packages.php?O=0&K=markdown&do_Search=Go AUR] からインストールできます。Jekyll における Markdown [https://github.com/jekyll/jekyll/pull/1988 デフォルト実装] [http://kramdown.gettalong.org/ kramdown] です。
   
Additionally, it has been implemented in C as [http://www.pell.portland.or.us/~orc/Code/discount/ Discount] by [http://www.pell.portland.or.us/~orc/ David Parsons] and a Ruby extension was written by [http://tomayko.com/ Ryan Tomayko] as [https://github.com/rtomayko/rdiscount RDiscount]. You can install RDiscount with Rubygems as root '''or''' through {{Pkg|ruby-rdiscount}} package.
+
さらに、[http://www.pell.portland.or.us/~orc/ David Parsons] によって C で実装された [http://www.pell.portland.or.us/~orc/Code/discount/ Discount] と、[http://tomayko.com/ Ryan Tomayko] によって書かれた Ruby 拡張である [https://github.com/rtomayko/rdiscount RDiscount] が存在します。RDiscount root Rubygem を使うか、{{Pkg|ruby-rdiscount}} パッケージでインストールすることができます。
 
# gem install rdiscount -s <nowiki>http://gemcutter.org</nowiki>
 
# gem install rdiscount -s <nowiki>http://gemcutter.org</nowiki>
Then add the following line to your {{ic|_config.yml}}.
+
インストールしたら、以下の行を {{ic|_config.yml}} に追加してください:
 
markdown: rdiscount
 
markdown: rdiscount
   
If you are unfamiliar with Markdown, Gruber's [http://daringfireball.net/projects/markdown/basics website] presents an excellent introduction. Additionally, you can try out Markdown using Gruber's online [http://daringfireball.net/projects/markdown/dingus conversion tool].
+
Markdown がよくわからない場合、Gruber [http://daringfireball.net/projects/markdown/basics ウェブサイト] に詳しい説明が存在します。Gruber のオンライン [http://daringfireball.net/projects/markdown/dingus 変換ツール] を使うことで Markdown をネットから試すこともできます。
   
 
== 設定 ==
 
== 設定 ==
65行目: 66行目:
 
|-- _site
 
|-- _site
 
`-- index.html
 
`-- index.html
A default file structure is available from Daniel McGraw's [https://github.com/danielmcgraw/Jekyll-Base Jekyll-Base] page on GitHub.
+
デフォルトファイルの構造は GitHub にある Daniel McGraw [https://github.com/danielmcgraw/Jekyll-Base Jekyll-Base] ページに存在します。{{note|McGraw has also setup a more extensive default file structure on [https://github.com/danielmcgraw/danielmcgraw.com.git GitHub].}}
{{note|McGraw has also setup a more extensive default file structure on [https://github.com/danielmcgraw/danielmcgraw.com.git GitHub].}}
 
   
  +
{{ic|_config.yml}} ファイルには設定データを保存します。設定ファイルに記述さえる様々な設定はフラグとも呼ばれます。フラグの詳しい説明とデフォルト設定は
The {{ic|_config.yml}} file stores configuration data. It includes numerous configuration settings, which may also be called as flags. Full explanation and a default configuration can be found on
 
[https://github.com/mojombo/jekyll/wiki/Configuration GitHub].
+
[https://github.com/mojombo/jekyll/wiki/Configuration GitHub] で確認できます。
   
 
Once you have configured your {{ic|_config.yml}} to your liking you need to create the files that will be processed by Jekyll to generate the website.
 
Once you have configured your {{ic|_config.yml}} to your liking you need to create the files that will be processed by Jekyll to generate the website.
75行目: 75行目:
 
== 使用方法 ==
 
== 使用方法 ==
   
Next you need to create templates that Jekyll can process. These templates make use of the Liquid templating system to input data. For a full explanation check [https://github.com/mojombo/jekyll/wiki/template-data GitHub].
+
Next you need to create templates that Jekyll can process. These templates make use of the Liquid templating system to input data. For a full explanation check [http://jekyllrb.com/docs/variables/ GitHub].
   
 
Additionally, each file besides {{ic|/_layouts/layout.html}} requires a [https://github.com/mojombo/jekyll/wiki/yaml-front-matter YAML Front Matter] heading.
 
Additionally, each file besides {{ic|/_layouts/layout.html}} requires a [https://github.com/mojombo/jekyll/wiki/yaml-front-matter YAML Front Matter] heading.
103行目: 103行目:
 
=== 一般的なウェブサイトのレイアウトを作成 ===
 
=== 一般的なウェブサイトのレイアウトを作成 ===
   
This is a basic template for your website's general layout. It will be referenced in the [[Wikipedia:YAML|YAML]] Front Matter blocks of each file (see: [[#記事を作成|Creating a Post]]).
+
以下は一般的なレイアウトをしたウェブサイトのベーシックなテンプレートです。各ファイルの [[Wikipedia:YAML|YAML]] Front Matter ブロックで参照します (参照: [[#記事を作成|記事を作成]])
 
{{hc|_layouts/layout.html|<nowiki>
 
{{hc|_layouts/layout.html|<nowiki>
 
<!DOCTYPE HTML>
 
<!DOCTYPE HTML>

2016年7月22日 (金) 23:11時点における版

Jekyll はシンプルなブログなどの静的サイト作成プログラムです。Ruby で書かれており GitHub の共同創立者 Tom Preston-Werner によって開発されました。テンプレートディレクトリ (ウェブサイトの型を記述します) を使って、Textile や Markdown と Liquid コンバーターで動作し、Apache などのウェブサーバーで公開できる完全な静的ウェブサイトを吐き出します。Jekyll は GitHub Pages で使われているエンジンでもあります。

Werner は Jekyll のリリースを 彼のウェブサイト で2008年11月17日に発表しました。

インストール

Jekyll は RubyGems パッケージマネージャや AUR のパッケージを使うことで Arch Linux にインストールできます。どちらの方法を使うにしても公式リポジトリの Ruby パッケージをインストールする必要があります。

RubyGems (推奨)

ノート: RubyGems 1.8 以上では 数多の警告 が表示されます。

Jekyll をインストールする一番の方法は Ruby プログラミング言語のパッケージマネージャである RubyGems を使うことです。RubyGems は公式リポジトリruby パッケージで一緒にインストールされます。root で gem コマンドを使うことでマシンの全てのユーザーから利用できるように Jekyll をインストールすることができます。別のインストール方法は Ruby ページにあります。

Jekyll をインストールする前に RubyGems のアップデートを行って下さい:

$ gem update

それから gem コマンドを使って Jekyll をインストールします:

$ gem install jekyll

Arch における Gem の管理についての情報は Ruby#RubyGems を参照。

AUR (別の方法)

もしくは、AUR から ruby-jekyllAUR をインストールしてください。

Rubygems バイナリリポジトリ

非公式の quarry リポジトリから ruby-jekyllインストールしてください。

マークアップ言語の選択

テキストから HTML に変換するツールを定義するマークアップ言語は様々なものが存在します。Jekyll はデフォルトで2つのマークアップ言語に対応しています。TextileMarkdown です。Jekyll の依存パッケージとして両方の実装がインストールされます。

Textile

Textile は Jekyll によって使用されるマークアップ言語です。

ノート: RedCloth (Ruby で Textile マークアップ言語を使うためのモジュール) は gcc 4.6.0 でインストールすることができません (参照: RedCloth Ticket 215219)。gem install RedCloth --version 4.2.2 コマンドで安定版の 4.2.2 をインストールすることを推奨します。

Markdown

Markdown はマークアップ言語であり、John Gruber によって Perl で開発された、テキストから HTML に変換するツールのことも指します。Markdown の Perl と Python 実装は公式リポジトリに存在します。他の実装は AUR からインストールできます。Jekyll における Markdown の デフォルト実装kramdown です。

さらに、David Parsons によって C で実装された Discount と、Ryan Tomayko によって書かれた Ruby 拡張である RDiscount が存在します。RDiscount は root で Rubygem を使うか、ruby-rdiscount パッケージでインストールすることができます。

# gem install rdiscount -s http://gemcutter.org

インストールしたら、以下の行を _config.yml に追加してください:

markdown: rdiscount

Markdown がよくわからない場合、Gruber の ウェブサイト に詳しい説明が存在します。Gruber のオンライン 変換ツール を使うことで Markdown をネットから試すこともできます。

設定

デフォルトの Jekyll のディレクトリツリーは以下のようになっています。"." は Jekyll が生成したウェブサイトのルートディレクトリを示しています。

.
|-- _config.yml
|-- _layouts
|   |-- default.html
|   `-- post.html
|-- _posts
|   |-- 2010-02-13-early-userspace-in-arch-linux.textile
|   `-- 2011-05-29-arch-linux-usb-install-and-rescue-media.textile
|-- _site
`-- index.html

デフォルトファイルの構造は GitHub にある Daniel McGraw の Jekyll-Base ページに存在します。

ノート: McGraw has also setup a more extensive default file structure on GitHub.

_config.yml ファイルには設定データを保存します。設定ファイルに記述さえる様々な設定はフラグとも呼ばれます。フラグの詳しい説明とデフォルト設定は GitHub で確認できます。

Once you have configured your _config.yml to your liking you need to create the files that will be processed by Jekyll to generate the website.

使用方法

Next you need to create templates that Jekyll can process. These templates make use of the Liquid templating system to input data. For a full explanation check GitHub.

Additionally, each file besides /_layouts/layout.html requires a YAML Front Matter heading.

インデックスレイアウトを作成

This is a basic template for your index.html, which is used to render your website's index page.

---
layout: layout
title: Jekyll Base
---

<div class="content">
  <div class="related">
    <ul>
      {% for post in site.posts %}
      <li>
	<span>{{ post.date | date: "%B %e, %Y" }}</span> <a href="{{ post.url }}">{{ post.title }}</a>
      </li>
      {% endfor %}
    </ul>
  </div>
</div>

一般的なウェブサイトのレイアウトを作成

以下は一般的なレイアウトをしたウェブサイトのベーシックなテンプレートです。各ファイルの YAML Front Matter ブロックで参照します (参照: 記事を作成)。

_layouts/layout.html
<!DOCTYPE HTML>

<html>
  <head>
    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
    <meta name="author" content="Your Name" />
    <title>{{ page.title }}</title>
  </head>
  <body>
    <header>
      <h1><a href="/">Jekyll Base</a></h1>
    </header>
    <section>
      {{ content }}
    </section>
  </body>
</html>

記事のレイアウトを作成

This is a basic template for each of your posts. Again, this will be referenced in the YAML Front Matter blocks of each file (see: Creating a Post).

_layouts/post.html
---
layout: layout
title: sample title
---

<div class="content">
  <div id="post">
    <h1>{{ post.title }}</h1>
    {{ content }}
  </div>
</div>

記事を作成

The content of each blog post will be contained within a file inside of the _posts directorys. To use the default naming convention each file should be saved with the year, month, date, post title and end with the *.md or *.textile depending on the markup language used (e.g. 2010-02-13-early-userspace-in-arch-linux.textile). The date defined in the filename will be used as the published date in the post. Additionally, the filename will be used to generate the permalink (i.e. /categories/year/month/day/title.html). To use an alternate permalink style or create your own review the explanation on GitHub.

テスト

Textile や Markdown ドキュメントを元に静的な HTML ウェブサイトを生成するには jekyll を実行してください。--serve フラグを付けて Jekyll を実行することで生成した HTML ウェブサイトのテストを同時に行えます。

$ jekyll serve

もしくは jekyll にファイルの変更を監視して欲しい場合:

$ jekyll serve --watch

_config.yml でサーバーのオプションを定義することを推奨します。デフォルトではポート 4000 でサーバーが起動し、ウェブブラウザで localhost:4000 を開くことでアクセスできます。

参照