商品登録情報の中には、サブ情報１～５まで登録できるようになっています。
サブタイトルやサブコメント、サブ画像などが登録できるのですが、これを工夫して使っておられるケースを時々見かけますね。
今回はそんな時に役立つかもしれない「商品詳細のサブ情報を自由に配置するには？」をやってみたいと思います。
サブ情報は、data/Smarty/templates/default/products/detail.tpl の以下の部分で定義されています。
<!--▼サブコメント-->
<!--{section name=cnt loop=$smarty.const.PRODUCTSUB_MAX}-->
<!--{assign var=key value="sub_title`$smarty.section.cnt.index+1`"}-->
<!--{assign var=ikey value="sub_image`$smarty.section.cnt.index+1`"}-->
<!--{if $arrProduct[$key] != "" or $arrProduct[$ikey]|strlen >= 1}-->
<div class="sub_area clearfix">
<h3><!--★サブタイトル★--><!--{$arrProduct[$key]|h}--></h3>
<!--{assign var=ckey value="sub_comment`$smarty.section.cnt.index+1`"}-->
<!--▼サブ画像-->
<!--{assign var=lkey value="sub_large_image`$smarty.section.cnt.index+1`"}-->
<!--{if $arrProduct[$ikey]|strlen >= 1}-->
<div class="subtext"><!--★サブテキスト★--><!--{$arrProduct[$ckey]|nl2br_html}--></div>
<div class="subphotoimg">
<!--{if $arrProduct[$lkey]|strlen >= 1}-->
<a href="<!--{$smarty.const.IMAGE_SAVE_URLPATH}--><!--{$arrProduct[$lkey]|h}-->" class="expansion" onmouseover="chgImg('<!--{$TPL_URLPATH}-->img/button/btn_expansion_on.gif', 'expansion_<!--{$lkey|h}-->');" onmouseout="chgImg('<!--{$TPL_URLPATH}-->img/button/btn_expansion.gif', 'expansion_<!--{$lkey|h}-->');" target="_blank" >
<!--{/if}-->
<img src="<!--{$arrFile[$ikey].filepath}-->" alt="<!--{$arrProduct.name|h}-->" width="<!--{$arrFile[$ikey].width}-->" height="<!--{$arrFile[$ikey].height}-->" />
<!--{if $arrProduct[$lkey]|strlen >= 1}--></a>
<span class="mini">
<a href="<!--{$smarty.const.IMAGE_SAVE_URLPATH}--><!--{$arrProduct[$lkey]|h}-->" class="expansion" target="_blank">
画像を拡大する</a>
</span>
<!--{/if}-->
</div>
<!--{else}-->
<p class="subtext"><!--★サブテキスト★--><!--{$arrProduct[$ckey]|nl2br_html}--></p>
<!--{/if}-->
<!--▲サブ画像-->
</div>
<!--{/if}-->
<!--{/section}-->
<!--▲サブコメント-->
これを以下のような感じで直せば、サブ情報を個別ブロックに分けることができます。
サブ情報１だけ表示する場合です。
<!--▼サブコメント1-->
<!--{assign var=key value="sub_title1"}-->
<!--{assign var=ikey value="sub_image1"}-->
<!--{assign var=lkey value="sub_large_image1"}-->
<!--{assign var=ckey value="sub_comment1"}-->
<!--{if $arrProduct[$key] != "" or $arrProduct[$ikey]|strlen >= 1}-->
<div class="sub_area clearfix">
<h3><!--★サブタイトル★--><!--{$arrProduct[$key]|h}--></h3>
<!--▼サブ画像-->
<!--{if $arrProduct[$ikey]|strlen >= 1}-->
<div class="subtext"><!--★サブテキスト★--><!--{$arrProduct[$ckey]|nl2br_html}--></div>
<div class="subphotoimg">
<!--{if $arrProduct[$lkey]|strlen >= 1}-->
<a href="<!--{$smarty.const.IMAGE_SAVE_URLPATH}--><!--{$arrProduct[$lkey]|h}-->" class="expansion" onmouseover="chgImg('<!--{$TPL_URLPATH}-->img/button/btn_expansion_on.gif', 'expansion_<!--{$lkey|h}-->');" onmouseout="chgImg('<!--{$TPL_URLPATH}-->img/button/btn_expansion.gif', 'expansion_<!--{$lkey|h}-->');" target="_blank" >
<!--{/if}-->
<img src="<!--{$arrFile[$ikey].filepath}-->" alt="<!--{$arrProduct.name|h}-->" width="<!--{$arrFile[$ikey].width}-->" height="<!--{$arrFile[$ikey].height}-->" />
<!--{if $arrProduct[$lkey]|strlen >= 1}--></a>
<span class="mini">
<a href="<!--{$smarty.const.IMAGE_SAVE_URLPATH}--><!--{$arrProduct[$lkey]|h}-->" class="expansion" target="_blank">
画像を拡大する</a>
</span>
<!--{/if}-->
</div>
<!--{else}-->
<p class="subtext"><!--★サブテキスト★--><!--{$arrProduct[$ckey]|nl2br_html}--></p>
<!--{/if}-->
<!--▲サブ画像-->
</div>
<!--{/if}-->
<!--▲サブコメント1-->
最初の方に変数の定義は固めておきましたので、サブ情報２の場合は、
<!--▼サブコメント2-->
<!--{assign var=key value="sub_title2"}-->
<!--{assign var=ikey value="sub_image2"}-->
<!--{assign var=lkey value="sub_large_image2"}-->
<!--{assign var=ckey value="sub_comment2"}-->
・・・・・・
<!--▲サブコメント2-->
という感じで表示されます。
お世話になります。質問させて頂きたいことがございます。
この機能はブロックでコメントだけを表示するということなのでしょうか。
私は例えば、現在使用しています新着商品ブロックでその画像、値段の下にコメントが表示できるようにしたいのですが、その場合上記2つ目のプログラムをそのまま新着商品ブロックに貼り付けましたが、表示されません。（ただ単に上記プログラム記述を貼り付けるだけでよろしいですよね？）
どの様な使用の仕方をすればよろしいのでしょうか。取り留めのない質問で恐縮ですが宜しくお願いします。
“この機能はブロックでコメントだけを表示する”ものではありません。
商品登録画面のサブ情報１やサブ情報２に、テキストや画像が登録できますが、
実際にこれらの情報を商品詳細ページで表示させようとすると、不便なケースがあります。
サブ情報１とサブ情報２を商品詳細ページの別々の場所に配置したい場合などですね。
そういうときに、それらを別々の場所に配置することも可能ですよ、というのが本記事の趣旨です。
よろしくお願いします。