社内向けの資料として書いたエントリーですが、ちょっとリライトして、フラットファイルCMSな当ブログの書き方、更新方法を簡単にご紹介します。フラットファイルにしたことで、オフラインでの執筆が普通になり、特別なソフトもいらない、HTMLを書かなくてもいいということで、コンテンツを書くスタイル自体が大きく変わったように思います。
フラットファイルCMSとは?
データの保有にDBを使わない、最近話題の新種のCMS。
なぜフラットファイルCMSなのか。
- 軽い、早い。
- 設置が簡単。
- 「コンテンツ」の保存に相応しい。(資産として)
→レスポンシブを始め、モバイルでの閲覧に対する配慮が重要になっている。
屋外での閲覧などを考え、コンテンツの軽量化・表示の高速化が求められる。
使用しているCMSの仕様。
- システム設定は、.yaml(ヤムル)というXMLファイルで指定。
- コンテンツデータは、.md(マークダウン)というテキストファイルで保有。
- 処理は、PHP。
<その他>
- キャッシュコントロール付。
- 管理画面はあるが、使わなくてもOK。(今は使っていない)
主要なディレクトリ・ファイル。
システム配下のうち、主要なディレクトリ・ファイルは次の通り。
_cache/ …キャッシュファイル入れ。中のファイルを消すとキャッシュが消える。
_config/ …設定ファイル(.yaml)入れ。
_content/ …コンテンツファイル(.md)入れ。★
_themes/granfairs/ …テンプレートHTML入れ。
upload/ …コンテンツ画像入れ。★
運用で使用するのは、★の2つ。
コンテンツ公開までは簡単3ステップ!。
- ローカル環境で.mdファイルを作る。(コンテンツを書く)
- 社内ローカルサーバの指定フォルダに置く。ブラウザで表示確認。
- 本サーバの指定フォルダにアップ。完了!
→超分かりやすい。つまり、「ブログを書く=.mdファイルを作る」
マークダウンとは?
マークダウンと記法
マークダウンとは、Wikiによると
文書を記述するための軽量マークアップ言語のひとつ。(中略)プレーンテキストとして記述した文書を、妥当なXHTML(もしくはHTML)文書へと変換できるフォーマット。
記法が標準化されている。
Markdown 公式
チートシート
主要な要素を一覧にした次ページの.mdファイルを開いて見るのが分かりやすい。
MarkDownで表現できる全エレメント
ファイルとコンテンツの仕様
1).mdファイルの文字コードは「UTF-8」(BOM無)
2).mdファイルは、各自のブログ用ディレクトリに置く。
/blog/_content/2-ceo
/blog/_content/3-cto
/blog/_content/4-staff
3)ファイル名
- 先頭に日付:yyyy-mm-dd-
- その後ろに半角英数時で任意に名前を付ける。
※ファイル名の日付=公開日。この日付以前にサーバにあっても公開されない。
※ファイル名の任意の名前=ブログ記事ページのURL。(URLの競合に注意)
4-staff2014-01-06-cyclenav.md → /staff/cyclenav
4)ファイルの先頭は設定ブロック。
---
title: <記事のタイトル>
cat: <カテゴリを指定>
author: <名前を指定>
img: <メインビジュアルのファイル名>
---
※上下の点線も重要なので削除しないように。
5)1記事に一つ、メインビジュアルを用意する。
- 各自素材を調達(著作権に注意)。
- 指定のPSDでフィルタを掛け、トンマナを合わせる。
- ファイル名:[カテゴリ名]-[.mdファイルと同名].[拡張子]
- 設置先:blogupload
おまけ
サイト内の英語に使用しているWeb font(Roboto)は、インストール版を次からDLできます。
Web fontと同じフォント:Android用のRoboto
画像に英字を使用する場合は、このフォントを使用すると揃ってていい感じ。