<%image(cms/20070806-zc_jsload2.png|486|129|zencart)%>
たとえば商品表示の演出のためにLightboxなどのライブラリを使ってみたい場合。まず<head>～</head>内にlightbox.jsなどを読み込むための記述を加える必要があるが、多数のファイルで構成されるテンプレートファイルのどれを編集すればいいのか、ZenCartに慣れていないと分かりにくい。
includes/templates/template_default/common/html_header.php
まずはココ…なんだけど、デフォルトのテンプレートはある意味、コアに準ずるファイル。これを編集するのは避け、オーバーライドの作法に則って自作のテンプレートディレクトリにコピーして自由に編集する。しかし今回は、このhtml_header.phpはどっちにしても編集しない。もう少し手軽で分かりやすい方法があるのだ。
この「html_header.php」を開いてみると…親切にいろいろコメントが書いてある。だけど英語なのでよく分からない。あまり気にせずにチャチャッと2行か3行くらい書いてアップロードしてしまえば終わりなんだけど、実はその場だけで終わってしまっては惜しいtipsが英文で書かれている。
/*
* load all site-wide jscript_*.js files from includes/templates/YOURTEMPLATE/jscript, alphabetically
*/
上記のとおり。つまりこうだ。サイトの運用に利用しているテンプレートのディレクトリの中に「jscript」というディレクトリがあるはず。なければ作る。この「jscript」ディレクトリの中に、たとえばlightbox.jsであれば「jscript_lightbox.js」という名前に変更してアップロードする。そうすると、
<script type="text/javascript"
src="includes/templates/カスタムtpl/jscript/jscript_lightbox.js"></script>
上記のような外部読み込み文が自動的に生成・出力される。
http://www.zen-cart.jp/zen-cart-v1.3.0.2-l10n-jp-1/docs/read_me_jscript.html
詳しいことはココに書いてある。サイト内の全ページで出力する前述の方法や、特定のページタイプごとに関連付ける方法など、数パターンの記述方法がある。
http://www.zen-cart.jp/zen-cart-v1.3.0.2-l10n-jp-1/docs/readme_css_system.html
JavaScriptだけではない。CSSも同様。上記のとおり。
実際のところ、ほんのちょっと便利になるだけだ。覚えておかなきゃ役に立たないtipsだが、ZenCartはこういう細かいレベルのカスタマイズネタが多くて覚えきれない。
この方法のメリットは少し違うところにある気がする。たとえば拡張モジュールの配布性への配慮が目的と考えると納得がいく。オーバーライドの作法だけに頼ってモジュールにhtml_header.phpを同梱させてしまったりすると、すでにhtml_header.phpをカスタマイズしている場合はマージが面倒だし、実際、html_header.phpをカスタマイズしたいケースは多いと思う。コアに近いファイルにはなるべく手を付けずに新規ファイルの追加だけで対応させるには、今回のような方法は合理的。
にも関わらず、html_header.phpを同梱しちゃってるモジュールを時々見かける。やっぱりこのtipsってあまり認知されてないような気がする。