EC-CUBEでおすすめ商品ブロックに大きめな画像を使う方法

Posted by specterant on 2012.07.31

通常、おすすめ商品ブロックで設定されている画像は
「一覧-メイン画像 [130×130]」が使用され、リサイズをかけて表示されます。

で、130×130px以上のサイズで表示したい時は、
まぁ、設定すれば表示はされますが、画像が荒れます…はい。
そう…美しくないです。

そんな訳で、「詳細-メイン画像 [260×260]」を使用してみます。
変更箇所は「/data/Smarty/templates/default/frontparts/bloc/recommend.tpl」の32行目あたりのimgタグ部分です。

//変更前
<!--{$arrProduct.main_list_image|sfNoImageMainList|h}-->

//変更後(※「main_list_image」の「_list」を削除)
<!--{$arrProduct.main_image|sfNoImageMainList|h}-->
このように変更すれば、「詳細-メイン画像 [260×260]」を使用してくれます。

260×260px以上にしたいんだよね〜って時は、テンプレートだけでは実現出来ないので、
「/data/class_extends/SC_Product_Ex.php」に下記を追加します。
function lists(&$objQuery) {
	$col = <<< __EOS__
								product_id
								,product_code_min
								,product_code_max
								,name
								,comment1
								,comment2
								,comment3
								,main_list_comment
								,main_image
								,main_list_image
								,main_large_image
								,price01_min
								,price01_max
								,price02_min
								,price02_max
								,stock_min
								,stock_max
								,stock_unlimited_min
								,stock_unlimited_max
								,deliv_date_id
								,status
								,del_flg
								,update_date
								__EOS__;
	$res = $objQuery->select($col, $this->alldtlSQL());
	return $res;
}
そして、またまた「/data/Smarty/templates/default/frontparts/bloc/recommend.tpl」
32行目あたりのimgタグ部分を下記のように変更すれば、「詳細-メイン拡大画像[500×500]」を使用してくれます。
//変更前
<!--{$arrProduct.main_list_image|sfNoImageMainList|h}-->

//変更後(※「main_list_image」の「list」を「large」に変更)
<!--{$arrProduct.main_large_image|sfNoImageMainList|h}-->
ちなみに、リサイズ指定しなければ、240pxでリサイズします。
また、EC-CUBE 2.12.1で検証しました。

There are 5 comments in this article:

  1. 04/30/2013たちかわ says:

    こんにちは。私もおすすめに拡大画像を使用したいと考えていまして、検索でたどりつきました。
    利用させていただき、拡大画像を表示させようとしたのですが、
    『システムエラーが発生しました。
    大変お手数ですが、サイト管理者までご連絡ください。』
    という旨のテキストが表示されエラーになってしまいました。

    ドリームウィーバーにてこのスクリプトを表示させたら、
    /data/class_extends/SC_Product_Ex.phpに追加するスクリプトの、28行目

    return $res;の部分にシンタックスエラーがあるといわれました。

    参考にさせていただいているのに大変失礼とは思いますが
    こちらに間違いございませんでしょうか?

    よろしくお願いいたします。

  2. 04/30/2013たちかわ says:

    すみません。私の間違いでシンタックスエラーはなくなりました。
    ただ、

    「/data/Smarty/templates/default/frontparts/bloc/recommend.tpl」

    上記ファイルの中の、imgタグ部分を、下記のmain_large_imgaeへと変更しても表示されませんでした。






    「/data/class_extends/SC_Product_Ex.php」に追加する場所は、

    require_once CLASS_REALDIR . ‘SC_Product.php';

    class SC_Product_Ex extends SC_Product {
    }

    この下へ入れるだけでよろしいのでしょうか?
    よろしくお願いいたします。

  3. 04/30/2013specterant says:

    > たちかわさん

    はじめまして。SpecterAntです。
    コメントいただいた「/data/class_extends/SC_Product_Ex.php」に追加する場所についでですが、
    classの下ではなく、中です。
    下記のような感じです。

    class SC_Product_Ex extends SC_Product {
    	function lists(&$objQuery) {
    					$col = <<< __EOS__
    									product_id
    									,product_code_min
    									,product_code_max
    									,name
    									,comment1
    									,comment2
    									,comment3
    									,main_list_comment
    									,main_image
    									,main_list_image
    									,main_large_image
    									,price01_min
    									,price01_max
    									,price02_min
    									,price02_max
    									,stock_min
    									,stock_max
    									,stock_unlimited_min
    									,stock_unlimited_max
    									,deliv_date_id
    									,status
    									,del_flg
    									,update_date
    __EOS__;
    					$res = $objQuery->select($col, $this->alldtlSQL());
    					return $res;
    	}
    }
    
    わかりづらいエントリーで申し訳がざいませんが、
    これからもよろしくお願い致します。

  4. 05/1/2013たちかわ says:

    ばっちり表示できました!
    どうしても、表示させたかったのでとてもうれしいです。
    勉強不足な私にも、親切丁寧にお返事いただきとても助かりました。
    ご面倒をおかけしてすみません。
    本当にありがとうございました。

  5. 05/1/2013specterant says:

    > たちかわさん

    わざわざコメントしていただきありがとうございます!
    無事に表示できたみたいでよかったです。
    少しでもお役に立てたなら嬉しいです。
    こんなサイトですがこれからもよろしくお願い致します。

Write a comment:

WP-SpamFree by Pole Position Marketing