その4で Drupal が page.tpl.php ファイル内に埋め込まれた内部変数をHTMLコードや文字列に変換することによってページを動的に生成していることが分かった。
その機構を利用して、HTMLコードと内部変数を置き換えられる限り置き換えてみた。
pege.tpl.phpのソースと使用しているCSSファイルを前回同様ファイルで添付しておく。
page.tpl.phpソース
CSSソース
PHPのコード的には高度なことは何もしてない。初心者でも問題なく分かると思う。if文による分岐か、変数をそのままprintで出力しているだけだ。難しいことといえばその出力(されるHTMLコード)をどこにおけばいいのか、ということぐらいだろう。これはもう実際に自分が作ったテンプレートを出力して確かめるしかない。
私がやった手法もブラウザから実際に表示されているページのソースを表示して、出力されたHTMLコードにスタイルを割り当てていくといった、いたって地味な方法である。
無難な固定幅3ペインのデザインにしたおかげか、page.tpl.php だけでも表示領域や機能的にほぼ実働可能なくらいにはできてきている。特に凝った演出やデザインを求めずに、コアテーマのテンプレートを改良していくだけなら本当に簡単にオリジナルデザインを作成することが可能だろう。
ほとんどのHTMLタグに関しては、Drupal コアが出力するデフォルトのHTML内に埋め込まれたidやclassに対してテーマディレクトリーに含まれる自前のstyle.cssにスタイルを記述(システムにあらかじめ用意されているスタイルシートよりもテーマが用意するスタイルシートの方がHTML内で後に宣言されるためスタイルは上書きされる、ただ、全てにおいて適応されるわけではないので !important 指定によって強制的にスタイルを適応させなければならない場合もある)すれば思い通りのデザインにすることが可能だろう。
ただし、目的の外観を実現するためにHTMLの構造自体を変える必要がある場合は page.tpl.php だけではかなり無理がある。今回のデザインではサイドバーのブロックが意図したデザインにはならなかった。
Drupal のコンテンツはブロックという単位で出力され、region に配置されるが、配置された各ブロックが region 単位でまとまったHTMLとして出力される。
.info ファイル内で使用する region を定義したことを覚えているだろうか?あそこで定義した left や header といった region が テンプレート内で $left、$header といった region変数として、regionに配置されたブロックのHTML出力結果を保持している。つまり、左サイドバーが必要な場合、HTMLコードを一切書かなくても、<?php print $left ?> として変数を出力すれば左サイドバーに必要なHTMLコードが出力されるという仕組みだ。
これは page.tpl.php が最終的なページの出力を受け持つテンプレートという性質から考えれば良くできていると納得できる。必要な region の変数のみ(デフォルトのスタイルでかまわないなら中身の内容やデザインは気にしなくてもいいことになる)を記述すればほんの数十行でページのデザインが可能になるからだ。とても合理的である。
今回意図したサイドバーのデザインは、掲示板に張り紙がされるようなものをイメージした。出力される各ブロックにあわせて下方に張り紙が何枚も貼り付くようなイメージである。現状ではサイドバーのHTMLがregion単位でまとまって出力されるので、張り紙一枚が、下方に伸びていくといった形になっている。機能的にはこれでもまったく問題はないが、やはり最初にイメージしたデザインにこだわってみたい。しかし、そうなると $left に渡される前の各ブロックのコードを変更しなければいけない。Drupal のシステム的に、各ブロックに対するテンプレートもきっとどこかにあるはずだ。それを突き止める必要がある。
Drupal のフォルダ内や公式のハンドブックを調べた結果、block.tpl.php がブロック出力用のテンプレートであることがわかった(そのまんまの名前だった)。
Drupal のテンプレートはテーマディレクトリー内に存在すれば、コアが用意しているのデフォルトのテンプレートを上書きするはずなので、独自テーマディレクトリ内に block.tpl.php というファイルを用意し(中身は公式のページにあるソースか、Drupal システム内にあるオリジナルファイルの内容をコピーする)、これに手を加えて、求めるデザインに近づけてみることにする。
その6につづく。
Recent comments