WordPressで構築したサイトを、CMSのMODXを使って再構築をしてみました。WordPress使用者の視点から導入の解説を簡単にしてみたいと思います。
WordPressとCMS
もともとブログを目的として作られたWordPressですが、最近はCMS的な使い方をされることも多くなりました。導入事例として紹介されている中には、かなり知名度の高い大手企業も複数含まれます。いくつか例を挙げてみます。
私も、MMORPGで参加しているギルドサイトの構築で試しにWordPressを使用してみたことがあります。ページ数が少なくてコンテンツが増える予定もなかったので、固定ページだけで構成してしまう方法を採用しました。テーマのどのファイルを使用するか指定できますし、アドレスも意味のある単語が使用できます。
サイトは完成し、これといって問題もないまましばらく運用していました。問題はなかったのですが、なんとなくCMSを使ってみたくなり、思い切って再構築を行うことにしました。
CMSの絞込み
私も改めて調べてから気がついたのですが、世の中には非常にたくさんのCMSが存在します。一般的に公開されている中ではWikiとXOOPSしか知りませんでしたが、ウィキペディアのコンテンツマネージメントシステムの項で汎用CMSとして掲載されているだけでも100近く。すべて見るのは不可能なので、ウィキペディアに項目があるものは取りあえず見るところから始めました。その中でPHPで構築されていて、尚且つ日本語で情報が得られるものを絞り込み。
この段階で数個まで絞り込むことが出来たので、それぞれ詳しい情報を収集。最終的にはDOMXを選びました。管理画面でサイトの構成が見やすいことと、バージョンが古いながらも書籍が1冊出ており、日本語の公式サイトがある点が決め手になりました。
MODXによるサイト構築
まず、MODXで再構築したサイトはこちら。デザインは公式配布されている素材を使って知人にお願いしたものです。再構築前と変更はほとんどありません。
インストール
WordPressで構築したものを再現するため、ローカルサーバーに場所を確保してMODXをインストールしました。MODXには一般向けのEvolutionと大規模向けのRevolutionの2つがあり、今回使用したのはEvolutionです。
インストールは簡単です。WordPressに比べるとステップは多いですが、出来るだけ自動化しようとしたためでしょう。パーミッションの設定などはやや煩雑に感じました。詳しくは、公式サイトにあるインストールの説明をご覧ください。
コンテンツの入力
管理画面上でコンテンツを増やしていけます。コンテンツには、存在しないページにアクセスがあったときに表示するもの(「Page Not Found」です)も含めます。
階層構造にすることも出来ますが、今回はすべてフラットです。トップページは別の場所で指定するだけなので、特別扱いせずに同じ階層に作ります。
WordPressのページスラッグのようなフレンドリーURLを使用することを前提にしているので、トップページの名前はindex
として index.html
でアクセスできるようにしました。
中身が出来たら、取りあえずサイトを見て確認です。デザインは後から設定するので、この時点ではデフォルトのままです。
テンプレートの作成
WordPressではサイトデザインがテーマとしてまとまっていますが、MODXの場合はテンプレートファイルに相当するものはデータベース上に登録されるだけでファイルではありません。MovableTypeと同じですね。
まずは、WordPressで構築したサイトのトップページではないページのソースを持ってきてテキストエディタに貼り付けます。そのままテンプレートにしてしまうことも出来ますが、それではCMSである意味がありませんのできちんと作ります。
コンテンツとなる部分をテンプレート変数 [*content*]
に置き換えます。WordPressでは、the_content()
を呼ぶのに相当します。同じように、コンテンツで登録したデータを利用したいところもテンプレート変数に置き換えます。
トップページは少し構成が異なるのでそのままでは問題があります。方法としては2つあって、1つは専用にテンプレートを作る方法。違いが多い場合はこの方法がわかりやすいです。
もう1つは、1つのテンプレートの中で分岐処理をする方法。違いがわずかな場合は変更作業などが楽になるのでお勧めです。今回は違いが次の2つだけなのでこの方法を採用しました。
- HTMLページタイトルにコンテンツのタイトルを含めるかどうか。
- コンテンツ内にコンテンツタイトルを表示するかどうか。
MODXのテンプレートはPHPのコードを直接書けないどころか、Smartyのような分岐処理も出来ません。自由度は下がりますが、メンテナンス性を高めるためだそうです。どうしても必要な場合は、スニペットという拡張機能としてのPHPプログラムに記述し、その結果を使いたい場所には [[スニペット名]]
と記述します。
HTMLページタイトルの場合は、次のようなスニペットを使用しました。トップページ以外ではコンテンツのタイトルも含めると言うものです。
<?php
if( $modx->documentIdentifier == $modx->config['site_start'] )
{
return '[(site_name)]';
}
else
{
return '[*pagetitle*] | [(site_name)]';
}
?>
また、コンテンツ内にコンテンツタイトルを含めるかどうかについては、Not Found のページでも対象にしたかったため別の方法を使用しています。表示の有無を選べるテンプレート変数を登録し、それを取得して分岐するようなスニペットを登録します。前半でテンプレート変数 DisplayH2Tag
の値を取得し、後半で [*content*]
を含む出力をしています。[*content*]
を含むようにしたのは、単にテンプレートの見通しが悪く感じたためです。
<?php
$tmplvar_info = $modx->getTemplateVar('DisplayH2Tag');
if ($tmplvar_info !== FALSE)
{
$display_h2_tag = (bool) $tmplvar_info['value'];
}
print '<div id="content">';
if ( true == $display_h2_tag )
{
print '<h2>[*pagetitle*]</h2>';
}
print '<div class="main">
[*content*]
</div>
</div>';
?>
スニペットの登録が終わったら、テンプレートの [*content*]
をスニペット変数に置き換えます。
最後に、ナビゲーション部分を Wayfinder というスニペットを使って表示します。このスニペットは初めから使用できるようになっていてなかなか便利です。
テンプレートのメニューを表示したいところに、次のようにスニペット変数を記述します。
[[Wayfinder?startId=0&config=`navigation`]]
次に、設定ファイルを作成してFTPでアップロードします。設定ファイルはパラメーターを指定する替わりになるものです。設置場所が決められないのは難点。
設置場所はドキュメントルートの assets/snippets/wayfinder/configs
で、ファイル名は navigation.config.php
です。ファイルの内容は下記のとおり。
<?php
/*
* Wayfinder設定
*
* グローバルナビゲーション
*/
// ----------
// テンプレート
// ----------
$hereTpl = '@CODE:<li[+wf.id+][+wf.classes+]>[+wf.linktext+][+wf.wrapper+]</li>';
// ----------
// パラメーター
// ----------
$hideSubMenus = 'true';
$level = '1';
$rowIdPrefix = 'page-item-';
?>
Wayfinderの使い方については、Let’s enjoy MODxの解説が非常に参考になりました。パラメーターの意味については、そちらをご覧ください。
まとめとお礼
以上で解説終了。MODXについては素人にも届かないので、間違っているところがあったらごめんなさい。
それから、設置作業中にツイッターでPHPのmagic_quotes_gpcがオンになっていると問題になることをつぶやいたのですが、それに対して本家コミッターのyamaさんから次のバージョンで修正するとのご連絡が。その後も何度かアドバイスを頂け、非常に助かりました。ありがとうございました。