[Middleman 3]初めてのMiddleman：Middleman-blogでマルチブログを試してSkeletonを作った

この記事は書かれてから1年以上経過しており、内容が古い場合があります。

はじめに

Middlemaでマルチブログができるというのは公式を読んでいればわかりますが、日本語で書かれている情報はほとんどありません。今回、2つのブログを持つサイトをMiddlemanで作り、Skeletonを作ったので紹介します。

Skeleton

SkeletonはGithub: Middleman Multiple Blog Skeletonに上げておきました。自由に使ってもらって構いません。

使い方

まず、Skeletonをクローンしておきます。

$ cd ~/.middleman
$ git clone https://github.com/nukos/multiple.middleman-blog.skeleton

スケルトンからプロジェクトを作成する。

$ middleman init test.middleman-multi-blog.skeleton --template=multiple.middleman-blog.skeleton

最後に、ダウンロードしきれていないGemをダウンロードさせる。

$ cd test.middleman-multi-blog.skeleton
$ bundle install

これで$ middleman serverできるようになります。

マルチブログで知っておきたいこと

マルチブログを行う場合、nameとprefixの設定が必要になります。他の設定項目でprefixの影響を受けるものと受けないものがあるため、パス設定の際に注意が必要です。以下が実際の設定になります。http://localhost:4567/__middleman/をチェックしながら設定すると理解が早いかもしれません。

# BLOG CATS
activate :blog do |config|
  # This will add a prefix to all links, template references and source paths
  config.name   = "cats"
  config.prefix = "cats"

  # Matcher for blog source files
  config.sources = "articles/{year}-{month}-{day}-{title}.html"

  # Layout and Template
  config.layout            = "post"
  config.tag_template      = config.prefix + "/tag.html"
  config.calendar_template = config.prefix + "/calendar.html"
end


# BLOG DOGS
activate :blog do |config|
  # This will add a prefix to all links, template references and source paths
  config.name   = "dogs"
  config.prefix = "dogs"

  # Matcher for blog source files
  config.sources = "articles/{year}-{month}-{day}-{title}.html"

  # Layout and Template
  config.layout            = "post"
  config.tag_template      = config.prefix + "/tag.html"
  config.calendar_template = config.prefix + "/calendar.html"

end

page "/cats/feed.xml", layout: false
page "/dogs/feed.xml", layout: false

まず、config.sourcesはconfig.prefixが先頭に入ることを前提としたパス指定となります。実際のパスは/cats/articles/{year}-{month}-{day}-{title}.htmlになるわけです。config.permalinkやconfig.taglinkも対象です。

prefixの影響を受けないのが、config.tag_templateやconfig.calendar_template等のテンプレートファイルの設定項目です。ブログのディレクトリ下にテンプレートを置く場合はconfig.prefix + "/calendar.html"のようにprefixをあててやる必要があります。

記事やタグを取得する際にブログを指定する

LayoutsやTemplate内で記事やタグの一覧を呼び出す際にブログ名の指定が必要になります。例として以下のように記事一覧を作る際にブログ名catsを指定します。

<% page_articles('cats').each_with_index do |article, i| %>
...
<% end %>

ブログ毎にこの指定を付与するのは手間ですがらこの識別子を自動で取得します。そのために使うのがblog_controller.nameです。これはページ生成時に該当するブログ名を自動で返してくれるので個別指定が不要になります。blog(blog_controller.name), tag_path(tag, blog_controller.name), blog_year_path(year, blog_controller.name)などで使えるのでとても便利なヘルパーです。ヘルパーについてはこちらを参考に。

<% page_articles(blog_controller.name).each_with_index do |article, i| %>
...
<% end %>

Middleman-blogが提供しているSkeletonはここまで考慮されていない簡単なものなので、これを参考にしてもらえれば複数のブログで再利用可能なテンプレートを作ることができると思います。

次回：初めてのMiddleman：Markdown EngineをkramdownからRedcarpetに切り替える

参考

Middleman-blogに関する情報はClass Listにまとまってます。

シリーズ

Wercker step-s3sync でファイル名に日本語を含んでいる場合に Sync できない問題の解決方法（小ネタ）

2016-10-26
Wercker, Amazon S3, Middleman 3

ウェブデザイナーがはじめるAngularJS：AngularJS向けのディレクティブが用意されたUI Bootstrap

2015-07-06
AngularJS 1, Bootstrap 3, Middleman 3

初めてのMiddleman：Bowerで管理されているフォントファイルをインポートする

2015-05-27
Middleman 3

ウェブデザイナーがはじめるAngularJS：Middlemanでng-annotateを使ったMinify対策

2015-05-19
AngularJS 1, Middleman 3

初めてのMiddleman：Middleman-blogにカテゴリやシリーズなどのカスタムコレクションを追加する方法

2015-04-27
Middleman 3

初めての Middleman シリーズ初めてのMiddleman：Middleman-blogでマルチブログを試してSkeletonを作った