第4回 テーマを完成させる

テーマとは

　Concrete5のテーマとは、ページのレイアウトやヘッダーやフッターなどが集まったファイルです。

　ブロック以外のHTML部分、画像、CSSのすべてを含んでいます。このテーマを上手に作ることでConcrete5がオリジナルのサイトになっていきます。実は、オリジナルのテーマは前回（http://thinkit.jp/article/880/1/）作成しました。今回はそこにさらに手を加えて形を変えていきましょう。

　今回も「example」を編集します。まず、ファイルの説明をしていきましょう。ページの大枠が書かれているファイルは、レイアウトによって異なります。full.php、left_sidebar.php、default.phpが全幅のページ、左サイドバーのページ、右サイドバーのページとなっています。これらのファイルからヘッダーや、#bodyの中の部分（先週のHTMLの構成を参照してください）、フッターが呼び出されてページ全体が構成されます。ヘッダーとフッターはelementsフォルダの中にあるheader.php,footer.phpがそれぞれ対応しています。

ロゴとサイト名の変更

　まずは、ロゴイメージに変えてみましょう。変えるにはちょっとだけPHPの知識が必要ですが、これを機会にちょっとだけかじってみるのも良いでしょう。それでは早速、サイト名を消してロゴを表示しましょう。

　編集するファイルは、elementsの中にあるheader.phpです。ファイルを開いて見るとHTMLの中に<?php　?>がたくさんあるのがわかります。

　この<?php ?>で囲まれた部分が自動で生成される部分で、それ以外が固定で出力される部分です。目的のサイト名は、32行目がサイト名を表示している部分です。

<h1 id="logo"><a href="<?php echo DIR_REL?>/"><?php echo SITE?></a></h1>

　この行の<?php echo SITE?>となっているところが怪しいです。試しに「サイト名が変わるかテスト」に書き換えてアップロードしてみましょう。サイトを見てみると、今までサイト名が入っていたところが「サイト名が変わるかテスト」に変わっています。

　それでは本題のロゴイメージに変更していきましょう。ロゴマークのファイル名は「logo.png」としてexample/images/の中にアップロードしておきます。Concrete5を「/」にインストールした場合は、/example/images/logo.pngと、ファイル名を直接指定します。

　もしConcrete5を「/」ではないとろこにインストールした場合は、ちょっと厄介です。せっかくのPHPですので、動的に取得してみましょう。

　Concrete5では最初から用意されている機能がいくつもあります。それを利用することで、効率的にテーマを作ることができます。テーマのパスを取得するにはテーマのphpファイル内では$this->getThemePath()で取得することができます。

　先ほど説明した

<?php echo SITE?>

　を

<img src="<?php echo $this->getThemePath() ?>/images/logo.png" alt="<?php echo SITE?>"/>

と変更しましょう。これでロゴが表示されます。