現在、サブ画像を4枚表示させていますが最後の4枚目だけを幅を710pxで表示させたいのです。
ということで、現在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">
<span class="pagesubtitle"><!--★サブタイトル★--><!--{$arrProduct[$key]|h}--></span>
<!--{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" target="_blank" >
<!--{/if}-->
<img src="<!--{$arrFile[$ikey].filepath}-->" alt="<!--{$arrProduct.name|h}-->" title="<!--{$arrProduct.name|h}-->" />
<!--{if $arrProduct[$lkey]|strlen >= 1}--></a>
<!--{/if}-->
</div>
<!--{else}-->
<p class="subtext"><!--★サブテキスト★--><!--{$arrProduct[$ckey]|nl2br_html}--></p>
<!--{/if}-->
<!--▲サブ画像-->
</div>
<!--{/if}-->
<!--{/section}-->
画像を1〜3を234px×200px の画像でfloatにて3列に並べ、その下に710px×200pxの画像を表示させています。
これを 画像1〜3 で 幅500px700px という大きなサイズの画像を使って表示のときだけを 幅234pxとしたいのです。
そう思い、下記のように記してみたのですが画像が表示されません。
何方かどの部分が間違っているのか教えていただけないでしょうか
<!--▼サブコメント-->
<div class="sub_area clearfix">
<span class="pagesubtitle"><!--★サブタイトル★--><!--{$arrProduct.sub_title1|h}--></span>
<!--{* ▼サブ画像 *}-->
<div class="subtext"><!--★サブテキスト★--><!--{$arrProduct.sub_comment1|nl2br_html}--></div>
<div class="subphotoimg">
<!--{html_image file='$arrFile.sub_image1.filepath' width='234px' href='$smarty.const.IMAGE_SAVE_URLPATH|cat:'$arrProduct.sub_large_image1|h' class='expansion' target='_blank' alt='$arrProduct.name|h' title='{$arrProduct.name|h'}-->
</div>
<!--{* ▲サブ画像 *}-->
<span class="pagesubtitle"><!--★サブタイトル★--><!--{$arrProduct.sub_title2|h}--></span>
<!--{* ▼サブ画像 *}-->
<div class="subtext"><!--★サブテキスト★--><!--{$arrProduct.sub_comment2|nl2br_html}--></div>
<div class="subphotoimg">
<!--{html_image file='$arrFile.sub_image2.filepath' width='234px' href='$smarty.const.IMAGE_SAVE_URLPATH|cat:'$arrProduct.sub_large_image2|h' class='expansion' target='_blank' alt='arrProduct.name|h' title='$arrProduct.name|h'}-->
</div>
<!--{* ▲サブ画像 *}-->
<span class="pagesubtitle"><!--★サブタイトル★--><!--{$arrProduct.sub_title3|h}--></span>
<!--{* ▼サブ画像 *}-->
<div class="subtext"><!--★サブテキスト★--><!--{$arrProduct.sub_comment3|nl2br_html}--></div>
<div class="subphotoimg">
<!--{html_image file='$arrFile.sub_image3.filepath' width='234px' href='$smarty.const.IMAGE_SAVE_URLPATH|cat:'$arrProduct.sub_large_image3|h' class='expansion' target='_blank' alt='$arrProduct.name|h' title='ダイヤモンドルース鑑定書&インクルージョン|$arrProduct.name|h'}-->
</div>
<!--{* ▲サブ画像 *}-->
<span class="pagesubtitle"><!--★サブタイトル★--><!--{$arrProduct.sub_title4|h}--></span>
<!--{* ▼サブ画像 *}-->
<div class="subtext"><!--★サブテキスト★--><!--{$arrProduct.sub_comment4|nl2br_html}--></div>
<div class="subphotoimg">
<!--{html_image file='$arrFile.sub_image4.filepath' href='$smarty.const.IMAGE_SAVE_URLPATH|cat:'$arrProduct.sub_large_image4|h' class='expansion' target='_blank' alt='$arrProduct.name|h' title='$arrProduct.name|h'}-->
</div>
<!--{* ▲サブ画像 *}-->
</div>
<!--▲サブコメント-->
現時点で、通常の表示用と拡大画像用でそれぞれ2つの画像を加工して作っていることで手間が増えるのが嫌で
このように1枚の画像を拡大縮小で使おう統一しようと考えているのです。