「Jekyll」の版間の差分
ナビゲーションに移動
検索に移動
Kusanaginoturugi (トーク | 投稿記録) (→テスト: 記事を追加) |
Kusanaginoturugi (トーク | 投稿記録) (リダイレクト) タグ: 新規リダイレクト |
||
1行目: | 1行目: | ||
+ | #REDIRECT [[アプリケーション一覧/インターネット#静的サイトジェネレーター]] |
||
− | [[Category:ウェブ]] |
||
− | [[en:Jekyll]] |
||
− | [[es:Jekyll]] |
||
− | [https://jekyllrb.com/ Jekyll] はシンプルなブログなどの静的サイト作成プログラムです。Ruby で書かれており GitHub の共同創立者 [http://tom.preston-werner.com/ Tom Preston-Werner] によって開発されました。テンプレートディレクトリ (ウェブサイトの型を記述します) を使って、Textile や Markdown と Liquid コンバーターで動作し、Apache などのウェブサーバーで公開できる完全な静的ウェブサイトを吐き出します。Jekyll は [https://pages.github.com/ GitHub Pages] で使われているエンジンでもあります。 |
||
− | |||
− | Werner は Jekyll のリリースを [http://tom.preston-werner.com/2008/11/17/blogging-like-a-hacker.html 彼のウェブサイト] で2008年11月17日に発表しました。 |
||
− | |||
− | == インストール == |
||
− | |||
− | Jekyll は [[Ruby#RubyGems|RubyGems]] パッケージマネージャや [[AUR]] のパッケージを使うことで Arch Linux にインストールできます。どちらの方法を使うにしても公式リポジトリの Ruby パッケージをインストールする必要があります。 |
||
− | |||
− | === RubyGems (推奨) === |
||
− | |||
− | {{Note|RubyGems 1.8 以上では [https://github.com/rspec/rspec-core/issues/345 数多の警告] が表示されます。}} |
||
− | Jekyll をインストールする一番の方法は [[Ruby]] プログラミング言語のパッケージマネージャである [[Ruby#RubyGems|RubyGems]] を使うことです。RubyGems は {{Pkg|ruby}} パッケージで一緒にインストールされます。root で {{ic|gem}} コマンドを使うことでマシンの全てのユーザーから利用できるように Jekyll をインストールすることができます。別のインストール方法は [[Ruby#RubyGems|Ruby]] ページにあります。 |
||
− | |||
− | Jekyll をインストールする前に RubyGems のアップデートを行って下さい: |
||
− | |||
− | $ gem update |
||
− | |||
− | それから {{ic|gem}} コマンドを使って Jekyll をインストールします: |
||
− | |||
− | $ gem install jekyll |
||
− | |||
− | Arch における Gem の管理についての情報は [[Ruby#RubyGems]] を参照。 |
||
− | |||
− | === AUR (別の方法) === |
||
− | |||
− | もしくは、[[AUR]] から {{AUR|ruby-jekyll}}{{Broken package link|パッケージが存在しません}} をインストールしてください。 |
||
− | |||
− | === Rubygems バイナリリポジトリ === |
||
− | |||
− | 非公式の [[非公式ユーザーリポジトリ#quarry|quarry]] リポジトリから ''ruby-jekyll'' を[[インストール]]してください。 |
||
− | |||
− | == マークアップ言語の選択 == |
||
− | |||
− | テキストから HTML に変換するツールを定義するマークアップ言語は様々なものが存在します。Jekyll はデフォルトで2つのマークアップ言語に対応しています。[[Wikipedia:Textile (markup language)|Textile]] と [http://daringfireball.net/projects/markdown/ Markdown] です。Jekyll の依存パッケージとして両方の実装がインストールされます。 |
||
− | |||
− | === Textile === |
||
− | |||
− | [[Wikipedia:Textile (markup language)|Textile]] は Jekyll によって使用されるマークアップ言語です。 |
||
− | {{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 === |
||
− | |||
− | [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] です。 |
||
− | |||
− | さらに、[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> |
||
− | インストールしたら、以下の行を {{ic|_config.yml}} に追加してください: |
||
− | markdown: rdiscount |
||
− | |||
− | Markdown がよくわからない場合、Gruber の [http://daringfireball.net/projects/markdown/basics ウェブサイト] に詳しい説明が存在します。Gruber のオンライン [http://daringfireball.net/projects/markdown/dingus 変換ツール] を使うことで 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 の [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].}} |
||
− | |||
− | {{ic|_config.yml}} ファイルには設定データを保存します。設定ファイルに記述さえる様々な設定はフラグとも呼ばれます。フラグの詳しい説明とデフォルト設定は |
||
− | [https://github.com/mojombo/jekyll/wiki/Configuration GitHub] で確認できます。 |
||
− | |||
− | {{ic|_config.yml}} を自由に設定したら、Jekyll でウェブサイトを生成するために必要なファイルを作成します。 |
||
− | |||
− | == 使用方法 == |
||
− | |||
− | 次に Jekyll のためのテンプレートを作成する必要があります。テンプレートはデータの入力に Liquid テンプレートシステムを利用します。詳しくは [http://jekyllrb.com/docs/variables/ GitHub] を見てください。 |
||
− | |||
− | さらに、{{ic|/_layouts/layout.html}} の各ファイルには [http://jekyllrb.com/docs/frontmatter/ YAML Front Matter] のヘッダが必要です。 |
||
− | |||
− | === インデックスレイアウトを作成 === |
||
− | |||
− | 以下は {{ic|index.html}} となる基本的なテンプレートです。ウェブサイトのインデックスページを生成するのに使われます。 |
||
− | {{bc|<nowiki> |
||
− | --- |
||
− | 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> |
||
− | </nowiki>}} |
||
− | |||
− | === 一般的なウェブサイトのレイアウトを作成 === |
||
− | |||
− | 以下は一般的なレイアウトをしたウェブサイトのベーシックなテンプレートです。各ファイルの [[Wikipedia:YAML|YAML]] Front Matter ブロックで参照します (参照: [[#記事を作成|記事を作成]])。 |
||
− | {{hc|_layouts/layout.html|<nowiki> |
||
− | <!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> |
||
− | </nowiki>}} |
||
− | |||
− | === 記事のレイアウトを作成 === |
||
− | |||
− | 以下は各投稿の基本テンプレートです。各ファイルの [[Wikipedia:ja:YAML|YAML]] Front Matter ブロックで参照されます ([[#記事を作成]]を参照)。 |
||
− | {{hc|_layouts/post.html|<nowiki> |
||
− | --- |
||
− | layout: layout |
||
− | title: sample title |
||
− | --- |
||
− | |||
− | <div class="content"> |
||
− | <div id="post"> |
||
− | <h1>{{ post.title }}</h1> |
||
− | {{ content }} |
||
− | </div> |
||
− | </div> |
||
− | </nowiki>}} |
||
− | |||
− | === 記事を作成 === |
||
− | |||
− | ブログ記事のコンテンツは {{ic|_posts}} ディレクトリの中のファイルに収まります。デフォルトの命名規則を使用する場合、年・月・日・タイトルにマークアップ言語の拡張子である *.md または *.textile を付けます (例: {{ic|2010-02-13-early-userspace-in-arch-linux.textile}})。ファイル名の日付は投稿の公開日として使われます。さらに、ファイル名を使ってパーマリンクが生成されます (例: {{ic|/categories/year/month/day/title.html}})。別のパーマリンクスタイルを使いたい場合は [https://github.com/mojombo/jekyll/wiki/Permalinks GitHub] を参照してください。 |
||
− | |||
− | == テスト == |
||
− | |||
− | Textile や Markdown ドキュメントを元に静的な HTML ウェブサイトを生成するには {{ic|jekyll}} を実行してください。{{ic|--serve}} フラグを付けて Jekyll を実行することで生成した HTML ウェブサイトのテストを同時に行えます。 |
||
− | $ jekyll serve |
||
− | もしくは jekyll にファイルの変更を監視して欲しい場合: |
||
− | $ jekyll serve --watch |
||
− | {{ic|_config.yml}} でサーバーのオプションを定義することを推奨します。デフォルトではポート 4000 でサーバーが起動し、ウェブブラウザで {{ic|localhost:4000}} を開くことでアクセスできます。 |
||
− | |||
− | if you want to further test your work on other local machines use |
||
− | |
||
− | $ jekyll serve --host=0.0.0.0 |
||
− | |
||
− | otherwise only the default localhost will work. |
||
− | |||
− | == 参照 == |
||
− | |||
− | * [[Wikipedia:ja:YAML|YAML]] |
||
− | * [[Wikipedia:Textile (markup language)|Textile]] |
||
− | * [http://danielmcgraw.com/2011/04/14/The-Ultimate-Guide-To-Getting-Started-With-Jekyll-Part-1/ インストールチュートリアル] by Daniel McGraw |
||
− | * [http://danielmcgraw.com/2011/04/18/The-Ultimate-Guide-To-Getting-Started-With-Jekyll-Part-2/ 設定チュートリアル] by Daniel McGraw |
||
− | * [http://philipm.at/2011/jekyll_vs_hyde.html Jekyll vs. Hyde] by Philip Mateescu |
||
− | * Jekyll で作成されたウェブサイトは [https://github.com/mojombo/jekyll/wiki/sites GitHub] で見つけられます |
||
− | * 必要なソフトウェア: |
||
− | ** http://redcloth.org - RedCloth |
||
− | ** http://www.liquidmarkup.org/ - Liquid |
||
− | ** http://classifier.rubyforge.org/ - Classifier |
||
− | ** http://maruku.rubyforge.org/maruku.html - Maruku |
||
− | ** http://pygments.org/ - Pygments |
||
− | ** http://rubygems.org/gems/directory_watcher - Directory Watcher |