CMS大阪夏祭り(2015)のCMSプレゼンテーションで使用した資料です。 20分のプレゼンテーションでは、ここの一部を使用しました。

1. Contao Open Source CMS
CMS大阪夏祭り 2015
2015年 9月 5日
日本Contaoの会: 神戸 隆博

2. 発表者について
• Contaoとの関わり
– 2008年7月頃
ブログではないマルチドメインのCMSを求めて
最初からゴタゴタ入ってないもの
Securityの問題のすくないもの
• 2.6.BETAの頃
– 2011年2月
日本語の言語ファイル担当
– 2012年3月
Ambassadors in Japan (親善大使)
いくつかの機能拡張の翻訳

3. 発表者について(続き)
• オープンソースと私
– NetBSD開発者
• pkgsrc(パッケージシステム) 2000年8月から
– Ruby
– PHP
– その他(BINDなど)
– 日本語翻訳
• 本業とWebサイト構築は無関係

4. Contaoの概要

5. Contaoとは何か
• オープンソースのCMS
– 2006年3月12日: TYPOlight 2.0.RCから公開
– LGPL3
– 商用ライセンスあり
• ページのソースでContaoを使用している表示を削除
– metaタグのgenerator
• ソースコードから著作権表示を削除
– 公式サイト: https://contao.org/
– 開発元: ドイツ

6. 数字で見るContao
• Contao Konferenz 2015の基調講演の資料から
– https://leofeyer.com/files/slides/2015/konferenz/
• ドイツ語: Google Translation拡張で英訳可能
• ダウンロード
– 2015年5月18日で1,038,049
• 2013年8月30日までsourceforge.net
• download.contao.orgからのダウンロード
– Contao Check、公式サイトのダウンロード
• github.comからのダウンロードは除外
• Webサイト
– 70,000のサイト
• CMSCrawler、Live Update Serverのログ

7. マーケットシェア
• マーケットシェア (by CMSCrawler)
– 770システム中12位(前回: 7位)
• ドイツ: 6位(前回: 8位) 2.02%
• オーストリア: 5位(前回: 6位) 2.39%
• スイス: 6位(前回: 8位) 1.80%
• 人気: 第3位 (by webkrauts)
• WordPress 62%
• TYPO3 27%
• Contao 23%
• Drupal 15%
• Joomla! 9%

8. 名前の変更
• 以前の名前: TYPOlight (2.8まで)
– lightから軽量版とか小規模サイト専用と誤解
• リリース2.9から改名
• ベトナム語のconとtạoの造語
– tạo
• 形をなす、創造するといった意味のベトナム語
– con tạo
• 創作者、運命づけるといった意味
• コンテンツにも通じる
– 地名ではない

9. Contaoの特徴
• バックエンドとフロントエンド
– 公開するサイトに依存しない一貫した画面構成
• 階層構成によるページの管理
• コンテント要素
– コンテンツを複数の種類のパートで構成
• アクセシビリティの考慮
• カスタマイズや拡張のしやすさ
– 機能の拡張を考慮した構造
– 本体の直接変更は不要

10. 事例
• https://contao.org/en/case-studies.html

11. 機能拡張の例
• Isotope
– 電子商取引
– https://isotopeecommerce.org/

12. 動作環境
• Webサーバー
– Apache(, IIS)
• スクリプティング言語
– Contao 3.2でPHP 5.3.2以降
– Contao 3.5/4.0でPHP 5.4.0以降
• 必要な拡張: mysqli(またはmysql), dom, gd, mbstring(またはiconv),
mcrypt, soap, curl, zlib
• データベース管理システム
– MySQL 5.0.3以降
• 他のデータベースのサポートは3.0で一旦廃止

13. 各国語対応
• 言語ファイルは本体に同梱
– Contao 3.5.2で24の言語
– Contao 4.0.2で16の言語
• これから増える模様
– Transifexで95%以上の翻訳率で採用、95%未満で削除

14. リリースの種類(1)
• バージョンX.Y.Z
– メジャーリリース: X
• あらゆる変更の可能性
• 概ね2年に1度
• 2012年10月30日に3.0.0、2015年6月9日に4.0.0
– マイナーリリース: Y
• API、データ構造、テンプレートに変更の可能性
• 半年、5月と11月(または6月と12月?)
– バグ修正リリース: Z
• 基本的にバグ修正だけ → 上位互換な修正だけ
• 随時(概ね月に1度程度)

15. リリースの種類(2)
• 長期間サポートリリース(LTS)
– 18か月間3年間の保守期間のマイナーリリース
• 基本的にバグ修正だけ
– 加えて6か月1年間の移行期間
• セキュリティ修正だけ
– 合計で4年間
– LTSのリリース間隔は2年に1度
• PHP Symfonyのリリース間隔との親和性

16. 現在のリリース
• Contao 3.2 (LTS: 移行段階)
– 2015年 6月 5日 3.2.21
• Contao 3.5 (LTS)
– 2015年 7月24日 3.5.2
• Contao 4.0 (安定版)
– 2015年 8月 5日 4.0.2

17. リリース予定
• http://contao.org/release-plan.html

18. バックエンドとフロントエンド
• Webサイトの管理側と公開側
– 管理側: バックエンド(BE)
– 公開側: フロントエンド(FE)
– バックエンドで管理して、
フロントエンドをプレビュー → 公開
• URL
– FE: http://www.example.jp/
– BE: http://www.example.jp/contao/

19. バックエンドのUIの特徴
• 主に3つの表示形式
– リスト表示
– ペアレント表示
– ツリー表示
– それぞれで強力な並べ替え、フィルター、検索
• バックエンド全体の一貫性
– 操作するためのアイコンの持つ意味

20. リスト表示

21. ペアレント表示

22. ツリー表示

23. 編集の表示例

24. プレビュー
新しいウィンドウ

25. Contaoとコンテンツ

26. デザイン

27. ウェブサイトのデザイン

28. ページ

29. ページの階層と設定
• 階層構造
– 「ウェブサイトのルート」のページを起点
– ドメインと言語に応じたページ階層
• マルチドメインのサポート
• 多言語サイトのサポート
– 全体的な設定でURLパスに言語コードを付加可能
» http://www.example.jp/ja
http://www.example.jp/en
– 親のページの設定項目の継承

30. ページの設定項目
• ページの設定
– ページレイアウト
– アクセス権
• バックエンドとフロントエンドそれぞれ
– キャッシュ
• ページ単位のキャッシュ
– 公開設定
– サイトマップやナビゲーションへの表示

31. ページレイアウト
• ページに含める内容の定義
– カラム構成
• カスタムセクション
– 各カラムの配置内容
• アーティクルやフロントエンドモジュール
– スタイルシートのフレームワーク
– 含めるスタイルシート: 内部と外部
– jQueryやMooToolsの読み込み

32. フロントエンドモジュール
• 他のCMSでのブロックに相当
– ナビゲーション
• メニュー、パンくず、ブック、サイトマップ
– フロントエンドのユーザー
• 登録、ログイン、個人データ、アカウント廃止
– コンテンツの一覧や表示
• ニュース、イベント、FAQ、ニュースレター
– アプリケーション
• フォーム、ページ内検索、コメント、リスティング
– その他
• Flash動画、ランダムな画像、HTML、RSS表示

33. スタイル
• スタイルシートのフレームワーク
– カラム構成やレスポンシブ表示の枠組み
• スタイルシート
– 内部
• データベースで保持
• GUIで編集
– 外部
• ファイル管理にファイルを配置
• ファイル管理で編集
• LESSやSCSSのファイルも直接指定可能

34. テンプレート
• すべての出力はテンプレートを経由
– 既存のテンプレート
• Contaoの配布に含まれている原板
– カスタマイズ用のテンプレート
• 原板をコピーしてカスタマイズ
• カスタマイズ版があれば使用
• カスタマイズしたテンプレート
– 個々のフロントエンドモジュールで指定
– 個々のコンテント要素で指定

35. コンテンツ

36. ウェブサイトのコンテンツ

37. コンテンツの種類
• アーティクル
– 特定のページに置くコンテンツ
• コンテント要素で構成
• ニュース、イベント、FAQ、ニュースレター
– 特定の単位(アーカイブ)で保持するコンテンツ
• フロントエンドモジュールでページ上に表示
• ニュースとイベントはコンテント要素で構成
• ニュースレター
– メールマガジン的な電子メールでの配信
– 配信した記事のWeb上での公開

38. コンテント要素
• アーティクル、ニュース、イベントの内容
– コンテンツを構成する順序に分けて構成
– コンテント要素に適切なテンプレートの適用
• アクセシビリティ
• 内部検索エンジンへの指示
– コンテンツの再利用・効率的な利用
• 同じコンテント要素の共有
• 他のコンテント要素の取り込み
– コンテント要素単位の公開

39. コンテント要素の種類
• HTMLの要素
– 見出し、テキスト(リッチテキスト編集)、HTML
– 箇条書き、表、(プログラムの)コード、Markdown
• リンク
– ハイパーリンク、トップリンク
• ファイル
– ダウンロード、複数ダウンロード

40. メディアや表示の制御
• 画像や動画
– 画像、画像ギャラリー、映像や音声、YouTube動画
• コンテント要素の表示制御
– アコーディオン、コンテントスライダー
• 他のコンテンツの取り込み
– アーティクル、コンテント要素、モジュール、
アーティクルのティーザー
– フォーム、コメント

41. フォーム
• フォームジェネレーター
– 自由にフォームを作成
– フォームの提出内容の処理
• メールで送信
• 予め用意したデータベースのテーブルに格納

42. 挿入タグ
• {{ と }} で囲んだマクロのようなもの
– リンク要素
• ページやニュース項目のリンクに関するもの
– ユーザーの属性
• ログインしているフロントエンドユーザーの情報
– 環境変数
• クライアントのIPアドレス等の環境変数
– 要素の取り込み
• 他のアーティクルやコンテント要素を展開
– その他
• 現在の日時や言語に基づいた条件処理

43. 挿入タグの例
• {{link::home}}
– homeというページのリンク
<a href=“home.html”>
• {{date::Y}}
– 現在の日時の「年」
2015

44. その他
• バージョン管理
– 各要素の単位
• データベースのテーブル単位
• アーティクル全体を一括で戻すのではなく、
コンテント要素単位
• 復元
– 削除した要素の復元
• リッチテキストエディター
– TinyMCEとの融合

45. Contaoのインストールと更新

46. インストールの準備
• Apache、PHPの設定
• データベースの準備
– データベースの作成
– データベースのユーザーの作成
• ソフトウェアのダウンロードと展開
– 手作業でダウンロード、展開、アップロード
– パッケージシステムの利用(pkgsrc)
– Contaoチェックの利用
• https://github.com/contao/check

47. Contaoチェック
• インストール前の支援ツール
– https://github.com/contao/check
• PHPのgettext拡張(多言語表示)が必要
– Contaoのインストールに関する検査
• Contaoのバージョンに応じたインストールの可否
– インストール後の機能の利用可否
• 機能拡張リポジトリ
• ライブアップデート
• セーフモード対処の必要性
– Contaoの配布ファイルの取得と展開
• ダウンロード、展開、アップロードまでに相当する作業をサー
バー上で実行
• 展開したファイルの内容の検証
• Contao 4.0には非対応

48. インストール
• インストールツール
– http://example.jp/contao/install.php
– 数段階で設定
• データベースの接続確認やテーブル作成
• アップデートや開発で使う場合
• セキュリティ
– 最初にパスワードを設定
– 不安な場合はinstall.phpを削除や名前変更を実施

49. ライブアップデート
• インストール後の支援サービス
• https://update.contao.org/
– iNet Robots社による有償サービス
– 年額10ユーロ
• ドイツの売上税19%込み、それを除いた日本円で1200円弱
• インストールした1つのContaoに対して1ライセンスが必要
• マウス数回のクリックで更新
– インストール先のバージョンの選択
• 新しいバグ修正リリース
• 新しいマイナーリリース
• 以前のリリース
– バックアップの作成

50. 現在のリリース

51. Contao 3.2
• 2013年11月21日に最初のリリース: 3.2.0
– 以前の長期サポートリリース: 2019年11月まで
– 既に移行期間の扱い
• セキュリティ修正だけ
• 2015年6月 5日バグ修正リリース: 3.5.21

52. Contao 3.5
• 2015年6月5日リリース: 3.5.0
– 新しい長期サポートリリース: 2019年6月まで
– Symfonyベースでない最後のリリース
– PHP 5.4以降
• 2015年7月24日バグ修正リリース: 3.5.1
• 2015年7月24日バグ修正リリース: 3.5.2

53. Contao 4.0
• 2015年6月9日にリリース: 4.0.0
– PHP 5.4以降
– Symfony統合
• 2015年8月5日バグ修正リリース: 4.0.2
– インストールツールが動作!

54. Contao 4.0の特徴
• Symfony以外の特徴
– Apache依存の排除
– schema.orgのタグの取り込み
– すべてのフォームの項目のマークアップの統合
– CSSのクラスとウィジェットの棟ッ好
– TinyMCEの構成の改善
– 古いリソースの廃止
• セーフモード対処、XHTML
– その他

55. Contao 4とSymfony
• Contao 4はSymfonyのバンドル
– SymfonyアプリケーションにCMSの機能を提供
• 利点
– 「最終的な製品」はSymfonyアプリケーションの
ままである。
– 結果として、それぞれのSymfony開発者はContao
を扱う作業を行える。
– 新しいコードはSymfonyの標準に従ってコーディ
ングとテストがなさえる。

56. Apache依存の排除
• ドキュメントルートの変更
– Contaoを展開したディレクトリから変更
• 下位のディレクトリ: web
– 利点
• フォルダーの保護に.htaccessに頼らない。
• Apache以外(nginx)への対応
– 注意
• webディレクトリ以下にシンボリックリンク
– シンボリックリンクを辿るアクセスの許可
– PHPでシンボリックリンク作成が可能なこと

57. 廃止したもの
• セーフモード対処
– シンボリックリンク必須につき対応不可
• XHTMLのサポート
– HTML5は2011年6月1日のTYPOlight 2.10.beta1から
• IE6への警告
• 要素の前後のスペース
– CSSで行う

58. Contaoの関連情報

59. 公式サイト
• 公式サイト: https://contao.org/
• 開発サイト: https://github.com/contao/
• フォーラム: https://community.contao.org/
• Contao Association: https://association.contao.org/
• 事例研究: https://contao.org/case-studies.html
• コミュニティによるWiki: http://contaowiki.org/
• ソーシャルネットワーク
– Facebook: http://www.facebook.com/contao
– Twitter: http://twitter.com/contaocms

60. 書籍
• 書籍: (ほぼ)すべてドイツ語

61. 国内の情報
• http://www.contaocms.jp/
– 個人サイト
• https://www.facebook.com/groups/contao.jp
– 日本Contaoの会: Facebookのグループだけ
– http://contao.jp/ を予定
• Twitter
– @contaocms_jp / @contao_cco

62. まとめ

63. Contaoのまとめ
• 日々のコンテンツの管理
– 一貫性のあるバックエンドは覚えやすくて簡単
– コンテント要素による構成
• サイトのデザイン
– 部品を積み上げていくイメージ
– テンプレートもカスタマイズ可能ながら
• 拡張性と保守性
– 本体のファイルを触らずにカスタマイズや拡張
可能な作り