CS-Cart3 ランキングブロックにランク画像を追加する

CS-Cart3の商品ブロックを使い、[コンテンツ]の[表示内容]に「人気の商品」を指定すると、売れ行きランキング表示ができる。
このランキングに「No.1」「No.2」のような画像を追加する。

■やること
ランキング画像を利用中スキンのimagesに「ranking_X.png」というファイル名でアップロードし、 下記のようなコードを追加する。

　※Xは1から始まる数字

※sproductsは後述する「グリッド」の場合だけかもしれないので、その場合は、該当する.tplファイルのforeach名に置き換えてください
※管理画面で指定した表示数分の画像を作ってアップロードしておくこと。

■コードの追加箇所
テンプレートを「グリッド」にした場合。

グリッドのテンプレートは
　/skins/[利用中のスキン名]/customer/blocks/list_templates/grid_list.tpl
となる。

grid_list.tplには
　{hook name="products:product_multicolumns_list"}
というhookポイントの記述があるので、

　/skins/[利用中のスキン名]/customer/addons/mychanges/hooks/products
　/skins/[利用中のスキン名]/customer/addons/mychanges/hooks/products/product_multicolumns_list.override.tpl

を作成し、product_multicolumns_list.override.tplを変更する（元のgrid_list.tplはいじらない）。
product_multicolumns_list.override.tplは、grid_list.tplのhookポイントの中身をコピーし、任意の位置にランキング画像のコードを追加する。

■注意
このままだとgrid_list.tplのマルチカラムを利用するすべてのブロックで画像が表示されてしまうので、任意の場所だけに表示できるように制限する必要がある。
制限の方法はいろいろあるだろうけども、たとえばトップページのブロックのみ表示させたい、といった時にはテンプレート側で特定URLのみ表示、としたのが下記のサンプル。

画像の上にランキング画像を表示する例(トップページのみ表示)

 

  

{if $smarty.server.REQUEST_URI == "/"}

{/if}
  {include file="common_templates/image.tpl" obj_id=$obj_id_prefix images=$product.main_pair object_type="product" show_thumbnail="Y" image_width=$settings.Thumbnails.product_lists_thumbnail_width image_height=$settings.Thumbnails.product_lists_thumbnail_height}
  {if $settings.Appearance.disable_quick_view != 'Y'}
  {include file="views/products/components/quick_view_link.tpl"}
  {/if}
　：
　：