ZenCartでの、商品の写真を拡大する表現にLightboxを採用するための方法です。時すでに日本語版v1.3もリリースされて久しいのですが、このエントリーで紹介するのはv1.2向けの情報になります＞＜

※ここに公開するコードを利用したことによって発生した不都合の責任を当方では負いかねます。あらかじめご了承下さい。

Lightboxとは？→Lightbox JS 2.02を導入する

• 用意するファイル1:Lightbox JS v2.0
• 用意するファイル2:GD自動サムネイル作成
• 動作テスト済み環境：Zencart v1.2.0-l10n-jp-6 / MySQL 4.0.26-standard / PHP 4.3.11 (Zend: 1.3.0) / Apache 1.3.34 (Unix)
• 参考サイト1:人力検索はてな 指定した画像URL（例：http://aaa.com/sample.jpg）のサムネイルを取得、生成するようなPHPスクリプトを探しています
• 参考サイト2:

インストール

GD自動サムネイル作成をZenCartのRoot直下へ、Lightboxを環境に合わせて任意のフォルダへアップロードします 。Lightboxインストール参考

修正するファイルとその箇所

includes\templates\your_template\templates\tpl_product_info_display.php

101~107行目付近

下のように変更

includes\modules\pages\product_reviews\main_template_vars_images.php
includes\modules\pages\product_reviews_info\main_template_vars_images.php

31行目付近

下のように変更

includes\modules\pages\product_reviews\header.php

35行目付近

下のように変更

includes\modules\pages\product_reviews_write\main_template_vars_images.php

54行目付近

下のように変更

以上の作業で、商品ページおよびレビューページでの写真拡大がLightboxで表現されるようになりました。

これと併せて商品の追加画像をLightbox[roadtrip]でスライドショー表示できたらカッコいいのですが、勝手に追加した画像にサムネイルを作って拡大させるというZenCart仕様の挙動が個人的にイヤで、次の箇所を修正し追加画像のサムネイルを出さないようにしました。商品説明のTEXTAREAにgdthumb.phpとLightboxコードを使って直接画像を呼んで来てスライドショーを再現させるという、ちょっと手間な方法で対応しました。※ZenCartコミュニティ掲示板にこれを成功された方のコードが掲載されています。

includes\templates\your_template\templates\tpl_product_info_display.php

256行目付近の下のソースを削除

GD自動サムネイル (gdthumb.php) 補足

• 『指定されたパスにファイルが見つかりません』のエラーが出る場合、PHPのチェックに引っかかっている可能性があります。gdthumb.phpのソース内で次の箇所を削除するかコメントアウトしてみて下さい。(79行目付近)
  PLAIN TEXT
  PHP:

  79. if(!file_exists($path)) {
  80. return array(0, "指定されたパスにファイルが見つかりません。");
  81. exit;
  82. }

• gdthumb.phpソース内で、あらかじめサムネイル画像の最大値を指定しておくと、各ページの商品写真の大きさを一定にできるので、設定をおすすめします。
  PLAIN TEXT
  PHP:

  58. // 画像の最大横幅
  59. $this->imgMaxWidth = 250; // 1以上の値// 画像の最大縦幅
  60. $this->imgMaxHeight = 0; // 指定しない場合は0 指定する場合は1以上の値