Drupal 8もリリースされ1年が経過し要件によっては積極的にDrupal 8を採用していきたいですが、Drupal 7もプラグインが枯れて良い感じなので、まだまだ出番はあると思っています1。そこで今回はDrupal 7でのコーディングを楽にする(かもしれない)方法を紹介します。
[前提]できるだけコードを書かない
はい、できるだけ書きたくないです。書けばそこにバグが入り込みますし様々なコストが発生します。
そもそも、Drupalは一般的なサイトを構築するためのカスタムフィールドの追加やループが管理画面から設定可能で、テンプレートにWP_Query
とか書いたり、wp_reset_postdata
を書き忘れて頭を抱える必要がありません2。つまり、うまくベースとなるテーマの選定を行えば、サイトのビジュアルデザインの為にPHPを触る必要がなくなります。WYSIWYGエディタを活用すれば、書くのはCSSでのスタイリングだけでOK。
[課題]CMSの出力するHTMLとCSSスタイリング
CMSを利用したサイト構築では出力されるHTMLは階層が深くなり見通しが悪くなりがちですが、Drupal 7も同じように人間が読みづらいHTMLを出力します。いくらスタイリングだけで良いとはいえ、把握しきれない入れ子や全体構造はストレスですね。
誘惑
もっとも簡単な解決法はテンプレートを書くことで、Drupalではサイト全体のテーマを書くのとは別にBlocks、Views、Panelsとテーマとは別にそれぞれのモジュールのテンプレートを上書きすることができます。
ただし、前述の通りできるだけ書きたくないので別の解決策を探りました。
採用したテーマとモジュール
使ってないけど、Fencesというモジュールもあります。
Mothership
Mothershipは他の多くのテーマとは違い、導入すれば見た目が整うものではなく余分なdivタグの入れ子やクラス名などを取り除いてくれるテーマです。なのでこのテーマ自体をカスタマイズするのではなく子テーマとして目的のビジュアルを作り上げて行くことを強くおすすめします。そのほか、開発に役立つオプションや設定が豊富なのでドキュメントに目を通しておくと良いです。
Clean Markup
Clean MarkupはPanelsとBlocksへクリーンなテンプレートを提供します。同時にオプションにより、任意のクラス名を指定したりラッパーを指定したりすることが可能です。
まとめ
というわけで、Drupal 7でのウェブサイト制作ではこれらを導入すると効率的にサイト構築できるようになると思います。僕が関わったプロジェクトではこれらをベースにスタイリングはBourbon/NeatなどのSassフレームワークを組み込んだりしました。
おまけ
見てみようテーマ別階層の深さの変化
Bartik
Mothership
お試しはこちら(少し慣れてる人向け)
- 上記リンクから新規にSandboxを立ち上げて、admin/admin でログイン(24時間有効)
- ModulesでPanelsやCleanMarkupを有効化
- AppearanceでMothershipを有効化
- お楽しみください