また Middleman blog のテンプレートができたので宣伝にきました

Drops という middleman-blog 用のテンプレートを作ったので宣伝にきました。

画面

こんな見た目です。

主な特徴

• 黒い水滴くんみたいなキャラがかわいいです
• Heroku へのデプロイ準備OKです (New Relic アドオンもすぐ追加できます)
• サイトマップと Atom のフィードが自動的に作られます
• Breakpoint を使って割とレスポンシブになってます
• シンタックスハイライトが効きます (middleman-syntax と rouge を使ってます)
• アセット管理に Rails Assets 使ってます (Bower のインストール不要です)
• Nokogiri 使いません (Oga を使ってカスタマイズしたフォーク版の middleman-blog を使います)

インストールのしかた

Middleman をインストールしてなかったらインストールしてください。

$ gem install middleman

テンプレートをローカルにクローン

$ mkdir ~/.middleman # if it doesn't exist
$ cd ~/.middleman
$ git clone https://github.com/5t111111/middleman-blog-drops-template.git blog-drops

Middleman ブログのプロジェクトを作る

$ middleman init my_blog_project --template=blog-drops

Gem をインストールする

$ cd my_blog_project
$ bundle install

Middleman サーバーを起動する

$ bundle exec middleman

起動したら http://localhost:4567 を Web ブラウザで開いてみてください。

記事を書く

一応、記事を書く準備はこれでOKです。
source/posts に Markdown 形式のファイル (拡張子: .md) を作ってそこに書いてください。
2014-11-20-this-is-an-example-article.html.md というサンプルの記事ファイルがあるのでそれを参考にすると早いです。

ブログの構成

公開の際には、config.rb の最後の方にある以下の設定を変更してください。

name	description
:site_url	ブログの URL
:site_title	ブログのサイトのタイトル
:site_description	ブログの説明 (今のところ、META タグの description でしか使われません)
:site_author	ブログの著者の名前
:site_author_profile	ブログの著者のプロフィール
:site_author_image	ブログの著者の画像
:reverse_title	true だとページのタイトルがブログのサイトのタイトルの先にくる
:social_links	著者ページのソーシャルリンク設定
:google_analytics_account	Google Analytics アカウント (オプション)

Heroku へのデプロイ

静的サイト用の Rack appliction の構成が設定されいてるので、ほとんど何もしなくても Heroku にデプロイできます。

Ruby バージョンだけは手動で指定してください。

source 'https://rubygems.org'
source 'https://rails-assets.org'

ruby '2.1.5'

# middleman
gem 'middleman', '~> 3.3.5'

...

変更を全部コミットして、Heroku アプリケーションを作ります。

$ heroku create

Heroku にプッシュ。

$ git push heroku master

Web ブラウザで確認。

$ heroku open

詳細は、config.ru と Procfile の中身を直接見てください。

ライセンス

コードは MIT です。
が、テンプレートに含まれている以下の画像の使用だけは、このテンプレートと一緒に使う用途に限るとし、テンプレートのフォーク以外での2次利用と再配布はだめよーだめだめとさせてください。

• drops.png
• favicon.png
• profile.png