ロフトワークの今を伝えるブログメディア

「CMS大阪夏祭り」注目株!?「Craft CMS」がすごいので広めたい

先日、大阪市北区で開催された「CMS大阪夏祭り2017」に行ってきました。

CMS大阪夏祭り」は、WordPressやMovable Type、Concrete5など、さまざまなコンテンツ管理システムのコミュニティが出展し、その特徴や良さをアピールする夏の祭典
早い話が、「CMSの関西コミケ」!違うかな!?
CMSの開発元や、プロフェッショナルなエンジニアと直に顔を合わして交流することができる貴重な機会なのです!

出展CMSコミュニティは去年より3つも増えて過去最大級を更新
中でも僕が今一番注目しているのが「Craft CMS」!

「Craft CMS」は、Pixel & Tonicが開発・販売している海外のCMSです。
海外サイトCMS Criticsで、2015年の「Best CMS for Developers」に輝いた、期待の新星
PHP v5.3.0以上、MySQL v5.1.0以上で動作します。

そんな「Craft CMS」が初出展するということで、セミナーはもちろん、ブースにも直撃して詳細を伺いました。

自分で予習したところも含め、Craftを”大”紹介したいと思います。

ちなみに今回ブース出展は開発元・Pixel & Tonicではなく、Craft CMSを愛するbitpartの有志のみなさんでした。(開発元から許可を得て出展)

Craft の今後期待したいところ

まずは先に、Craft CMSのデフォルトではできないこと、今後期待したいところを上げていきます。

  • 多段階の承認フローができない
  • テキストオンリーのメールがデフォルトでは送れない。基本HTML。
  • WYSIWYGエディタの仕様上、複雑なテーブルをGUIで作ることがデフォルトではできない
  • ブロックの中でカスタムフィールドを繰り返すことは、デフォルトではできない(後述)
  • 日本語の情報がまだ少ない

日本語の情報がまだ少ないのが非常に残念です。
2017年7月時点で、日本語でたくさんCraft CMSの情報を発信されているのはBUN:logかたつむりくんのWWWくらいでしょう。
何を隠そう、このブログの中の人たちがブースに出展しているのです。
でも公式のドキュメンテーション充実してるので、「Twig」好きな人はすぐ使えますよ。

Craft CMSのここがすごい

今度はCraftのすごいところをご紹介します。

その1.コンテンツに合わせて無限に作成可能な、3種類のセクションタイプ

WordPressでいうところの「投稿タイプ」がCraftでは「セクションタイプ」といい、3種類あります。

「チャンネル」
WordPressでいうところの「投稿」。
ニュース、ブログ系の記事を持つコンテンツに適しています。
データ入力のみで、実ページを持たないことも可能です。
例えば、詳細ページが存在せず一覧ページに全記事表示みたいな「用語集」や「FAQ」といった用途にも使えます。

「ストラクチャー」
WordPressでいうところの「固定ページ」です。
階層構造を持つコンテンツ。
「プラシバシーポリシー」や「会社情報」などは、このセクションタイプがいいでしょう。

「シングル」
そのサイトで唯一固有のコンテンツ
具体的にはTOPページなど。
あとは例えば、一覧ページで「ここもCMS上で編集できるようにしたい」といったニーズに、詳細記事は「チャネル」で作るけど一覧ページだけ「シングル」で作る、ということもできます。

その2.デフォルトで充実したカスタムフィールド

フィールドの種類はデフォルトで全18種
カテゴリー、タグの紐付けもカスタムフィールドで設定するのがユニークだと思います。
中でも目玉といえる機能が「行列フィールド(Matrix Field)」です。

その3.行列フィールド(Matrix Field)

a-blog CMSでいう「ユニット」、WordPressのカスタムフィールドプラグイン「Advanced Cutom Field」の「柔軟コンテンツ」と似た機能。

複数のカスタムフィールドで構成されたブロックを、自由に追加、並び替えが可能です。
さっき「今後期待したいところ」で上げましたが、このブロックの中でカスタムフィールドを繰り返すことがデフォルトではできません。
例えば、ギャラリーのブロックだと、いくらでも画像が追加ができることは出来ないので、画像2枚なら2枚分の入力欄で固定になります。

その4.ライブプレビュー機能

特に運用者に嬉しいのが「ライブプレビュー機能」。
リアルタイムで入力内容がプレビューに反映されます
レスポンシブ対応の場合、真ん中の灰色のバーを右に引っ張れば、そのままスマホ表示の確認もできます
さらにプレビューはトークン付きのURLが発行されるため、URLを共有すれば、他のユーザーは管理画面にログインしていなくてもプレビューを確認することが可能です。

その5.多言語対応

有償ライセンス「Pro」($299)では、サイトコンテンツの多言語展開がデフォルトで可能です。
自分で言語を追加することもできるので、これを応用して1つの記事に対して「PC用」と「スマホ用」で入力欄を変えるといったことも可能です。

その6.Twigベースで学習コストが低い

PHPテンプレートエンジン「Twig」でテンプレートを記述するので、オブジェクトごとの記述の差異が少ないです。
それに開発元がドキュメンテーションをしっかり用意してくれています。
「Twig」はMovable Typeのテンプレート記法にも似ているところがあるので、Movable Typeユーザーにもすんなり扱えるでしょう。

細かすぎる、Craft CMSのここがもっとすごい

その7.カスタムフィールドはハンドル(ID名)を後から変更しても紐付けが切れたりしない

どういう事かというと、例えばWordPressのACFで、次のようなカスタムフィールドを作るとします。

記事の編集画面に入力します。

その後、なんらかの都合でカスタムフィールド名を変更しなくてはならなくなりました。
ここでは、「cf_web_url」から「cf_web_url2」に変更してみます。

すると(データベースにデータは残っていても)記事との紐付けが切れてしまい、さっき入力した内容が空になってしまいます。

ところが、Craftはフィールドタイプそのものを変更しない限り、ちゃんと紐付けを維持したままリアルタイムで変更されます
とても賢いのです。

その8.関連づけ機能が優秀

Craftでは関連付けの機能が非常に優秀です。
カテゴリー選択、タグ選択、関連記事選択、ユーザー選択、アセット選択がそれに当たります。

一度関連オブジェクトを選択し紐づけてしまえば、逆参照が可能です!

例えば、「製品A」の記事編集画面で関連する制作事例を選択しました。
その結果「製品A」のページに関連する制作事例が表示されるのは当然ですが、制作事例の記事テンプレートにわずかなコードを書くだけで、「この制作事例に関連づいている製品を表示させる」ということができるのです。

BUNさんがその場でサンプルコード↓を組んでくれましたw(イメージなので、一部間違いがあるかもしれません)
23行目がそれです。

出力コードもシンプルなのがおわかりいただけるかと思います。

その9.関連づけたオブジェクトは、ダブルクリックでそれ自体を編集可能

言葉だけで伝えるのは難しいので、変更するところをGIFにしました↓
(新幹線の中で書いているので、ネットが重いのは許してくださいorz)

すごくないですか。
ほかにもアセットであれば、画面遷移せずにファイル名の編集ができたり。
地味に便利です。

その10.ユーザー権限が細かすぎる

有償ライセンス「Pro」($299)では、ユーザーグループ、ユーザーを無限に作ることができるのですが、ユーザーグループごと、ユーザーごとに権限が「これでもか!」というくらいに細かく設定できます。

セクションタイプごとに編集権限をユーザーに付与できます。
これも地味にすごいところです。
ただし、セクションタイプがたくさんある場合には、設定がしんどくなるのがデメリットですね…。

その11.画像のサムネイル設定が細かすぎる

Craft CMSでは、自分で画像のサムネイル設定を編集できます。
これがまた設定が細かく編集できて逆に気持ち悪い非常に便利!

 

圧縮率を指定できたり…

画像の「トリミングの位置」が9種類あるとか、充実しすぎです。

画像はデザイン的にも、サイトの表示速度にも関わる重要なポイントだからでしょうか。

Craftのこれから

現在beta版として公開されている新バージョン「Craft 3」ですが、下記のようなバージョンアップがされる予定です。

  • 速度改善され、高速化されます。
  • インストールがcomposerに対応します。
  • 「多言語対応」が強化され、「マルチサイト」(同一サーバ内で、別ドメイン可)という機能に生まれ変わります。
  • 一部のテンプレートタグが変更になります。

 

導入事例&Craft CMSが活きるサイト考察

Craftの大きな強みは

  • 強力な関連付け
  • デフォルトにして、柔軟なカスタムフィールド
  • 多言語対応

の3つだと思います。

なので公式サイトで紹介されている実例も、この機能がフルに活用されているものが多いです。

多言語サイトや、製品情報などのデータを細かく持ちたいサイトコンテンツの種類がたくさんあってお互いが複雑に関連し合っているサイトほど、WordPressより作りやすく運用もしやすいように思います。

あとは、セキュリティ面でWordPressと比較して多少堅牢かなと思います。
それには2つ理由があって、1つは、サイトのデータとCMSの本体がディレクトリで分かれているため。
もう1つはサードパーティ製のプラグインの品質です。
コアのアプリケーションのAPIがしっかりしていて、Craftのルールに従ってAPIをうまく使うことを開発元は推奨しており、プラグインの多くはそれに準拠しているためです。

価格

そろそろCraft CMSを触りたくなっているのではないでしょうか?
「でも、お高いんでしょう?」
いいえ、Craft CMSは商用CMSですが、無料から使えます
料金体系は、「Personal」(無料)、「Client」($199)、「Pro」($299)の3つ。
Proでもわりとお求めやすい価格です。
しかも、開発を目的とした特定のドメインの場合、無料で有償ライセンスを触ることが可能です!

Personal

  • 無料
  • ユーザーは、管理者アカウント1つのみ

Client

  • $199
  • ユーザーは2つ(管理者、クライアント用アカウント)

Pro

  • $299
  • ユーザー無制限、グルーピング、権限設定
  • 多言語対応
  • Amazon S3 / Rackspace Cloud Files / Google Cloud Storage 対応

無料版でも十分使えますが、Craftの本領は「Pro」で発揮されるといえます。

Craft CMSを触ってみよう!

ということで、Craft CMSのご紹介でした!
Pro版はデモで気軽に触ることができます。是非お試しください。

安藤 大海 安藤 大海

ロフトワークの日本神話オタク。
2016年にロフトワーク入社。
前職でサイト制作をおこなってきたスキルを活かし、主にWordpress案件における技術面のサポートを行う。