STUDIO Bloom 大阪・北摂地域を中心としたWebサイト・システム制作

以前から注目していたCMS「concrete5」。ついに日本語版のVer.5.3がリリースされたので、本格的に触っていこうと思ってます。

「管理画面はIE6不可！」とか、「concrete5が不向きなサイト一覧」とか、ちょっと斜めに見てる感じが好きです。

どんなタイプのCMSになるかというと、近いのはMODx？いや、それとも違うか。サイトのページ構成とかは管理画面上で行って、ページ内コンテンツの作成は実際のページ上でブロック（範囲）ごとに編集する、といった手法で、実際に近い画面（WYSIWYGがポップアップで出てくるから編集→即反映の流れ）で編集できるので、「ブログは要らないけど、頻繁にページのコンテンツを書き換えたい。当然、簡単に。」とか曰う我が儘クライアントに最適かな？ブログ的な機能は持ってないので（不向きリストに入ってます）、ブログとページを連動させたかったりする場合はWordpressでの構築が良さそうだったりします。さらに「そんな物は要らない。とりあえず安く」というクライアントさんには静的な構築でしょうか？とはいえウチではそんなに安くなりませんシステム導入して構築してもあまり高くなりません。

閑話休題。
カスタマイズの第一歩はやはり「オリジナルテンプレート」から、ということで、ボチボチ触りながら躓いた点や参考になりそうな点を小出しにしていければ、と思います。
注意点。「1からカスタマイズ方法を解説」ではなく、「やってみて引っかかりそうな点、有用そうな点」をピックアップするので、その点はご了承下さいな。

閑話休題2回目。
本題。concrete5にオリジナルテンプレートを追加してみるの巻。

基本的な流れは本家のヘルプページにあります。当然エイゴ（Chopの訳し方が良く分からん）。

とりあえず作っておけばいいのは

• default.php…テンプレートが指定されてない全ページへ自動的に適用される
• view.php…静的ページ用のラッパー（？）らしいです。ちょっと認識不足
• thumbnail.png…120×90のサムネイル画像。完成イメージやね
• description.txt…1行目にテーマ名。2行目に説明文

最低限必要なのは以上。
で、ちょっとconcrete5で特徴的になってくるのが、ページタイプ別のテンプレート、という考え方。

concrete5ではページを作る時に、「どのタイプのページにするか」を選択します。デフォルトでは“カラム分け無しの全幅”・“右サイドバー“・“左サイドバー”の3種類があります。これが“ページタイプ”（独自で追加・編集できます）。
それぞれのページタイプには“ハンドル”という英数字とアンダーバーで識別される文字列があり、デフォルトの3つにはそれぞれ“full”・“right_sidebar”・“left_sidebar”が設定されています。

concrete5では表示を行う際に、そのハンドル名と同名のテンプレートファイルを探し、無ければデフォルトテンプレートを適用する、という流れになってます。そのため、初期設定のページタイプ分を揃えたテーマを作るには、上記の他に

• full.php…全幅ページタイプ用
• right_sidebar.php…右サイドバーページタイプ用
• left_sidebar.php…左サイドバーページタイプ用

の3つのテンプレートが必要になります（defaultテーマにはright_sidebar.phpがありません。上手いこと作ってます）。あとはスタイルシートと画像ですかね～

サイトのデザイン上、デフォルトのページタイプで賄いきれない場合、まず“ページタイプ”という所謂「標題」を作ってそれ用のテンプレートを用意、ページを追加する時にそのページタイプを選択する、という流れになります。

ま、そんな感じでファイルはそろった訳なんですが、これをサーバーにアップロードします。
デフォルトのテンプレートが

/path/to/public_html/concrete/themes

にあるので、ついついここにディレクトリ作ってアップしちゃいそうになるのですが（実際やってしまってハマったｗ）、ここに入れても全く認識してくれません。アップする場所は、

/path/to/public_html/themes

です。ここにディレクトリ作ってアップすると、管理画面の「ページとテーマ」の中に現れます。インストールボタンを押すと、晴れてDBに登録され、戻った先のテーマ一覧画面で「有効」ボタンを押すと、ようやく自作のテーマが適用される、ということになります。

ちょっと癖がありますね～

いや～しかし今回は長文。説明が行ったり来たりで分かりにくかった。ごめんなさい。
次回小ネタは、CSSの独特の読み込ませ方法とその理由・注意点、テンプレートディレクトリへのアクセス方法など、実際のテンプレート作成時の小ネタにしてみようと思います。

ま、自分も英語読み読み、テンプレート作って試行錯誤しながらのエントリなので、間違いなどありましたらご指摘いただければ幸いです。