実際にテンプレートに手を加える前に…
オープンソースを提供してくれる方・団体への感謝の気持ちを忘れない
既存のテンプレートをカスタマイズしたモノは、どのレベルまで修正・変更を加えたとしても「既存のテンプレートをカスタマイズしたモノ」であることは変わりません。素となるのテンプレートの制作者・制作団体の方々の努力や思いを無視するような使用方法は行うべきではありません。
これは、私の個人的な考え方です。テンプレートだけではなく、Joomla!本体、コンポーネント、モジュール、プラグインなど全てのモノに言えることです。
公開・配布されているデータをカスタマイズして、再配布（もちろん再配布を許可するライセンス形態の場合）する場合。有償・無償に関わらず、さもゼロから自身が制作したかのような公開・配布の仕方はすべきではありません。
有償で再配布する場合、自身がカスタマイズした部分（アイデア・知識・作業にかけた時間など）や、再配布にかかる部分（例えばCD-ROMに焼いて配布するなら、CD-ROM代、プリント代）に対して課金すべきで、素となるデータの開発・制作に関する部分についてまでも課金すべきではありません。
カスタマイズの為のカスタマイズなら、おすすめしません。
カスタマイズする事が最終目的ではなく、カスタマイズして「より見やすいモノにする」「自身のサイトイメージに合ったモノにする」事が最終目的である事を忘れないようにしましょう。（もちろん、既存のモノをカスタマイズしながら、仕組みや構造を「学習する」って事は“あり"だと思います。）
ちなみに、「download.Joomla!.de 」で公開・配布されているテンプレートで、Joomla!1.5.×用のモノだけでも341点もあります。（2008/10/28現在）これらを利用させてもらって、モジュールの配置場所を工夫したり、メニューなどのパラメータでいろいろ設定を変えてみるだけで、CSSやPHPに手を加えたりしなくても、結構見栄えは変わるものです。
省力化の為にCMSを利用するのであれば、その方が近道かもしれませんね。
なんて、堅い話はこのぐらいにして、さっそくテンプレートを“いじくりまわして”みましょう(^^ゞ
dj-0013をカスタマイズさせてもらいます!!
- テンプレート名：dj-0013-customize
- テンプレートディレクトリ名：dj-0013-customize
上の方にある画像を変更してみましょう。
ページの上の方にある、おじさんがバンザイしてる画像を別の画像に変えてみましょう。
/templates/dj-0013-customize/index.phpの71行目あたり
<img src="/<?php echo "templates/$this->template/images/"; ?>
baner.jpg" alt="baner" border="0"/>
テンプレートの基盤となるHTML（っていうかPHP）は、Joomla!のバックエンド（管理画面）の上部メニュー“エクステンション”＞“テンプレート管理”で、インストールしてあるテンプレート名一覧の中から編集するテンプレートをクリックで、右上の“HTML編集”ボタンをクリックすると開くことができます。
もちろんFTPでダウンロードしてからテキストエディタなどで開いて見る事もできます。
ここにイメージを表示する記述があります。これで表示される画像は
/templates/dj-0013-customize/images/ のなかにある baner.jpg
が、それかな〜!? って事がわかります。FTPで/templates/dj-0013-customize/images/内から画像「baner.jpg」をダウンロードしてみましょう。画像「baner.jpg」のサイズは960px×128pxです。
テンプレート「dj-0013」は閲覧者がページの表示幅を選択できる仕組みになってます。“Wide width”を選択するとwidth:960pxで表示され、“Narrow width”のを選択するとwidth：760pxで表示されます。
表示幅“Narrow width”の時、baner.jpgの一部分（右側200px）がカットされて表示されます。つまり、表示幅“Narrow width”の時でもおかしな事にならない画像でなければなりません。要するに、画像の右側200pxはカットされても良いイメージにするってことです。画像を編集したらまた、さっきの場所 /templates/dj-0013-customize/images/ の中にFTPでアップロードして上書きしちゃいます。
ここで使う画像は、新しい画像を960px×128pxにリサイズしても良いですし、ダウンロードした画像「baner.jpg」を編集しても良いでしょう。また、画像サイズは960pxよりも大きくても大丈夫です。例えば、1200px×200pxの画像だとしても、画像の左上を基点として960×128の部分だけが表示されます。（画像が大きくても、レイアウトが崩れたりはしないって事。）もちろん、表示されない部分はムダでしかないので、960×128サイズにしておけば、多少容量のムダをなくせるでしょう。
こういう画像だったモノを
こういう画像に変更してアップロードすると…
こういう感じだったのが、
こういう感じに変わりました。
「テンプレートをカスタマイズ!! 【その5】」に続きます。（後日公開）
今のところ原因は不明なのですが、『dj-0013』をカスタマイズしたモノをインストールしてあるデモサイト（公開はしておりませんが…）の方で、『dj-0013』が使えなくなってしまいました。『dj-0013』をデフォルトのテンプレートにすると、フロントエンドに何も表示されなくなってしまいました。カスタマイズした『dj-0013』を一度アンインストールして、あらためてノーマルな『dj-0013』をインストールしてデフォルトに割り当ててみても、やはり表示されない状態。キャッシュを削除してみたりもしたのですが、ダメみたい…。
他のサイト（私が作ったサイトで、やはり『dj-0013』を少しだけカスタマイズさせてもらって使っている）では、正常に表示されているようなのですが…。
と、いうことで『dj-0013』をカスタマイズしていくのは、ここまでにさせていただきます。
ご紹介しているカスタマイズでは、むずかしい事は何もしていないので問題はないと思いますが、どこか別の部分で私が余計な事をしてしまった結果、表示されなくなってしまったのだと思います。
『dj-0013』テンプレートはとてもセンスが良く、扱いやすいテンプレートだと思います。このページでご紹介しているようにヘッダ部分の画像を変えるだけで、さまざまなタイプのサイトに使えるのではないでしょうか？
| < 前 | 次 > |
|---|
