商品画像10枚表示 PC版有料テンプレート用
このページでは、レギュラーより上のプランにプランアップした際に、
レギュラーより上のプランで標準機能である商品画像10枚表示を行う為の、既存テンプレートの修正方法を説明しています。
商品画像10枚表示は、レギュラーより上のプランをご利用のショップ様のみとなります。それ以外のプランをご利用いただいているショップ様が、本修正を行いましても、
商品画像10枚表示は行えません。ご了承ください。
2013年5月13日以降にダウンロードされたショップテンプレートには、本修正を行う必要はございません。
商品画像10枚表示は行えません。ご了承ください。
2013年5月13日以降にダウンロードされたショップテンプレートには、本修正を行う必要はございません。
- 商品画像10枚表示 PC版無料テンプレート用 アップデートマニュアルはこちら
- 商品画像10枚表示 PC版有料テンプレート用 アップデートマニュアルはこちら
- 商品画像10枚表示 モバイル版無料テンプレート用 アップデートマニュアルはこちら
- 商品画像10枚表示 モバイル版有料テンプレート用 アップデートマニュアルはこちら
- 商品画像10枚表示 スマートフォン版無料テンプレート用 アップデートマニュアルはこちら
- 商品画像10枚表示 スマートフォン版有料テンプレート用 アップデートマニュアルはこちら
商品画像10枚表示用タグ追加方法 … PC版有料テンプレート用
対応方法は以下の2通りございます。どちらかの対応をお願いします。
■ 対応方法1:再度テンプレートを追加する 【※推奨】
■ 対応方法2:テンプレートの該当箇所を修正、または追加する
テンプレートの編集を行う場合は、【商品詳細】HTML・【共通】CSS の計2箇所を編集します。
使用するテンプレートを確認し、編集を行ってください。
» 各テンプレート修正内容へのリンク一覧はこちら
使用するテンプレートを確認し、編集を行ってください。
» 各テンプレート修正内容へのリンク一覧はこちら
※修正タグを変更する位置が不明な場合は、ご利用中のテンプレートと同じテンプレートを追加していただき、
修正用タグが記述されている位置をご確認ください。
商品画像10枚表示用タグ追加手順
使用しているテンプレートを確認
【商品詳細】HTML に追加するタグは各テンプレート毎に異なります。対象のテンプレートをご確認ください。
タグの挿入箇所を確認
【テンプレート別挿入タグ一覧表】の、 <!-- 黄色いマークの文字列 --> が挿入箇所の目安となりますので、
文字列を【商品詳細】HTML 内にて検索します。
文字列を【商品詳細】HTML 内にて検索します。
指定タグをコピー、挿入
・検索後、各テンプレートの追加位置をご確認いただき、 ピンクエリアの追加タグ を挿入してください。
・テンプレートによっては、一部タグを削除していただいた後、タグを追加していただく必要がございます。
削除する必要のタグがある場合、 削除該当部分を グレーエリア で表示しています。
グレーエリア 部分のタグを削除後に、 ピンクエリアの追加タグ 部分のタグを挿入してください。
・追加するHTMLタグには、画像を1枚ずつ追加するタグと、画像をまとめて出力するタグの2通りがございます。
どちらのタグをご利用いただいても、商品画像は表示されますので、
テンプレートのカスタマイズなど行っている場合は、カスタマイズに合ったHTMLタグをご利用ください。
※CSSは共通です。
・テンプレートによっては、一部タグを削除していただいた後、タグを追加していただく必要がございます。
削除する必要のタグがある場合、 削除該当部分を グレーエリア で表示しています。
グレーエリア 部分のタグを削除後に、 ピンクエリアの追加タグ 部分のタグを挿入してください。
・追加するHTMLタグには、画像を1枚ずつ追加するタグと、画像をまとめて出力するタグの2通りがございます。
どちらのタグをご利用いただいても、商品画像は表示されますので、
テンプレートのカスタマイズなど行っている場合は、カスタマイズに合ったHTMLタグをご利用ください。
※CSSは共通です。
■ テンプレート別挿入タグ一覧表 PC版有料テンプレート 【 商品詳細 】HTML
■ Paper and Wood
商品詳細HTML - 画像を1枚ずつ追加する場合のタグ
削除タグ 追加タグ
<!--*****商品画像*****--> <div class="images"> <script language="javascript"> <!-- function Imgche(ado) { if(document.images)document.outside.src = ado; } //--> </script> <{if $product.img_url != ""}> <img src="<{$product.img_url}>" name="outside" /><{/if}> <{if $product.ot1_url != "" or $product.ot2_url != "" or $product.ot3_url != ""}> <{if $otherimg_num != 0}> <ul> <li><a href="#" onMouseOver="Imgche('<{$product.img_url}>');return false;"><img src="<{$product.img_url}>" /></a></li> <{if $product.ot1_url != ""}><li><a href="#" onMouseOver="Imgche('<{$product.ot1_url}>');return false;"><img src="<{$product.ot1_url}>" /></a></li><{/if}> <{if $product.ot2_url != ""}><li><a href="#" onMouseOver="Imgche('<{$product.ot2_url}>');return false;"><img src="<{$product.ot2_url}>" /></a></li><{/if}> <{if $product.ot3_url != ""}><li><a href="#" onMouseOver="Imgche('<{$product.ot3_url}>');return false;"><img src="<{$product.ot3_url}>" /></a></li><{/if}> <{if $product.ot4_url != ""}><li><a href="#" onMouseOver="Imgche('<{$product.ot4_url}>');return false;"><img src="<{$product.ot4_url}>" /></a></li><{/if}> <{if $product.ot5_url != ""}><li><a href="#" onMouseOver="Imgche('<{$product.ot5_url}>');return false;"><img src="<{$product.ot5_url}>" /></a></li><{/if}> <{if $product.ot6_url != ""}><li><a href="#" onMouseOver="Imgche('<{$product.ot6_url}>');return false;"><img src="<{$product.ot6_url}>" /></a></li><{/if}> <{if $product.ot7_url != ""}><li><a href="#" onMouseOver="Imgche('<{$product.ot7_url}>');return false;"><img src="<{$product.ot7_url}>" /></a></li><{/if}> <{if $product.ot8_url != ""}><li><a href="#" onMouseOver="Imgche('<{$product.ot8_url}>');return false;"><img src="<{$product.ot8_url}>" /></a></li><{/if}> <{if $product.ot9_url != ""}><li><a href="#" onMouseOver="Imgche('<{$product.ot9_url}>');return false;"><img src="<{$product.ot9_url}>" /></a></li><{/if}> </ul><{/if}>
商品詳細HTML - 画像をまとめて出力するタグ
削除タグ 追加タグ
<!--*****商品画像*****--> <div class="images"> <script language="javascript"> <!-- function Imgche(ado) { if(document.images)document.outside.src = ado; } //--> </script> <{if $product.img_url != ""}> <img src="<{$product.img_url}>" name="outside" /><{/if}> <ul> <li><a href="#" onMouseOver="Imgche('<{$product.img_url}>');return false;"><img src="<{$product.img_url}>" /></a></li> <{if $product.ot1_url != ""}><li><a href="#" onMouseOver="Imgche('<{$product.ot1_url}>');return false;"><img src="<{$product.ot1_url}>" /></a></li><{/if}> <{if $product.ot2_url != ""}><li><a href="#" onMouseOver="Imgche('<{$product.ot2_url}>');return false;"><img src="<{$product.ot2_url}>" /></a></li><{/if}> <{if $product.ot3_url != ""}><li><a href="#" onMouseOver="Imgche('<{$product.ot3_url}>');return false;"><img src="<{$product.ot3_url}>" /></a></li><{/if}> <{if $product.img_url != "" || $otherimg_num != 0}> <{if $product.img_url != ""}> <img src="<{$product.img_url}>" name="outside" /> <{else}> <{section name=num loop=$otherimg}> <{if $smarty.section.num.iteration == 1}> <img src="<{$otherimg[num].url}>" name="outside" /> <{/if}> <{/section}> <{/if}> <{/if}> <{if $otherimg_num != 0}> <ul> <{if $product.img_url != ""}> <li><a href="#" onMouseOver="Imgche('<{$product.img_url}>');return false;"><img src="<{$product.img_url}>" /></a></li> <{/if}> <{section name=num loop=$otherimg}> <{if $otherimg[num].url != ""}><li><a href="#" onMouseOver="Imgche('<{$otherimg[num].url}>');return false;"><img src="<{$otherimg[num].url}>" /></a></li><{/if}> <{/section}> </ul><{/if}>
商品詳細CSS
削除タグ 追加タグ
#contents div.images { margin: 0px 10px 20px 0px; float: left; text-align: center; } #contents div.images img { display: block; margin: 0px 0px 10px; margin: 0px 20px 10px 0px; border-style: none; } #contents div.images ul { list-style-type:none; list-style-image:none; margin: 0px; margin: 0px 0px 20px 0px; } #contents div.images ul li { margin: 0px 5px 0px 0px; margin: 0px 1px 20px 0px; float: left; background: url(none); padding: 0px; }
■ Unknown(pink)
商品詳細HTML - 画像を1枚ずつ追加する場合のタグ
削除タグ 追加タグ
<!--*****商品画像*****--> <div class="images"> <script language="javascript"> <!-- function Imgche(ado) { if(document.images)document.outside.src = ado; } //--> </script> <{if $product.img_url != ""}> <img src="<{$product.img_url}>" name="outside" /><{/if}> <{if $product.ot1_url != "" or $product.ot2_url != "" or $product.ot3_url != ""}> <{if $otherimg_num != 0}> <ul> <li><a href="#" onMouseOver="Imgche('<{$product.img_url}>');return false;"><img src="<{$product.img_url}>" /></a></li> <{if $product.ot1_url != ""}><li><a href="#" onMouseOver="Imgche('<{$product.ot1_url}>');return false;"><img src="<{$product.ot1_url}>" /></a></li><{/if}> <{if $product.ot2_url != ""}><li><a href="#" onMouseOver="Imgche('<{$product.ot2_url}>');return false;"><img src="<{$product.ot2_url}>" /></a></li><{/if}> <{if $product.ot3_url != ""}><li><a href="#" onMouseOver="Imgche('<{$product.ot3_url}>');return false;"><img src="<{$product.ot3_url}>" /></a></li><{/if}> <{if $product.ot4_url != ""}><li><a href="#" onMouseOver="Imgche('<{$product.ot4_url}>');return false;"><img src="<{$product.ot4_url}>" /></a></li><{/if}> <{if $product.ot5_url != ""}><li><a href="#" onMouseOver="Imgche('<{$product.ot5_url}>');return false;"><img src="<{$product.ot5_url}>" /></a></li><{/if}> <{if $product.ot6_url != ""}><li><a href="#" onMouseOver="Imgche('<{$product.ot6_url}>');return false;"><img src="<{$product.ot6_url}>" /></a></li><{/if}> <{if $product.ot7_url != ""}><li><a href="#" onMouseOver="Imgche('<{$product.ot7_url}>');return false;"><img src="<{$product.ot7_url}>" /></a></li><{/if}> <{if $product.ot8_url != ""}><li><a href="#" onMouseOver="Imgche('<{$product.ot8_url}>');return false;"><img src="<{$product.ot8_url}>" /></a></li><{/if}> <{if $product.ot9_url != ""}><li><a href="#" onMouseOver="Imgche('<{$product.ot9_url}>');return false;"><img src="<{$product.ot9_url}>" /></a></li><{/if}> </ul><{/if}>
商品詳細HTML - 画像をまとめて出力するタグ
削除タグ 追加タグ
<!--*****商品画像*****--> <div class="images"> <script language="javascript"> <!-- function Imgche(ado) { if(document.images)document.outside.src = ado; } //--> </script> <{if $product.img_url != ""}> <img src="<{$product.img_url}>" name="outside" /><{/if}> <ul> <li><a href="#" onMouseOver="Imgche('<{$product.img_url}>');return false;"><img src="<{$product.img_url}>" /></a></li> <{if $product.ot1_url != ""}><li><a href="#" onMouseOver="Imgche('<{$product.ot1_url}>');return false;"><img src="<{$product.ot1_url}>" /></a></li><{/if}> <{if $product.ot2_url != ""}><li><a href="#" onMouseOver="Imgche('<{$product.ot2_url}>');return false;"><img src="<{$product.ot2_url}>" /></a></li><{/if}> <{if $product.ot3_url != ""}><li><a href="#" onMouseOver="Imgche('<{$product.ot3_url}>');return false;"><img src="<{$product.ot3_url}>" /></a></li><{/if}> <{if $product.img_url != "" || $otherimg_num != 0}> <{if $product.img_url != ""}> <img src="<{$product.img_url}>" name="outside" /> <{else}> <{section name=num loop=$otherimg}> <{if $smarty.section.num.iteration == 1}> <img src="<{$otherimg[num].url}>" name="outside" /> <{/if}> <{/section}> <{/if}> <{/if}> <{if $otherimg_num != 0}> <ul> <{if $product.img_url != ""}> <li><a href="#" onMouseOver="Imgche('<{$product.img_url}>');return false;"><img src="<{$product.img_url}>" /></a></li> <{/if}> <{section name=num loop=$otherimg}> <{if $otherimg[num].url != ""}><li><a href="#" onMouseOver="Imgche('<{$otherimg[num].url}>');return false;"><img src="<{$otherimg[num].url}>" /></a></li><{/if}> <{/section}> </ul><{/if}>
商品詳細CSS
削除タグ 追加タグ
#contents div.images { margin: 0px 10px 20px 0px; float: left; text-align: center; } #contents div.images img { display: block; margin: 0px 0px 10px; margin: 0px 20px 10px 0px; border-style: none; } #contents div.images ul { list-style-type:none; list-style-image:none; margin: 0px; margin: 0px 0px 20px 0px; } #contents div.images ul li { margin: 0px 5px 0px 0px; margin: 0px 1px 20px 0px; float: left; background: url(none); padding: 0px; }
■ Unknown(green)
商品詳細HTML - 画像を1枚ずつ追加する場合のタグ
削除タグ 追加タグ
<!--*****商品画像*****--> <div class="images"> <script language="javascript"> <!-- function Imgche(ado) { if(document.images)document.outside.src = ado; } //--> </script> <{if $product.img_url != ""}> <img src="<{$product.img_url}>" name="outside" /><{/if}> <{if $product.ot1_url != "" or $product.ot2_url != "" or $product.ot3_url != ""}> <{if $otherimg_num != 0}> <ul> <li><a href="#" onMouseOver="Imgche('<{$product.img_url}>');return false;"><img src="<{$product.img_url}>" /></a></li> <{if $product.ot1_url != ""}><li><a href="#" onMouseOver="Imgche('<{$product.ot1_url}>');return false;"><img src="<{$product.ot1_url}>" /></a></li><{/if}> <{if $product.ot2_url != ""}><li><a href="#" onMouseOver="Imgche('<{$product.ot2_url}>');return false;"><img src="<{$product.ot2_url}>" /></a></li><{/if}> <{if $product.ot3_url != ""}><li><a href="#" onMouseOver="Imgche('<{$product.ot3_url}>');return false;"><img src="<{$product.ot3_url}>" /></a></li><{/if}> <{if $product.ot4_url != ""}><li><a href="#" onMouseOver="Imgche('<{$product.ot4_url}>');return false;"><img src="<{$product.ot4_url}>" /></a></li><{/if}> <{if $product.ot5_url != ""}><li><a href="#" onMouseOver="Imgche('<{$product.ot5_url}>');return false;"><img src="<{$product.ot5_url}>" /></a></li><{/if}> <{if $product.ot6_url != ""}><li><a href="#" onMouseOver="Imgche('<{$product.ot6_url}>');return false;"><img src="<{$product.ot6_url}>" /></a></li><{/if}> <{if $product.ot7_url != ""}><li><a href="#" onMouseOver="Imgche('<{$product.ot7_url}>');return false;"><img src="<{$product.ot7_url}>" /></a></li><{/if}> <{if $product.ot8_url != ""}><li><a href="#" onMouseOver="Imgche('<{$product.ot8_url}>');return false;"><img src="<{$product.ot8_url}>" /></a></li><{/if}> <{if $product.ot9_url != ""}><li><a href="#" onMouseOver="Imgche('<{$product.ot9_url}>');return false;"><img src="<{$product.ot9_url}>" /></a></li><{/if}> </ul><{/if}>
商品詳細HTML - 画像をまとめて出力するタグ
削除タグ 追加タグ
<!--*****商品画像*****--> <div class="images"> <script language="javascript"> <!-- function Imgche(ado) { if(document.images)document.outside.src = ado; } //--> </script> <{if $product.img_url != ""}> <img src="<{$product.img_url}>" name="outside" /><{/if}> <ul> <li><a href="#" onMouseOver="Imgche('<{$product.img_url}>');return false;"><img src="<{$product.img_url}>" /></a></li> <{if $product.ot1_url != ""}><li><a href="#" onMouseOver="Imgche('<{$product.ot1_url}>');return false;"><img src="<{$product.ot1_url}>" /></a></li><{/if}> <{if $product.ot2_url != ""}><li><a href="#" onMouseOver="Imgche('<{$product.ot2_url}>');return false;"><img src="<{$product.ot2_url}>" /></a></li><{/if}> <{if $product.ot3_url != ""}><li><a href="#" onMouseOver="Imgche('<{$product.ot3_url}>');return false;"><img src="<{$product.ot3_url}>" /></a></li><{/if}> <{if $product.img_url != "" || $otherimg_num != 0}> <{if $product.img_url != ""}> <img src="<{$product.img_url}>" name="outside" /> <{else}> <{section name=num loop=$otherimg}> <{if $smarty.section.num.iteration == 1}> <img src="<{$otherimg[num].url}>" name="outside" /> <{/if}> <{/section}> <{/if}> <{/if}> <{if $otherimg_num != 0}> <ul> <{if $product.img_url != ""}> <li><a href="#" onMouseOver="Imgche('<{$product.img_url}>');return false;"><img src="<{$product.img_url}>" /></a></li> <{/if}> <{section name=num loop=$otherimg}> <{if $otherimg[num].url != ""}><li><a href="#" onMouseOver="Imgche('<{$otherimg[num].url}>');return false;"><img src="<{$otherimg[num].url}>" /></a></li><{/if}> <{/section}> </ul><{/if}>
商品詳細CSS
削除タグ 追加タグ
#contents div.images { margin: 0px 10px 20px 0px; float: left; text-align: center; } #contents div.images img { display: block; margin: 0px 0px 10px; margin: 0px 20px 10px 0px; border-style: none; } #contents div.images ul { list-style-type:none; list-style-image:none; margin: 0px; margin: 0px 0px 20px 0px; } #contents div.images ul li { margin: 0px 5px 0px 0px; margin: 0px 1px 20px 0px; float: left; background: url(none); padding: 0px; }
■ Unknown(red)
商品詳細HTML - 画像を1枚ずつ追加する場合のタグ
削除タグ 追加タグ
<!--*****商品画像*****--> <div class="images"> <script language="javascript"> <!-- function Imgche(ado) { if(document.images)document.outside.src = ado; } //--> </script> <{if $product.img_url != ""}> <img src="<{$product.img_url}>" name="outside" /><{/if}> <{if $product.ot1_url != "" or $product.ot2_url != "" or $product.ot3_url != ""}> <{if $otherimg_num != 0}> <ul> <li><a href="#" onMouseOver="Imgche('<{$product.img_url}>');return false;"><img src="<{$product.img_url}>" /></a></li> <{if $product.ot1_url != ""}><li><a href="#" onMouseOver="Imgche('<{$product.ot1_url}>');return false;"><img src="<{$product.ot1_url}>" /></a></li><{/if}> <{if $product.ot2_url != ""}><li><a href="#" onMouseOver="Imgche('<{$product.ot2_url}>');return false;"><img src="<{$product.ot2_url}>" /></a></li><{/if}> <{if $product.ot3_url != ""}><li><a href="#" onMouseOver="Imgche('<{$product.ot3_url}>');return false;"><img src="<{$product.ot3_url}>" /></a></li><{/if}> <{if $product.ot4_url != ""}><li><a href="#" onMouseOver="Imgche('<{$product.ot4_url}>');return false;"><img src="<{$product.ot4_url}>" /></a></li><{/if}> <{if $product.ot5_url != ""}><li><a href="#" onMouseOver="Imgche('<{$product.ot5_url}>');return false;"><img src="<{$product.ot5_url}>" /></a></li><{/if}> <{if $product.ot6_url != ""}><li><a href="#" onMouseOver="Imgche('<{$product.ot6_url}>');return false;"><img src="<{$product.ot6_url}>" /></a></li><{/if}> <{if $product.ot7_url != ""}><li><a href="#" onMouseOver="Imgche('<{$product.ot7_url}>');return false;"><img src="<{$product.ot7_url}>" /></a></li><{/if}> <{if $product.ot8_url != ""}><li><a href="#" onMouseOver="Imgche('<{$product.ot8_url}>');return false;"><img src="<{$product.ot8_url}>" /></a></li><{/if}> <{if $product.ot9_url != ""}><li><a href="#" onMouseOver="Imgche('<{$product.ot9_url}>');return false;"><img src="<{$product.ot9_url}>" /></a></li><{/if}> </ul><{/if}>
商品詳細HTML - 画像をまとめて出力するタグ
削除タグ 追加タグ
<!--*****商品画像*****--> <div class="images"> <script language="javascript"> <!-- function Imgche(ado) { if(document.images)document.outside.src = ado; } //--> </script> <{if $product.img_url != ""}> <img src="<{$product.img_url}>" name="outside" /><{/if}> <ul> <li><a href="#" onMouseOver="Imgche('<{$product.img_url}>');return false;"><img src="<{$product.img_url}>" /></a></li> <{if $product.ot1_url != ""}><li><a href="#" onMouseOver="Imgche('<{$product.ot1_url}>');return false;"><img src="<{$product.ot1_url}>" /></a></li><{/if}> <{if $product.ot2_url != ""}><li><a href="#" onMouseOver="Imgche('<{$product.ot2_url}>');return false;"><img src="<{$product.ot2_url}>" /></a></li><{/if}> <{if $product.ot3_url != ""}><li><a href="#" onMouseOver="Imgche('<{$product.ot3_url}>');return false;"><img src="<{$product.ot3_url}>" /></a></li><{/if}> <{if $product.img_url != "" || $otherimg_num != 0}> <{if $product.img_url != ""}> <img src="<{$product.img_url}>" name="outside" /> <{else}> <{section name=num loop=$otherimg}> <{if $smarty.section.num.iteration == 1}> <img src="<{$otherimg[num].url}>" name="outside" /> <{/if}> <{/section}> <{/if}> <{/if}> <{if $otherimg_num != 0}> <ul> <{if $product.img_url != ""}> <li><a href="#" onMouseOver="Imgche('<{$product.img_url}>');return false;"><img src="<{$product.img_url}>" /></a></li> <{/if}> <{section name=num loop=$otherimg}> <{if $otherimg[num].url != ""}><li><a href="#" onMouseOver="Imgche('<{$otherimg[num].url}>');return false;"><img src="<{$otherimg[num].url}>" /></a></li><{/if}> <{/section}> </ul><{/if}>
商品詳細CSS
削除タグ 追加タグ
#contents div.images { margin: 0px 10px 20px 0px; float: left; text-align: center; } #contents div.images img { display: block; margin: 0px 0px 10px; margin: 0px 20px 10px 0px; border-style: none; } #contents div.images ul { list-style-type:none; list-style-image:none; margin: 0px; margin: 0px 0px 20px 0px; } #contents div.images ul li { margin: 0px 5px 0px 0px; margin: 0px 1px 20px 0px; float: left; background: url(none); padding: 0px; }
■ Unknown(yellow)
商品詳細HTML - 画像を1枚ずつ追加する場合のタグ
削除タグ 追加タグ
<!--*****商品画像*****--> <div class="images"> <script language="javascript"> <!-- function Imgche(ado) { if(document.images)document.outside.src = ado; } //--> </script> <{if $product.img_url != ""}> <img src="<{$product.img_url}>" name="outside" /><{/if}> <{if $product.ot1_url != "" or $product.ot2_url != "" or $product.ot3_url != ""}> <{if $otherimg_num != 0}> <ul> <li><a href="#" onMouseOver="Imgche('<{$product.img_url}>');return false;"><img src="<{$product.img_url}>" /></a></li> <{if $product.ot1_url != ""}><li><a href="#" onMouseOver="Imgche('<{$product.ot1_url}>');return false;"><img src="<{$product.ot1_url}>" /></a></li><{/if}> <{if $product.ot2_url != ""}><li><a href="#" onMouseOver="Imgche('<{$product.ot2_url}>');return false;"><img src="<{$product.ot2_url}>" /></a></li><{/if}> <{if $product.ot3_url != ""}><li><a href="#" onMouseOver="Imgche('<{$product.ot3_url}>');return false;"><img src="<{$product.ot3_url}>" /></a></li><{/if}> <{if $product.ot4_url != ""}><li><a href="#" onMouseOver="Imgche('<{$product.ot4_url}>');return false;"><img src="<{$product.ot4_url}>" /></a></li><{/if}> <{if $product.ot5_url != ""}><li><a href="#" onMouseOver="Imgche('<{$product.ot5_url}>');return false;"><img src="<{$product.ot5_url}>" /></a></li><{/if}> <{if $product.ot6_url != ""}><li><a href="#" onMouseOver="Imgche('<{$product.ot6_url}>');return false;"><img src="<{$product.ot6_url}>" /></a></li><{/if}> <{if $product.ot7_url != ""}><li><a href="#" onMouseOver="Imgche('<{$product.ot7_url}>');return false;"><img src="<{$product.ot7_url}>" /></a></li><{/if}> <{if $product.ot8_url != ""}><li><a href="#" onMouseOver="Imgche('<{$product.ot8_url}>');return false;"><img src="<{$product.ot8_url}>" /></a></li><{/if}> <{if $product.ot9_url != ""}><li><a href="#" onMouseOver="Imgche('<{$product.ot9_url}>');return false;"><img src="<{$product.ot9_url}>" /></a></li><{/if}> </ul><{/if}>
商品詳細HTML - 画像をまとめて出力するタグ
削除タグ 追加タグ
<!--*****商品画像*****--> <div class="images"> <script language="javascript"> <!-- function Imgche(ado) { if(document.images)document.outside.src = ado; } //--> </script> <{if $product.img_url != ""}> <img src="<{$product.img_url}>" name="outside" /><{/if}> <ul> <li><a href="#" onMouseOver="Imgche('<{$product.img_url}>');return false;"><img src="<{$product.img_url}>" /></a></li> <{if $product.ot1_url != ""}><li><a href="#" onMouseOver="Imgche('<{$product.ot1_url}>');return false;"><img src="<{$product.ot1_url}>" /></a></li><{/if}> <{if $product.ot2_url != ""}><li><a href="#" onMouseOver="Imgche('<{$product.ot2_url}>');return false;"><img src="<{$product.ot2_url}>" /></a></li><{/if}> <{if $product.ot3_url != ""}><li><a href="#" onMouseOver="Imgche('<{$product.ot3_url}>');return false;"><img src="<{$product.ot3_url}>" /></a></li><{/if}> <{if $product.img_url != "" || $otherimg_num != 0}> <{if $product.img_url != ""}> <img src="<{$product.img_url}>" name="outside" /> <{else}> <{section name=num loop=$otherimg}> <{if $smarty.section.num.iteration == 1}> <img src="<{$otherimg[num].url}>" name="outside" /> <{/if}> <{/section}> <{/if}> <{/if}> <{if $otherimg_num != 0}> <ul> <{if $product.img_url != ""}> <li><a href="#" onMouseOver="Imgche('<{$product.img_url}>');return false;"><img src="<{$product.img_url}>" /></a></li> <{/if}> <{section name=num loop=$otherimg}> <{if $otherimg[num].url != ""}><li><a href="#" onMouseOver="Imgche('<{$otherimg[num].url}>');return false;"><img src="<{$otherimg[num].url}>" /></a></li><{/if}> <{/section}> </ul><{/if}>
商品詳細CSS
削除タグ 追加タグ
#contents div.images { margin: 0px 10px 20px 0px; float: left; text-align: center; } #contents div.images img { display: block; margin: 0px 0px 10px; margin: 0px 20px 10px 0px; border-style: none; } #contents div.images ul { list-style-type:none; list-style-image:none; margin: 0px; margin: 0px 0px 20px 0px; } #contents div.images ul li { margin: 0px 5px 0px 0px; margin: 0px 1px 20px 0px; float: left; background: url(none); padding: 0px; }
■ JapanStyle
商品詳細HTML - 画像を1枚ずつ追加する場合のタグ
削除タグ 追加タグ
<!--*****商品画像*****--> <div class="images"> <script language="javascript"> <!-- function Imgche(ado) { if(document.images)document.outside.src = ado; } //--> </script> <{if $product.img_url != ""}> <img src="<{$product.img_url}>" name="outside" /><{/if}> <{if $product.ot1_url != "" or $product.ot2_url != "" or $product.ot3_url != ""}> <{if $otherimg_num != 0}> <ul> <li><a href="#" onMouseOver="Imgche('<{$product.img_url}>');return false;"><img src="<{$product.img_url}>" /></a></li> <{if $product.ot1_url != ""}><li><a href="#" onMouseOver="Imgche('<{$product.ot1_url}>');return false;"><img src="<{$product.ot1_url}>" /></a></li><{/if}> <{if $product.ot2_url != ""}><li><a href="#" onMouseOver="Imgche('<{$product.ot2_url}>');return false;"><img src="<{$product.ot2_url}>" /></a></li><{/if}> <{if $product.ot3_url != ""}><li><a href="#" onMouseOver="Imgche('<{$product.ot3_url}>');return false;"><img src="<{$product.ot3_url}>" /></a></li><{/if}> <{if $product.ot4_url != ""}><li><a href="#" onMouseOver="Imgche('<{$product.ot4_url}>');return false;"><img src="<{$product.ot4_url}>" /></a></li><{/if}> <{if $product.ot5_url != ""}><li><a href="#" onMouseOver="Imgche('<{$product.ot5_url}>');return false;"><img src="<{$product.ot5_url}>" /></a></li><{/if}> <{if $product.ot6_url != ""}><li><a href="#" onMouseOver="Imgche('<{$product.ot6_url}>');return false;"><img src="<{$product.ot6_url}>" /></a></li><{/if}> <{if $product.ot7_url != ""}><li><a href="#" onMouseOver="Imgche('<{$product.ot7_url}>');return false;"><img src="<{$product.ot7_url}>" /></a></li><{/if}> <{if $product.ot8_url != ""}><li><a href="#" onMouseOver="Imgche('<{$product.ot8_url}>');return false;"><img src="<{$product.ot8_url}>" /></a></li><{/if}> <{if $product.ot9_url != ""}><li><a href="#" onMouseOver="Imgche('<{$product.ot9_url}>');return false;"><img src="<{$product.ot9_url}>" /></a></li><{/if}> </ul><{/if}>
商品詳細HTML - 画像をまとめて出力するタグ
削除タグ 追加タグ
<!--*****商品画像*****--> <div class="images"> <script language="javascript"> <!-- function Imgche(ado) { if(document.images)document.outside.src = ado; } //--> </script> <{if $product.img_url != ""}> <img src="<{$product.img_url}>" name="outside" /><{/if}> <ul> <li><a href="#" onMouseOver="Imgche('<{$product.img_url}>');return false;"><img src="<{$product.img_url}>" /></a></li> <{if $product.ot1_url != ""}><li><a href="#" onMouseOver="Imgche('<{$product.ot1_url}>');return false;"><img src="<{$product.ot1_url}>" /></a></li><{/if}> <{if $product.ot2_url != ""}><li><a href="#" onMouseOver="Imgche('<{$product.ot2_url}>');return false;"><img src="<{$product.ot2_url}>" /></a></li><{/if}> <{if $product.ot3_url != ""}><li><a href="#" onMouseOver="Imgche('<{$product.ot3_url}>');return false;"><img src="<{$product.ot3_url}>" /></a></li><{/if}> <{if $product.img_url != "" || $otherimg_num != 0}> <{if $product.img_url != ""}> <img src="<{$product.img_url}>" name="outside" /> <{else}> <{section name=num loop=$otherimg}> <{if $smarty.section.num.iteration == 1}> <img src="<{$otherimg[num].url}>" name="outside" /> <{/if}> <{/section}> <{/if}> <{/if}> <{if $otherimg_num != 0}> <ul> <{if $product.img_url != ""}> <li><a href="#" onMouseOver="Imgche('<{$product.img_url}>');return false;"><img src="<{$product.img_url}>" /></a></li> <{/if}> <{section name=num loop=$otherimg}> <{if $otherimg[num].url != ""}><li><a href="#" onMouseOver="Imgche('<{$otherimg[num].url}>');return false;"><img src="<{$otherimg[num].url}>" /></a></li><{/if}> <{/section}> </ul><{/if}>
商品詳細CSS
削除タグ 追加タグ
#contents div.images { margin: 0px 10px 20px 0px; float: left; text-align: center; } #contents div.images img { display: block; margin: 0px 0px 10px; margin: 0px 20px 10px 0px; border-style: none; } #contents div.images ul { list-style-type:none; list-style-image:none; margin: 0px; margin: 0px 0px 20px 0px; } #contents div.images ul li { margin: 0px 5px 0px 0px; margin: 0px 1px 20px 0px; float: left; background: url(none); padding: 0px; }
■ fluffy
商品詳細HTML - 画像を1枚ずつ追加する場合のタグ
削除タグ 追加タグ
<!--*****商品画像*****--> <div class="images"> <script language="javascript"> <!-- function Imgche(ado) { if(document.images)document.outside.src = ado; } //--> </script> <{if $product.img_url != ""}> <img src="<{$product.img_url}>" name="outside" /><{/if}> <{if $product.ot1_url != "" or $product.ot2_url != "" or $product.ot3_url != ""}> <{if $otherimg_num != 0}> <ul> <li><a href="#" onMouseOver="Imgche('<{$product.img_url}>');return false;"><img src="<{$product.img_url}>" /></a></li> <{if $product.ot1_url != ""}><li><a href="#" onMouseOver="Imgche('<{$product.ot1_url}>');return false;"><img src="<{$product.ot1_url}>" /></a></li><{/if}> <{if $product.ot2_url != ""}><li><a href="#" onMouseOver="Imgche('<{$product.ot2_url}>');return false;"><img src="<{$product.ot2_url}>" /></a></li><{/if}> <{if $product.ot3_url != ""}><li><a href="#" onMouseOver="Imgche('<{$product.ot3_url}>');return false;"><img src="<{$product.ot3_url}>" /></a></li><{/if}> <{if $product.ot4_url != ""}><li><a href="#" onMouseOver="Imgche('<{$product.ot4_url}>');return false;"><img src="<{$product.ot4_url}>" /></a></li><{/if}> <{if $product.ot5_url != ""}><li><a href="#" onMouseOver="Imgche('<{$product.ot5_url}>');return false;"><img src="<{$product.ot5_url}>" /></a></li><{/if}> <{if $product.ot6_url != ""}><li><a href="#" onMouseOver="Imgche('<{$product.ot6_url}>');return false;"><img src="<{$product.ot6_url}>" /></a></li><{/if}> <{if $product.ot7_url != ""}><li><a href="#" onMouseOver="Imgche('<{$product.ot7_url}>');return false;"><img src="<{$product.ot7_url}>" /></a></li><{/if}> <{if $product.ot8_url != ""}><li><a href="#" onMouseOver="Imgche('<{$product.ot8_url}>');return false;"><img src="<{$product.ot8_url}>" /></a></li><{/if}> <{if $product.ot9_url != ""}><li><a href="#" onMouseOver="Imgche('<{$product.ot9_url}>');return false;"><img src="<{$product.ot9_url}>" /></a></li><{/if}> </ul><{/if}>
商品詳細HTML - 画像をまとめて出力するタグ
削除タグ 追加タグ
<!--*****商品画像*****--> <div class="images"> <script language="javascript"> <!-- function Imgche(ado) { if(document.images)document.outside.src = ado; } //--> </script> <{if $product.img_url != ""}> <img src="<{$product.img_url}>" name="outside" /><{/if}> <ul> <li><a href="#" onMouseOver="Imgche('<{$product.img_url}>');return false;"><img src="<{$product.img_url}>" /></a></li> <{if $product.ot1_url != ""}><li><a href="#" onMouseOver="Imgche('<{$product.ot1_url}>');return false;"><img src="<{$product.ot1_url}>" /></a></li><{/if}> <{if $product.ot2_url != ""}><li><a href="#" onMouseOver="Imgche('<{$product.ot2_url}>');return false;"><img src="<{$product.ot2_url}>" /></a></li><{/if}> <{if $product.ot3_url != ""}><li><a href="#" onMouseOver="Imgche('<{$product.ot3_url}>');return false;"><img src="<{$product.ot3_url}>" /></a></li><{/if}> <{if $product.img_url != "" || $otherimg_num != 0}> <{if $product.img_url != ""}> <img src="<{$product.img_url}>" name="outside" /> <{else}> <{section name=num loop=$otherimg}> <{if $smarty.section.num.iteration == 1}> <img src="<{$otherimg[num].url}>" name="outside" /> <{/if}> <{/section}> <{/if}> <{/if}> <{if $otherimg_num != 0}> <ul> <{if $product.img_url != ""}> <li><a href="#" onMouseOver="Imgche('<{$product.img_url}>');return false;"><img src="<{$product.img_url}>" /></a></li> <{/if}> <{section name=num loop=$otherimg}> <{if $otherimg[num].url != ""}><li><a href="#" onMouseOver="Imgche('<{$otherimg[num].url}>');return false;"><img src="<{$otherimg[num].url}>" /></a></li><{/if}> <{/section}> </ul><{/if}>
商品詳細CSS
削除タグ 追加タグ
#contents div.images { margin: 0px 10px 20px 0px; float: left; text-align: center; } #contents div.images img { display: block; margin: 0px 0px 10px; margin: 0px 20px 10px 0px; border-style: none; } #contents div.images ul { list-style-type:none; list-style-image:none; margin: 0px; margin: 0px 0px 20px 0px; } #contents div.images ul li { margin: 0px 5px 0px 0px; margin: 0px 1px 20px 0px; float: left; background: url(none); padding: 0px; }
■ オフィススタンダード(RED)
商品詳細HTML - 画像を1枚ずつ追加する場合のタグ
削除タグ 追加タグ
<!--*****商品画像*****--> <div class="images"> <script language="javascript"> <!-- function Imgche(ado) { if(document.images)document.outside.src = ado; } //--> </script> <{if $product.img_url != ""}> <img src="<{$product.img_url}>" name="outside" /><{/if}> <{if $product.ot1_url != "" or $product.ot2_url != "" or $product.ot3_url != ""}> <{if $otherimg_num != 0}> <ul> <li><a href="#" onMouseOver="Imgche('<{$product.img_url}>');return false;"><img src="<{$product.img_url}>" /></a></li> <{if $product.ot1_url != ""}><li><a href="#" onMouseOver="Imgche('<{$product.ot1_url}>');return false;"><img src="<{$product.ot1_url}>" /></a></li><{/if}> <{if $product.ot2_url != ""}><li><a href="#" onMouseOver="Imgche('<{$product.ot2_url}>');return false;"><img src="<{$product.ot2_url}>" /></a></li><{/if}> <{if $product.ot3_url != ""}><li><a href="#" onMouseOver="Imgche('<{$product.ot3_url}>');return false;"><img src="<{$product.ot3_url}>" /></a></li><{/if}> <{if $product.ot4_url != ""}><li><a href="#" onMouseOver="Imgche('<{$product.ot4_url}>');return false;"><img src="<{$product.ot4_url}>" /></a></li><{/if}> <{if $product.ot5_url != ""}><li><a href="#" onMouseOver="Imgche('<{$product.ot5_url}>');return false;"><img src="<{$product.ot5_url}>" /></a></li><{/if}> <{if $product.ot6_url != ""}><li><a href="#" onMouseOver="Imgche('<{$product.ot6_url}>');return false;"><img src="<{$product.ot6_url}>" /></a></li><{/if}> <{if $product.ot7_url != ""}><li><a href="#" onMouseOver="Imgche('<{$product.ot7_url}>');return false;"><img src="<{$product.ot7_url}>" /></a></li><{/if}> <{if $product.ot8_url != ""}><li><a href="#" onMouseOver="Imgche('<{$product.ot8_url}>');return false;"><img src="<{$product.ot8_url}>" /></a></li><{/if}> <{if $product.ot9_url != ""}><li><a href="#" onMouseOver="Imgche('<{$product.ot9_url}>');return false;"><img src="<{$product.ot9_url}>" /></a></li><{/if}> </ul><{/if}>
商品詳細HTML - 画像をまとめて出力するタグ
削除タグ 追加タグ
<!--*****商品画像*****--> <div class="images"> <script language="javascript"> <!-- function Imgche(ado) { if(document.images)document.outside.src = ado; } //--> </script> <{if $product.img_url != ""}> <img src="<{$product.img_url}>" name="outside" /><{/if}> <ul> <li><a href="#" onMouseOver="Imgche('<{$product.img_url}>');return false;"><img src="<{$product.img_url}>" /></a></li> <{if $product.ot1_url != ""}><li><a href="#" onMouseOver="Imgche('<{$product.ot1_url}>');return false;"><img src="<{$product.ot1_url}>" /></a></li><{/if}> <{if $product.ot2_url != ""}><li><a href="#" onMouseOver="Imgche('<{$product.ot2_url}>');return false;"><img src="<{$product.ot2_url}>" /></a></li><{/if}> <{if $product.ot3_url != ""}><li><a href="#" onMouseOver="Imgche('<{$product.ot3_url}>');return false;"><img src="<{$product.ot3_url}>" /></a></li><{/if}> <{if $product.img_url != "" || $otherimg_num != 0}> <{if $product.img_url != ""}> <img src="<{$product.img_url}>" name="outside" /> <{else}> <{section name=num loop=$otherimg}> <{if $smarty.section.num.iteration == 1}> <img src="<{$otherimg[num].url}>" name="outside" /> <{/if}> <{/section}> <{/if}> <{/if}> <{if $otherimg_num != 0}> <ul> <{if $product.img_url != ""}> <li><a href="#" onMouseOver="Imgche('<{$product.img_url}>');return false;"><img src="<{$product.img_url}>" /></a></li> <{/if}> <{section name=num loop=$otherimg}> <{if $otherimg[num].url != ""}><li><a href="#" onMouseOver="Imgche('<{$otherimg[num].url}>');return false;"><img src="<{$otherimg[num].url}>" /></a></li><{/if}> <{/section}> </ul><{/if}>
商品詳細CSS
削除タグ 追加タグ
#contents div.images { margin: 0px 10px 20px 0px; float: left; text-align: center; } #contents div.images img { display: block; margin: 0px 0px 10px; margin: 0px 20px 10px 0px; border-style: none; } #contents div.images ul { list-style-type:none; list-style-image:none; margin: 0px; margin: 0px 0px 20px 0px; } #contents div.images ul li { margin: 0px 5px 0px 0px; margin: 0px 1px 20px 0px; float: left; background: url(none); padding: 0px; }
■ オフィススタンダード(BLACK)
商品詳細HTML - 画像を1枚ずつ追加する場合のタグ
削除タグ 追加タグ
<!--*****商品画像*****--> <div class="images"> <script language="javascript"> <!-- function Imgche(ado) { if(document.images)document.outside.src = ado; } //--> </script> <{if $product.img_url != ""}> <img src="<{$product.img_url}>" name="outside" /><{/if}> <{if $product.ot1_url != "" or $product.ot2_url != "" or $product.ot3_url != ""}> <{if $otherimg_num != 0}> <ul> <li><a href="#" onMouseOver="Imgche('<{$product.img_url}>');return false;"><img src="<{$product.img_url}>" /></a></li> <{if $product.ot1_url != ""}><li><a href="#" onMouseOver="Imgche('<{$product.ot1_url}>');return false;"><img src="<{$product.ot1_url}>" /></a></li><{/if}> <{if $product.ot2_url != ""}><li><a href="#" onMouseOver="Imgche('<{$product.ot2_url}>');return false;"><img src="<{$product.ot2_url}>" /></a></li><{/if}> <{if $product.ot3_url != ""}><li><a href="#" onMouseOver="Imgche('<{$product.ot3_url}>');return false;"><img src="<{$product.ot3_url}>" /></a></li><{/if}> <{if $product.ot4_url != ""}><li><a href="#" onMouseOver="Imgche('<{$product.ot4_url}>');return false;"><img src="<{$product.ot4_url}>" /></a></li><{/if}> <{if $product.ot5_url != ""}><li><a href="#" onMouseOver="Imgche('<{$product.ot5_url}>');return false;"><img src="<{$product.ot5_url}>" /></a></li><{/if}> <{if $product.ot6_url != ""}><li><a href="#" onMouseOver="Imgche('<{$product.ot6_url}>');return false;"><img src="<{$product.ot6_url}>" /></a></li><{/if}> <{if $product.ot7_url != ""}><li><a href="#" onMouseOver="Imgche('<{$product.ot7_url}>');return false;"><img src="<{$product.ot7_url}>" /></a></li><{/if}> <{if $product.ot8_url != ""}><li><a href="#" onMouseOver="Imgche('<{$product.ot8_url}>');return false;"><img src="<{$product.ot8_url}>" /></a></li><{/if}> <{if $product.ot9_url != ""}><li><a href="#" onMouseOver="Imgche('<{$product.ot9_url}>');return false;"><img src="<{$product.ot9_url}>" /></a></li><{/if}> </ul><{/if}>
商品詳細HTML - 画像をまとめて出力するタグ
削除タグ 追加タグ
<!--*****商品画像*****--> <div class="images"> <script language="javascript"> <!-- function Imgche(ado) { if(document.images)document.outside.src = ado; } //--> </script> <{if $product.img_url != ""}> <img src="<{$product.img_url}>" name="outside" /><{/if}> <ul> <li><a href="#" onMouseOver="Imgche('<{$product.img_url}>');return false;"><img src="<{$product.img_url}>" /></a></li> <{if $product.ot1_url != ""}><li><a href="#" onMouseOver="Imgche('<{$product.ot1_url}>');return false;"><img src="<{$product.ot1_url}>" /></a></li><{/if}> <{if $product.ot2_url != ""}><li><a href="#" onMouseOver="Imgche('<{$product.ot2_url}>');return false;"><img src="<{$product.ot2_url}>" /></a></li><{/if}> <{if $product.ot3_url != ""}><li><a href="#" onMouseOver="Imgche('<{$product.ot3_url}>');return false;"><img src="<{$product.ot3_url}>" /></a></li><{/if}> <{if $product.img_url != "" || $otherimg_num != 0}> <{if $product.img_url != ""}> <img src="<{$product.img_url}>" name="outside" /> <{else}> <{section name=num loop=$otherimg}> <{if $smarty.section.num.iteration == 1}> <img src="<{$otherimg[num].url}>" name="outside" /> <{/if}> <{/section}> <{/if}> <{/if}> <{if $otherimg_num != 0}> <ul> <{if $product.img_url != ""}> <li><a href="#" onMouseOver="Imgche('<{$product.img_url}>');return false;"><img src="<{$product.img_url}>" /></a></li> <{/if}> <{section name=num loop=$otherimg}> <{if $otherimg[num].url != ""}><li><a href="#" onMouseOver="Imgche('<{$otherimg[num].url}>');return false;"><img src="<{$otherimg[num].url}>" /></a></li><{/if}> <{/section}> </ul><{/if}>
商品詳細CSS
削除タグ 追加タグ
#contents div.images { margin: 0px 10px 20px 0px; float: left; text-align: center; } #contents div.images img { display: block; margin: 0px 0px 10px; margin: 0px 20px 10px 0px; border-style: none; } #contents div.images ul { list-style-type:none; list-style-image:none; margin: 0px; margin: 0px 0px 20px 0px; } #contents div.images ul li { margin: 0px 5px 0px 0px; margin: 0px 1px 20px 0px; float: left; background: url(none); padding: 0px; }
■ オフィススタンダード(BLUE)
商品詳細HTML - 画像を1枚ずつ追加する場合のタグ
削除タグ 追加タグ
<!--*****商品画像*****--> <div class="images"> <script language="javascript"> <!-- function Imgche(ado) { if(document.images)document.outside.src = ado; } //--> </script> <{if $product.img_url != ""}> <img src="<{$product.img_url}>" name="outside" /><{/if}> <{if $product.ot1_url != "" or $product.ot2_url != "" or $product.ot3_url != ""}> <{if $otherimg_num != 0}> <ul> <li><a href="#" onMouseOver="Imgche('<{$product.img_url}>');return false;"><img src="<{$product.img_url}>" /></a></li> <{if $product.ot1_url != ""}><li><a href="#" onMouseOver="Imgche('<{$product.ot1_url}>');return false;"><img src="<{$product.ot1_url}>" /></a></li><{/if}> <{if $product.ot2_url != ""}><li><a href="#" onMouseOver="Imgche('<{$product.ot2_url}>');return false;"><img src="<{$product.ot2_url}>" /></a></li><{/if}> <{if $product.ot3_url != ""}><li><a href="#" onMouseOver="Imgche('<{$product.ot3_url}>');return false;"><img src="<{$product.ot3_url}>" /></a></li><{/if}> <{if $product.ot4_url != ""}><li><a href="#" onMouseOver="Imgche('<{$product.ot4_url}>');return false;"><img src="<{$product.ot4_url}>" /></a></li><{/if}> <{if $product.ot5_url != ""}><li><a href="#" onMouseOver="Imgche('<{$product.ot5_url}>');return false;"><img src="<{$product.ot5_url}>" /></a></li><{/if}> <{if $product.ot6_url != ""}><li><a href="#" onMouseOver="Imgche('<{$product.ot6_url}>');return false;"><img src="<{$product.ot6_url}>" /></a></li><{/if}> <{if $product.ot7_url != ""}><li><a href="#" onMouseOver="Imgche('<{$product.ot7_url}>');return false;"><img src="<{$product.ot7_url}>" /></a></li><{/if}> <{if $product.ot8_url != ""}><li><a href="#" onMouseOver="Imgche('<{$product.ot8_url}>');return false;"><img src="<{$product.ot8_url}>" /></a></li><{/if}> <{if $product.ot9_url != ""}><li><a href="#" onMouseOver="Imgche('<{$product.ot9_url}>');return false;"><img src="<{$product.ot9_url}>" /></a></li><{/if}> </ul><{/if}>
商品詳細HTML - 画像をまとめて出力するタグ
削除タグ 追加タグ
<!--*****商品画像*****--> <div class="images"> <script language="javascript"> <!-- function Imgche(ado) { if(document.images)document.outside.src = ado; } //--> </script> <{if $product.img_url != ""}> <img src="<{$product.img_url}>" name="outside" /><{/if}> <ul> <li><a href="#" onMouseOver="Imgche('<{$product.img_url}>');return false;"><img src="<{$product.img_url}>" /></a></li> <{if $product.ot1_url != ""}><li><a href="#" onMouseOver="Imgche('<{$product.ot1_url}>');return false;"><img src="<{$product.ot1_url}>" /></a></li><{/if}> <{if $product.ot2_url != ""}><li><a href="#" onMouseOver="Imgche('<{$product.ot2_url}>');return false;"><img src="<{$product.ot2_url}>" /></a></li><{/if}> <{if $product.ot3_url != ""}><li><a href="#" onMouseOver="Imgche('<{$product.ot3_url}>');return false;"><img src="<{$product.ot3_url}>" /></a></li><{/if}> <{if $product.img_url != "" || $otherimg_num != 0}> <{if $product.img_url != ""}> <img src="<{$product.img_url}>" name="outside" /> <{else}> <{section name=num loop=$otherimg}> <{if $smarty.section.num.iteration == 1}> <img src="<{$otherimg[num].url}>" name="outside" /> <{/if}> <{/section}> <{/if}> <{/if}> <{if $otherimg_num != 0}> <ul> <{if $product.img_url != ""}> <li><a href="#" onMouseOver="Imgche('<{$product.img_url}>');return false;"><img src="<{$product.img_url}>" /></a></li> <{/if}> <{section name=num loop=$otherimg}> <{if $otherimg[num].url != ""}><li><a href="#" onMouseOver="Imgche('<{$otherimg[num].url}>');return false;"><img src="<{$otherimg[num].url}>" /></a></li><{/if}> <{/section}> </ul><{/if}>
商品詳細CSS
削除タグ 追加タグ
#contents div.images { margin: 0px 10px 20px 0px; float: left; text-align: center; } #contents div.images img { display: block; margin: 0px 0px 10px; margin: 0px 20px 10px 0px; border-style: none; } #contents div.images ul { list-style-type:none; list-style-image:none; margin: 0px; margin: 0px 0px 20px 0px; } #contents div.images ul li { margin: 0px 5px 0px 0px; margin: 0px 1px 20px 0px; float: left; background: url(none); padding: 0px; }
■ ComfortableTime
商品詳細HTML - 画像を1枚ずつ追加する場合のタグ
削除タグ 追加タグ
<!--*****商品画像*****--> <div class="images"> <script language="javascript"> <!-- function Imgche(ado) { if(document.images)document.outside.src = ado; } //--> </script> <{if $product.img_url != ""}> <img src="<{$product.img_url}>" name="outside" /><{/if}> <{if $product.ot1_url != "" or $product.ot2_url != "" or $product.ot3_url != ""}> <{if $otherimg_num != 0}> <ul> <li><a href="#" onMouseOver="Imgche('<{$product.img_url}>');return false;"><img src="<{$product.img_url}>" /></a></li> <{if $product.ot1_url != ""}><li><a href="#" onMouseOver="Imgche('<{$product.ot1_url}>');return false;"><img src="<{$product.ot1_url}>" /></a></li><{/if}> <{if $product.ot2_url != ""}><li><a href="#" onMouseOver="Imgche('<{$product.ot2_url}>');return false;"><img src="<{$product.ot2_url}>" /></a></li><{/if}> <{if $product.ot3_url != ""}><li><a href="#" onMouseOver="Imgche('<{$product.ot3_url}>');return false;"><img src="<{$product.ot3_url}>" /></a></li><{/if}> <{if $product.ot4_url != ""}><li><a href="#" onMouseOver="Imgche('<{$product.ot4_url}>');return false;"><img src="<{$product.ot4_url}>" /></a></li><{/if}> <{if $product.ot5_url != ""}><li><a href="#" onMouseOver="Imgche('<{$product.ot5_url}>');return false;"><img src="<{$product.ot5_url}>" /></a></li><{/if}> <{if $product.ot6_url != ""}><li><a href="#" onMouseOver="Imgche('<{$product.ot6_url}>');return false;"><img src="<{$product.ot6_url}>" /></a></li><{/if}> <{if $product.ot7_url != ""}><li><a href="#" onMouseOver="Imgche('<{$product.ot7_url}>');return false;"><img src="<{$product.ot7_url}>" /></a></li><{/if}> <{if $product.ot8_url != ""}><li><a href="#" onMouseOver="Imgche('<{$product.ot8_url}>');return false;"><img src="<{$product.ot8_url}>" /></a></li><{/if}> <{if $product.ot9_url != ""}><li><a href="#" onMouseOver="Imgche('<{$product.ot9_url}>');return false;"><img src="<{$product.ot9_url}>" /></a></li><{/if}> </ul><{/if}>
商品詳細HTML - 画像をまとめて出力するタグ
削除タグ 追加タグ
<!--*****商品画像*****--> <div class="images"> <script language="javascript"> <!-- function Imgche(ado) { if(document.images)document.outside.src = ado; } //--> </script> <{if $product.img_url != ""}> <img src="<{$product.img_url}>" name="outside" /><{/if}> <ul> <li><a href="#" onMouseOver="Imgche('<{$product.img_url}>');return false;"><img src="<{$product.img_url}>" /></a></li> <{if $product.ot1_url != ""}><li><a href="#" onMouseOver="Imgche('<{$product.ot1_url}>');return false;"><img src="<{$product.ot1_url}>" /></a></li><{/if}> <{if $product.ot2_url != ""}><li><a href="#" onMouseOver="Imgche('<{$product.ot2_url}>');return false;"><img src="<{$product.ot2_url}>" /></a></li><{/if}> <{if $product.ot3_url != ""}><li><a href="#" onMouseOver="Imgche('<{$product.ot3_url}>');return false;"><img src="<{$product.ot3_url}>" /></a></li><{/if}> <{if $product.img_url != "" || $otherimg_num != 0}> <{if $product.img_url != ""}> <img src="<{$product.img_url}>" name="outside" /> <{else}> <{section name=num loop=$otherimg}> <{if $smarty.section.num.iteration == 1}> <img src="<{$otherimg[num].url}>" name="outside" /> <{/if}> <{/section}> <{/if}> <{/if}> <{if $otherimg_num != 0}> <ul> <{if $product.img_url != ""}> <li><a href="#" onMouseOver="Imgche('<{$product.img_url}>');return false;"><img src="<{$product.img_url}>" /></a></li> <{/if}> <{section name=num loop=$otherimg}> <{if $otherimg[num].url != ""}><li><a href="#" onMouseOver="Imgche('<{$otherimg[num].url}>');return false;"><img src="<{$otherimg[num].url}>" /></a></li><{/if}> <{/section}> </ul><{/if}>
商品詳細CSS
削除タグ 追加タグ
#contents div.images { margin: 0px 10px 20px 0px; float: left; text-align: center; } #contents div.images img { display: block; margin: 0px 0px 10px; margin: 0px 20px 10px 0px; border-style: none; } #contents div.images ul { list-style-type:none; list-style-image:none; margin: 0px; margin: 0px 0px 20px 0px; } #contents div.images ul li { margin: 0px 5px 0px 0px; margin: 0px 1px 20px 0px; float: left; background: url(none); padding: 0px; }
■ JIGGY
商品詳細HTML - 画像を1枚ずつ追加する場合のタグ
削除タグ 追加タグ
<!--*****商品画像*****--> <div class="images"> <script language="javascript"> <!-- function Imgche(ado) { if(document.images)document.outside.src = ado; } //--> </script> <{if $product.img_url != ""}> <img src="<{$product.img_url}>" name="outside" /><{/if}> <{if $product.ot1_url != "" or $product.ot2_url != "" or $product.ot3_url != ""}> <{if $otherimg_num != 0}> <ul> <li><a href="#" onMouseOver="Imgche('<{$product.img_url}>');return false;"><img src="<{$product.img_url}>" /></a></li> <{if $product.ot1_url != ""}><li><a href="#" onMouseOver="Imgche('<{$product.ot1_url}>');return false;"><img src="<{$product.ot1_url}>" /></a></li><{/if}> <{if $product.ot2_url != ""}><li><a href="#" onMouseOver="Imgche('<{$product.ot2_url}>');return false;"><img src="<{$product.ot2_url}>" /></a></li><{/if}> <{if $product.ot3_url != ""}><li><a href="#" onMouseOver="Imgche('<{$product.ot3_url}>');return false;"><img src="<{$product.ot3_url}>" /></a></li><{/if}> <{if $product.ot4_url != ""}><li><a href="#" onMouseOver="Imgche('<{$product.ot4_url}>');return false;"><img src="<{$product.ot4_url}>" /></a></li><{/if}> <{if $product.ot5_url != ""}><li><a href="#" onMouseOver="Imgche('<{$product.ot5_url}>');return false;"><img src="<{$product.ot5_url}>" /></a></li><{/if}> <{if $product.ot6_url != ""}><li><a href="#" onMouseOver="Imgche('<{$product.ot6_url}>');return false;"><img src="<{$product.ot6_url}>" /></a></li><{/if}> <{if $product.ot7_url != ""}><li><a href="#" onMouseOver="Imgche('<{$product.ot7_url}>');return false;"><img src="<{$product.ot7_url}>" /></a></li><{/if}> <{if $product.ot8_url != ""}><li><a href="#" onMouseOver="Imgche('<{$product.ot8_url}>');return false;"><img src="<{$product.ot8_url}>" /></a></li><{/if}> <{if $product.ot9_url != ""}><li><a href="#" onMouseOver="Imgche('<{$product.ot9_url}>');return false;"><img src="<{$product.ot9_url}>" /></a></li><{/if}> </ul><{/if}>
商品詳細HTML - 画像をまとめて出力するタグ
削除タグ 追加タグ
<!--*****商品画像*****--> <div class="images"> <script language="javascript"> <!-- function Imgche(ado) { if(document.images)document.outside.src = ado; } //--> </script> <{if $product.img_url != ""}> <img src="<{$product.img_url}>" name="outside" /><{/if}> <ul> <li><a href="#" onMouseOver="Imgche('<{$product.img_url}>');return false;"><img src="<{$product.img_url}>" /></a></li> <{if $product.ot1_url != ""}><li><a href="#" onMouseOver="Imgche('<{$product.ot1_url}>');return false;"><img src="<{$product.ot1_url}>" /></a></li><{/if}> <{if $product.ot2_url != ""}><li><a href="#" onMouseOver="Imgche('<{$product.ot2_url}>');return false;"><img src="<{$product.ot2_url}>" /></a></li><{/if}> <{if $product.ot3_url != ""}><li><a href="#" onMouseOver="Imgche('<{$product.ot3_url}>');return false;"><img src="<{$product.ot3_url}>" /></a></li><{/if}> <{if $product.img_url != "" || $otherimg_num != 0}> <{if $product.img_url != ""}> <img src="<{$product.img_url}>" name="outside" /> <{else}> <{section name=num loop=$otherimg}> <{if $smarty.section.num.iteration == 1}> <img src="<{$otherimg[num].url}>" name="outside" /> <{/if}> <{/section}> <{/if}> <{/if}> <{if $otherimg_num != 0}> <ul> <{if $product.img_url != ""}> <li><a href="#" onMouseOver="Imgche('<{$product.img_url}>');return false;"><img src="<{$product.img_url}>" /></a></li> <{/if}> <{section name=num loop=$otherimg}> <{if $otherimg[num].url != ""}><li><a href="#" onMouseOver="Imgche('<{$otherimg[num].url}>');return false;"><img src="<{$otherimg[num].url}>" /></a></li><{/if}> <{/section}> </ul><{/if}>
商品詳細CSS
削除タグ 追加タグ
#contents div.images { margin: 0px 10px 20px 0px; float: left; text-align: center; } #contents div.images img { display: block; margin: 0px 0px 10px; margin: 0px 20px 10px 0px; border-style: none; } #contents div.images ul { list-style-type:none; list-style-image:none; margin: 0px; margin: 0px 0px 20px 0px; } #contents div.images ul li { margin: 0px 5px 0px 0px; margin: 0px 1px 20px 0px; float: left; background: url(none); padding: 0px; }
■ ハリウッドヒルズ
商品詳細HTML - 画像を1枚ずつ追加する場合のタグ
削除タグ 追加タグ
<!--*****商品画像*****--> <div class="images"> <script language="javascript"> <!-- function Imgche(ado) { if(document.images)document.outside.src = ado; } //--> </script> <{if $product.img_url != ""}> <img src="<{$product.img_url}>" name="outside" /><{/if}> <{if $product.ot1_url != "" or $product.ot2_url != "" or $product.ot3_url != ""}> <{if $otherimg_num != 0}> <ul> <li><a href="#" onMouseOver="Imgche('<{$product.img_url}>');return false;"><img src="<{$product.img_url}>" /></a></li> <{if $product.ot1_url != ""}><li><a href="#" onMouseOver="Imgche('<{$product.ot1_url}>');return false;"><img src="<{$product.ot1_url}>" /></a></li><{/if}> <{if $product.ot2_url != ""}><li><a href="#" onMouseOver="Imgche('<{$product.ot2_url}>');return false;"><img src="<{$product.ot2_url}>" /></a></li><{/if}> <{if $product.ot3_url != ""}><li><a href="#" onMouseOver="Imgche('<{$product.ot3_url}>');return false;"><img src="<{$product.ot3_url}>" /></a></li><{/if}> <{if $product.ot4_url != ""}><li><a href="#" onMouseOver="Imgche('<{$product.ot4_url}>');return false;"><img src="<{$product.ot4_url}>" /></a></li><{/if}> <{if $product.ot5_url != ""}><li><a href="#" onMouseOver="Imgche('<{$product.ot5_url}>');return false;"><img src="<{$product.ot5_url}>" /></a></li><{/if}> <{if $product.ot6_url != ""}><li><a href="#" onMouseOver="Imgche('<{$product.ot6_url}>');return false;"><img src="<{$product.ot6_url}>" /></a></li><{/if}> <{if $product.ot7_url != ""}><li><a href="#" onMouseOver="Imgche('<{$product.ot7_url}>');return false;"><img src="<{$product.ot7_url}>" /></a></li><{/if}> <{if $product.ot8_url != ""}><li><a href="#" onMouseOver="Imgche('<{$product.ot8_url}>');return false;"><img src="<{$product.ot8_url}>" /></a></li><{/if}> <{if $product.ot9_url != ""}><li><a href="#" onMouseOver="Imgche('<{$product.ot9_url}>');return false;"><img src="<{$product.ot9_url}>" /></a></li><{/if}> </ul><{/if}>
商品詳細HTML - 画像をまとめて出力するタグ
削除タグ 追加タグ
<!--*****商品画像*****--> <div class="images"> <script language="javascript"> <!-- function Imgche(ado) { if(document.images)document.outside.src = ado; } //--> </script> <{if $product.img_url != ""}> <img src="<{$product.img_url}>" name="outside" /><{/if}> <ul> <li><a href="#" onMouseOver="Imgche('<{$product.img_url}>');return false;"><img src="<{$product.img_url}>" /></a></li> <{if $product.ot1_url != ""}><li><a href="#" onMouseOver="Imgche('<{$product.ot1_url}>');return false;"><img src="<{$product.ot1_url}>" /></a></li><{/if}> <{if $product.ot2_url != ""}><li><a href="#" onMouseOver="Imgche('<{$product.ot2_url}>');return false;"><img src="<{$product.ot2_url}>" /></a></li><{/if}> <{if $product.ot3_url != ""}><li><a href="#" onMouseOver="Imgche('<{$product.ot3_url}>');return false;"><img src="<{$product.ot3_url}>" /></a></li><{/if}> <{if $product.img_url != "" || $otherimg_num != 0}> <{if $product.img_url != ""}> <img src="<{$product.img_url}>" name="outside" /> <{else}> <{section name=num loop=$otherimg}> <{if $smarty.section.num.iteration == 1}> <img src="<{$otherimg[num].url}>" name="outside" /> <{/if}> <{/section}> <{/if}> <{/if}> <{if $otherimg_num != 0}> <ul> <{if $product.img_url != ""}> <li><a href="#" onMouseOver="Imgche('<{$product.img_url}>');return false;"><img src="<{$product.img_url}>" /></a></li> <{/if}> <{section name=num loop=$otherimg}> <{if $otherimg[num].url != ""}><li><a href="#" onMouseOver="Imgche('<{$otherimg[num].url}>');return false;"><img src="<{$otherimg[num].url}>" /></a></li><{/if}> <{/section}> </ul><{/if}>
商品詳細CSS
削除タグ 追加タグ
#contents div.images { margin: 0px 10px 20px 0px; float: left; text-align: center; } #contents div.images img { display: block; margin: 0px 0px 10px; margin: 0px 20px 10px 0px; border-style: none; } #contents div.images ul { list-style-type:none; list-style-image:none; margin: 0px; margin: 0px 0px 20px 0px; } #contents div.images ul li { margin: 0px 5px 0px 0px; margin: 0px 1px 20px 0px; float: left; background: url(none); padding: 0px; }
■ ジュエリー&ウォッチ(グレー)
商品詳細HTML - 画像を1枚ずつ追加する場合のタグ
削除タグ 追加タグ
<!--*****商品画像*****--> <div class="images"> <script language="javascript"> <!-- function Imgche(ado) { if(document.images)document.outside.src = ado; } //--> </script> <{if $product.img_url != ""}> <img src="<{$product.img_url}>" name="outside" /><{/if}> <{if $product.ot1_url != "" or $product.ot2_url != "" or $product.ot3_url != ""}> <{if $otherimg_num != 0}> <ul> <li><a href="#" onMouseOver="Imgche('<{$product.img_url}>');return false;"><img src="<{$product.img_url}>" /></a></li> <{if $product.ot1_url != ""}><li><a href="#" onMouseOver="Imgche('<{$product.ot1_url}>');return false;"><img src="<{$product.ot1_url}>" /></a></li><{/if}> <{if $product.ot2_url != ""}><li><a href="#" onMouseOver="Imgche('<{$product.ot2_url}>');return false;"><img src="<{$product.ot2_url}>" /></a></li><{/if}> <{if $product.ot3_url != ""}><li><a href="#" onMouseOver="Imgche('<{$product.ot3_url}>');return false;"><img src="<{$product.ot3_url}>" /></a></li><{/if}> <{if $product.ot4_url != ""}><li><a href="#" onMouseOver="Imgche('<{$product.ot4_url}>');return false;"><img src="<{$product.ot4_url}>" /></a></li><{/if}> <{if $product.ot5_url != ""}><li><a href="#" onMouseOver="Imgche('<{$product.ot5_url}>');return false;"><img src="<{$product.ot5_url}>" /></a></li><{/if}> <{if $product.ot6_url != ""}><li><a href="#" onMouseOver="Imgche('<{$product.ot6_url}>');return false;"><img src="<{$product.ot6_url}>" /></a></li><{/if}> <{if $product.ot7_url != ""}><li><a href="#" onMouseOver="Imgche('<{$product.ot7_url}>');return false;"><img src="<{$product.ot7_url}>" /></a></li><{/if}> <{if $product.ot8_url != ""}><li><a href="#" onMouseOver="Imgche('<{$product.ot8_url}>');return false;"><img src="<{$product.ot8_url}>" /></a></li><{/if}> <{if $product.ot9_url != ""}><li><a href="#" onMouseOver="Imgche('<{$product.ot9_url}>');return false;"><img src="<{$product.ot9_url}>" /></a></li><{/if}> </ul><{/if}>
商品詳細HTML - 画像をまとめて出力するタグ
削除タグ 追加タグ
<!--*****商品画像*****--> <div class="images"> <script language="javascript"> <!-- function Imgche(ado) { if(document.images)document.outside.src = ado; } //--> </script> <{if $product.img_url != ""}> <img src="<{$product.img_url}>" name="outside" /><{/if}> <ul> <li><a href="#" onMouseOver="Imgche('<{$product.img_url}>');return false;"><img src="<{$product.img_url}>" /></a></li> <{if $product.ot1_url != ""}><li><a href="#" onMouseOver="Imgche('<{$product.ot1_url}>');return false;"><img src="<{$product.ot1_url}>" /></a></li><{/if}> <{if $product.ot2_url != ""}><li><a href="#" onMouseOver="Imgche('<{$product.ot2_url}>');return false;"><img src="<{$product.ot2_url}>" /></a></li><{/if}> <{if $product.ot3_url != ""}><li><a href="#" onMouseOver="Imgche('<{$product.ot3_url}>');return false;"><img src="<{$product.ot3_url}>" /></a></li><{/if}> <{if $product.img_url != "" || $otherimg_num != 0}> <{if $product.img_url != ""}> <img src="<{$product.img_url}>" name="outside" /> <{else}> <{section name=num loop=$otherimg}> <{if $smarty.section.num.iteration == 1}> <img src="<{$otherimg[num].url}>" name="outside" /> <{/if}> <{/section}> <{/if}> <{/if}> <{if $otherimg_num != 0}> <ul> <{if $product.img_url != ""}> <li><a href="#" onMouseOver="Imgche('<{$product.img_url}>');return false;"><img src="<{$product.img_url}>" /></a></li> <{/if}> <{section name=num loop=$otherimg}> <{if $otherimg[num].url != ""}><li><a href="#" onMouseOver="Imgche('<{$otherimg[num].url}>');return false;"><img src="<{$otherimg[num].url}>" /></a></li><{/if}> <{/section}> </ul><{/if}>
商品詳細CSS
削除タグ 追加タグ
#contents div.images { margin: 0px 10px 20px 0px; float: left; text-align: center; } #contents div.images img { display: block; margin: 0px 0px 10px; margin: 0px 20px 10px 0px; border-style: none; } #contents div.images ul { list-style-type:none; list-style-image:none; margin: 0px; margin: 0px 0px 20px 0px; } #contents div.images ul li { margin: 0px 5px 0px 0px; margin: 0px 1px 20px 0px; float: left; background: url(none); padding: 0px; }
■ ジュエリー&ウォッチ(ブラック)
商品詳細HTML - 画像を1枚ずつ追加する場合のタグ
削除タグ 追加タグ
<!--*****商品画像*****--> <div class="images"> <script language="javascript"> <!-- function Imgche(ado) { if(document.images)document.outside.src = ado; } //--> </script> <{if $product.img_url != ""}> <img src="<{$product.img_url}>" name="outside" /><{/if}> <{if $product.ot1_url != "" or $product.ot2_url != "" or $product.ot3_url != ""}> <{if $otherimg_num != 0}> <ul> <li><a href="#" onMouseOver="Imgche('<{$product.img_url}>');return false;"><img src="<{$product.img_url}>" /></a></li> <{if $product.ot1_url != ""}><li><a href="#" onMouseOver="Imgche('<{$product.ot1_url}>');return false;"><img src="<{$product.ot1_url}>" /></a></li><{/if}> <{if $product.ot2_url != ""}><li><a href="#" onMouseOver="Imgche('<{$product.ot2_url}>');return false;"><img src="<{$product.ot2_url}>" /></a></li><{/if}> <{if $product.ot3_url != ""}><li><a href="#" onMouseOver="Imgche('<{$product.ot3_url}>');return false;"><img src="<{$product.ot3_url}>" /></a></li><{/if}> <{if $product.ot4_url != ""}><li><a href="#" onMouseOver="Imgche('<{$product.ot4_url}>');return false;"><img src="<{$product.ot4_url}>" /></a></li><{/if}> <{if $product.ot5_url != ""}><li><a href="#" onMouseOver="Imgche('<{$product.ot5_url}>');return false;"><img src="<{$product.ot5_url}>" /></a></li><{/if}> <{if $product.ot6_url != ""}><li><a href="#" onMouseOver="Imgche('<{$product.ot6_url}>');return false;"><img src="<{$product.ot6_url}>" /></a></li><{/if}> <{if $product.ot7_url != ""}><li><a href="#" onMouseOver="Imgche('<{$product.ot7_url}>');return false;"><img src="<{$product.ot7_url}>" /></a></li><{/if}> <{if $product.ot8_url != ""}><li><a href="#" onMouseOver="Imgche('<{$product.ot8_url}>');return false;"><img src="<{$product.ot8_url}>" /></a></li><{/if}> <{if $product.ot9_url != ""}><li><a href="#" onMouseOver="Imgche('<{$product.ot9_url}>');return false;"><img src="<{$product.ot9_url}>" /></a></li><{/if}> </ul><{/if}>
商品詳細HTML - 画像をまとめて出力するタグ
削除タグ 追加タグ
<!--*****商品画像*****--> <div class="images"> <script language="javascript"> <!-- function Imgche(ado) { if(document.images)document.outside.src = ado; } //--> </script> <{if $product.img_url != ""}> <img src="<{$product.img_url}>" name="outside" /><{/if}> <ul> <li><a href="#" onMouseOver="Imgche('<{$product.img_url}>');return false;"><img src="<{$product.img_url}>" /></a></li> <{if $product.ot1_url != ""}><li><a href="#" onMouseOver="Imgche('<{$product.ot1_url}>');return false;"><img src="<{$product.ot1_url}>" /></a></li><{/if}> <{if $product.ot2_url != ""}><li><a href="#" onMouseOver="Imgche('<{$product.ot2_url}>');return false;"><img src="<{$product.ot2_url}>" /></a></li><{/if}> <{if $product.ot3_url != ""}><li><a href="#" onMouseOver="Imgche('<{$product.ot3_url}>');return false;"><img src="<{$product.ot3_url}>" /></a></li><{/if}> <{if $product.img_url != "" || $otherimg_num != 0}> <{if $product.img_url != ""}> <img src="<{$product.img_url}>" name="outside" /> <{else}> <{section name=num loop=$otherimg}> <{if $smarty.section.num.iteration == 1}> <img src="<{$otherimg[num].url}>" name="outside" /> <{/if}> <{/section}> <{/if}> <{/if}> <{if $otherimg_num != 0}> <ul> <{if $product.img_url != ""}> <li><a href="#" onMouseOver="Imgche('<{$product.img_url}>');return false;"><img src="<{$product.img_url}>" /></a></li> <{/if}> <{section name=num loop=$otherimg}> <{if $otherimg[num].url != ""}><li><a href="#" onMouseOver="Imgche('<{$otherimg[num].url}>');return false;"><img src="<{$otherimg[num].url}>" /></a></li><{/if}> <{/section}> </ul><{/if}>
商品詳細CSS
削除タグ 追加タグ
#contents div.images { margin: 0px 10px 20px 0px; float: left; text-align: center; } #contents div.images img { display: block; margin: 0px 0px 10px; margin: 0px 20px 10px 0px; border-style: none; } #contents div.images ul { list-style-type:none; list-style-image:none; margin: 0px; margin: 0px 0px 20px 0px; } #contents div.images ul li { margin: 0px 5px 0px 0px; margin: 0px 1px 20px 0px; float: left; background: url(none); padding: 0px; }
■ ファッション(ブルー)
商品詳細HTML - 画像を1枚ずつ追加する場合のタグ
削除タグ 追加タグ
<!--*****商品画像*****--> <div class="images"> <script language="javascript"> <!-- function Imgche(ado) { if(document.images)document.outside.src = ado; } //--> </script> <{if $product.img_url != ""}> <img src="<{$product.img_url}>" name="outside" /><{/if}> <{if $product.ot1_url != "" or $product.ot2_url != "" or $product.ot3_url != ""}> <{if $otherimg_num != 0}> <ul> <li><a href="#" onMouseOver="Imgche('<{$product.img_url}>');return false;"><img src="<{$product.img_url}>" /></a></li> <{if $product.ot1_url != ""}><li><a href="#" onMouseOver="Imgche('<{$product.ot1_url}>');return false;"><img src="<{$product.ot1_url}>" /></a></li><{/if}> <{if $product.ot2_url != ""}><li><a href="#" onMouseOver="Imgche('<{$product.ot2_url}>');return false;"><img src="<{$product.ot2_url}>" /></a></li><{/if}> <{if $product.ot3_url != ""}><li><a href="#" onMouseOver="Imgche('<{$product.ot3_url}>');return false;"><img src="<{$product.ot3_url}>" /></a></li><{/if}> <{if $product.ot4_url != ""}><li><a href="#" onMouseOver="Imgche('<{$product.ot4_url}>');return false;"><img src="<{$product.ot4_url}>" /></a></li><{/if}> <{if $product.ot5_url != ""}><li><a href="#" onMouseOver="Imgche('<{$product.ot5_url}>');return false;"><img src="<{$product.ot5_url}>" /></a></li><{/if}> <{if $product.ot6_url != ""}><li><a href="#" onMouseOver="Imgche('<{$product.ot6_url}>');return false;"><img src="<{$product.ot6_url}>" /></a></li><{/if}> <{if $product.ot7_url != ""}><li><a href="#" onMouseOver="Imgche('<{$product.ot7_url}>');return false;"><img src="<{$product.ot7_url}>" /></a></li><{/if}> <{if $product.ot8_url != ""}><li><a href="#" onMouseOver="Imgche('<{$product.ot8_url}>');return false;"><img src="<{$product.ot8_url}>" /></a></li><{/if}> <{if $product.ot9_url != ""}><li><a href="#" onMouseOver="Imgche('<{$product.ot9_url}>');return false;"><img src="<{$product.ot9_url}>" /></a></li><{/if}> </ul><{/if}>
商品詳細HTML - 画像をまとめて出力するタグ
削除タグ 追加タグ
<!--*****商品画像*****--> <div class="images"> <script language="javascript"> <!-- function Imgche(ado) { if(document.images)document.outside.src = ado; } //--> </script> <{if $product.img_url != ""}> <img src="<{$product.img_url}>" name="outside" /><{/if}> <ul> <li><a href="#" onMouseOver="Imgche('<{$product.img_url}>');return false;"><img src="<{$product.img_url}>" /></a></li> <{if $product.ot1_url != ""}><li><a href="#" onMouseOver="Imgche('<{$product.ot1_url}>');return false;"><img src="<{$product.ot1_url}>" /></a></li><{/if}> <{if $product.ot2_url != ""}><li><a href="#" onMouseOver="Imgche('<{$product.ot2_url}>');return false;"><img src="<{$product.ot2_url}>" /></a></li><{/if}> <{if $product.ot3_url != ""}><li><a href="#" onMouseOver="Imgche('<{$product.ot3_url}>');return false;"><img src="<{$product.ot3_url}>" /></a></li><{/if}> <{if $product.img_url != "" || $otherimg_num != 0}> <{if $product.img_url != ""}> <img src="<{$product.img_url}>" name="outside" /> <{else}> <{section name=num loop=$otherimg}> <{if $smarty.section.num.iteration == 1}> <img src="<{$otherimg[num].url}>" name="outside" /> <{/if}> <{/section}> <{/if}> <{/if}> <{if $otherimg_num != 0}> <ul> <{if $product.img_url != ""}> <li><a href="#" onMouseOver="Imgche('<{$product.img_url}>');return false;"><img src="<{$product.img_url}>" /></a></li> <{/if}> <{section name=num loop=$otherimg}> <{if $otherimg[num].url != ""}><li><a href="#" onMouseOver="Imgche('<{$otherimg[num].url}>');return false;"><img src="<{$otherimg[num].url}>" /></a></li><{/if}> <{/section}> </ul><{/if}>
商品詳細CSS
削除タグ 追加タグ
#contents div.images { margin: 0px 10px 20px 0px; float: left; text-align: center; } #contents div.images img { display: block; margin: 0px 0px 10px; margin: 0px 20px 10px 0px; border-style: none; } #contents div.images ul { list-style-type:none; list-style-image:none; margin: 0px; margin: 0px 0px 20px 0px; } #contents div.images ul li { margin: 0px 5px 0px 0px; margin: 0px 1px 20px 0px; float: left; background: url(none); padding: 0px; }
■ ファッション(ホワイト)
商品詳細HTML - 画像を1枚ずつ追加する場合のタグ
削除タグ 追加タグ
<!--*****商品画像*****--> <div class="images"> <script language="javascript"> <!-- function Imgche(ado) { if(document.images)document.outside.src = ado; } //--> </script> <{if $product.img_url != ""}> <img src="<{$product.img_url}>" name="outside" /><{/if}> <{if $product.ot1_url != "" or $product.ot2_url != "" or $product.ot3_url != ""}> <{if $otherimg_num != 0}> <ul> <li><a href="#" onMouseOver="Imgche('<{$product.img_url}>');return false;"><img src="<{$product.img_url}>" /></a></li> <{if $product.ot1_url != ""}><li><a href="#" onMouseOver="Imgche('<{$product.ot1_url}>');return false;"><img src="<{$product.ot1_url}>" /></a></li><{/if}> <{if $product.ot2_url != ""}><li><a href="#" onMouseOver="Imgche('<{$product.ot2_url}>');return false;"><img src="<{$product.ot2_url}>" /></a></li><{/if}> <{if $product.ot3_url != ""}><li><a href="#" onMouseOver="Imgche('<{$product.ot3_url}>');return false;"><img src="<{$product.ot3_url}>" /></a></li><{/if}> <{if $product.ot4_url != ""}><li><a href="#" onMouseOver="Imgche('<{$product.ot4_url}>');return false;"><img src="<{$product.ot4_url}>" /></a></li><{/if}> <{if $product.ot5_url != ""}><li><a href="#" onMouseOver="Imgche('<{$product.ot5_url}>');return false;"><img src="<{$product.ot5_url}>" /></a></li><{/if}> <{if $product.ot6_url != ""}><li><a href="#" onMouseOver="Imgche('<{$product.ot6_url}>');return false;"><img src="<{$product.ot6_url}>" /></a></li><{/if}> <{if $product.ot7_url != ""}><li><a href="#" onMouseOver="Imgche('<{$product.ot7_url}>');return false;"><img src="<{$product.ot7_url}>" /></a></li><{/if}> <{if $product.ot8_url != ""}><li><a href="#" onMouseOver="Imgche('<{$product.ot8_url}>');return false;"><img src="<{$product.ot8_url}>" /></a></li><{/if}> <{if $product.ot9_url != ""}><li><a href="#" onMouseOver="Imgche('<{$product.ot9_url}>');return false;"><img src="<{$product.ot9_url}>" /></a></li><{/if}> </ul><{/if}>
商品詳細HTML - 画像をまとめて出力するタグ
削除タグ 追加タグ
<!--*****商品画像*****--> <div class="images"> <script language="javascript"> <!-- function Imgche(ado) { if(document.images)document.outside.src = ado; } //--> </script> <{if $product.img_url != ""}> <img src="<{$product.img_url}>" name="outside" /><{/if}> <ul> <li><a href="#" onMouseOver="Imgche('<{$product.img_url}>');return false;"><img src="<{$product.img_url}>" /></a></li> <{if $product.ot1_url != ""}><li><a href="#" onMouseOver="Imgche('<{$product.ot1_url}>');return false;"><img src="<{$product.ot1_url}>" /></a></li><{/if}> <{if $product.ot2_url != ""}><li><a href="#" onMouseOver="Imgche('<{$product.ot2_url}>');return false;"><img src="<{$product.ot2_url}>" /></a></li><{/if}> <{if $product.ot3_url != ""}><li><a href="#" onMouseOver="Imgche('<{$product.ot3_url}>');return false;"><img src="<{$product.ot3_url}>" /></a></li><{/if}> <{if $product.img_url != "" || $otherimg_num != 0}> <{if $product.img_url != ""}> <img src="<{$product.img_url}>" name="outside" /> <{else}> <{section name=num loop=$otherimg}> <{if $smarty.section.num.iteration == 1}> <img src="<{$otherimg[num].url}>" name="outside" /> <{/if}> <{/section}> <{/if}> <{/if}> <{if $otherimg_num != 0}> <ul> <{if $product.img_url != ""}> <li><a href="#" onMouseOver="Imgche('<{$product.img_url}>');return false;"><img src="<{$product.img_url}>" /></a></li> <{/if}> <{section name=num loop=$otherimg}> <{if $otherimg[num].url != ""}><li><a href="#" onMouseOver="Imgche('<{$otherimg[num].url}>');return false;"><img src="<{$otherimg[num].url}>" /></a></li><{/if}> <{/section}> </ul><{/if}>
商品詳細CSS
削除タグ 追加タグ
#contents div.images { margin: 0px 10px 20px 0px; float: left; text-align: center; } #contents div.images img { display: block; margin: 0px 0px 10px; margin: 0px 20px 10px 0px; border-style: none; } #contents div.images ul { list-style-type:none; list-style-image:none; margin: 0px; margin: 0px 0px 20px 0px; } #contents div.images ul li { margin: 0px 5px 0px 0px; margin: 0px 1px 20px 0px; float: left; background: url(none); padding: 0px; }
■ ファッション(オレンジ)
商品詳細HTML - 画像を1枚ずつ追加する場合のタグ
削除タグ 追加タグ
<!--*****商品画像*****--> <div class="images"> <script language="javascript"> <!-- function Imgche(ado) { if(document.images)document.outside.src = ado; } //--> </script> <{if $product.img_url != ""}> <img src="<{$product.img_url}>" name="outside" /><{/if}> <{if $product.ot1_url != "" or $product.ot2_url != "" or $product.ot3_url != ""}> <{if $otherimg_num != 0}> <ul> <li><a href="#" onMouseOver="Imgche('<{$product.img_url}>');return false;"><img src="<{$product.img_url}>" /></a></li> <{if $product.ot1_url != ""}><li><a href="#" onMouseOver="Imgche('<{$product.ot1_url}>');return false;"><img src="<{$product.ot1_url}>" /></a></li><{/if}> <{if $product.ot2_url != ""}><li><a href="#" onMouseOver="Imgche('<{$product.ot2_url}>');return false;"><img src="<{$product.ot2_url}>" /></a></li><{/if}> <{if $product.ot3_url != ""}><li><a href="#" onMouseOver="Imgche('<{$product.ot3_url}>');return false;"><img src="<{$product.ot3_url}>" /></a></li><{/if}> <{if $product.ot4_url != ""}><li><a href="#" onMouseOver="Imgche('<{$product.ot4_url}>');return false;"><img src="<{$product.ot4_url}>" /></a></li><{/if}> <{if $product.ot5_url != ""}><li><a href="#" onMouseOver="Imgche('<{$product.ot5_url}>');return false;"><img src="<{$product.ot5_url}>" /></a></li><{/if}> <{if $product.ot6_url != ""}><li><a href="#" onMouseOver="Imgche('<{$product.ot6_url}>');return false;"><img src="<{$product.ot6_url}>" /></a></li><{/if}> <{if $product.ot7_url != ""}><li><a href="#" onMouseOver="Imgche('<{$product.ot7_url}>');return false;"><img src="<{$product.ot7_url}>" /></a></li><{/if}> <{if $product.ot8_url != ""}><li><a href="#" onMouseOver="Imgche('<{$product.ot8_url}>');return false;"><img src="<{$product.ot8_url}>" /></a></li><{/if}> <{if $product.ot9_url != ""}><li><a href="#" onMouseOver="Imgche('<{$product.ot9_url}>');return false;"><img src="<{$product.ot9_url}>" /></a></li><{/if}> </ul><{/if}>
商品詳細HTML - 画像をまとめて出力するタグ
削除タグ 追加タグ
<!--*****商品画像*****--> <div class="images"> <script language="javascript"> <!-- function Imgche(ado) { if(document.images)document.outside.src = ado; } //--> </script> <{if $product.img_url != ""}> <img src="<{$product.img_url}>" name="outside" /><{/if}> <ul> <li><a href="#" onMouseOver="Imgche('<{$product.img_url}>');return false;"><img src="<{$product.img_url}>" /></a></li> <{if $product.ot1_url != ""}><li><a href="#" onMouseOver="Imgche('<{$product.ot1_url}>');return false;"><img src="<{$product.ot1_url}>" /></a></li><{/if}> <{if $product.ot2_url != ""}><li><a href="#" onMouseOver="Imgche('<{$product.ot2_url}>');return false;"><img src="<{$product.ot2_url}>" /></a></li><{/if}> <{if $product.ot3_url != ""}><li><a href="#" onMouseOver="Imgche('<{$product.ot3_url}>');return false;"><img src="<{$product.ot3_url}>" /></a></li><{/if}> <{if $product.img_url != "" || $otherimg_num != 0}> <{if $product.img_url != ""}> <img src="<{$product.img_url}>" name="outside" /> <{else}> <{section name=num loop=$otherimg}> <{if $smarty.section.num.iteration == 1}> <img src="<{$otherimg[num].url}>" name="outside" /> <{/if}> <{/section}> <{/if}> <{/if}> <{if $otherimg_num != 0}> <ul> <{if $product.img_url != ""}> <li><a href="#" onMouseOver="Imgche('<{$product.img_url}>');return false;"><img src="<{$product.img_url}>" /></a></li> <{/if}> <{section name=num loop=$otherimg}> <{if $otherimg[num].url != ""}><li><a href="#" onMouseOver="Imgche('<{$otherimg[num].url}>');return false;"><img src="<{$otherimg[num].url}>" /></a></li><{/if}> <{/section}> </ul><{/if}>
商品詳細CSS
削除タグ 追加タグ
#contents div.images { margin: 0px 10px 20px 0px; float: left; text-align: center; } #contents div.images img { display: block; margin: 0px 0px 10px; margin: 0px 20px 10px 0px; border-style: none; } #contents div.images ul { list-style-type:none; list-style-image:none; margin: 0px; margin: 0px 0px 20px 0px; } #contents div.images ul li { margin: 0px 5px 0px 0px; margin: 0px 1px 20px 0px; float: left; background: url(none); padding: 0px; }
■ ファッション(ピンク)
商品詳細HTML - 画像を1枚ずつ追加する場合のタグ
削除タグ 追加タグ
<!--*****商品画像*****--> <div class="images"> <script language="javascript"> <!-- function Imgche(ado) { if(document.images)document.outside.src = ado; } //--> </script> <{if $product.img_url != ""}> <img src="<{$product.img_url}>" name="outside" /><{/if}> <{if $product.ot1_url != "" or $product.ot2_url != "" or $product.ot3_url != ""}> <{if $otherimg_num != 0}> <ul> <li><a href="#" onMouseOver="Imgche('<{$product.img_url}>');return false;"><img src="<{$product.img_url}>" /></a></li> <{if $product.ot1_url != ""}><li><a href="#" onMouseOver="Imgche('<{$product.ot1_url}>');return false;"><img src="<{$product.ot1_url}>" /></a></li><{/if}> <{if $product.ot2_url != ""}><li><a href="#" onMouseOver="Imgche('<{$product.ot2_url}>');return false;"><img src="<{$product.ot2_url}>" /></a></li><{/if}> <{if $product.ot3_url != ""}><li><a href="#" onMouseOver="Imgche('<{$product.ot3_url}>');return false;"><img src="<{$product.ot3_url}>" /></a></li><{/if}> <{if $product.ot4_url != ""}><li><a href="#" onMouseOver="Imgche('<{$product.ot4_url}>');return false;"><img src="<{$product.ot4_url}>" /></a></li><{/if}> <{if $product.ot5_url != ""}><li><a href="#" onMouseOver="Imgche('<{$product.ot5_url}>');return false;"><img src="<{$product.ot5_url}>" /></a></li><{/if}> <{if $product.ot6_url != ""}><li><a href="#" onMouseOver="Imgche('<{$product.ot6_url}>');return false;"><img src="<{$product.ot6_url}>" /></a></li><{/if}> <{if $product.ot7_url != ""}><li><a href="#" onMouseOver="Imgche('<{$product.ot7_url}>');return false;"><img src="<{$product.ot7_url}>" /></a></li><{/if}> <{if $product.ot8_url != ""}><li><a href="#" onMouseOver="Imgche('<{$product.ot8_url}>');return false;"><img src="<{$product.ot8_url}>" /></a></li><{/if}> <{if $product.ot9_url != ""}><li><a href="#" onMouseOver="Imgche('<{$product.ot9_url}>');return false;"><img src="<{$product.ot9_url}>" /></a></li><{/if}> </ul><{/if}>
商品詳細HTML - 画像をまとめて出力するタグ
削除タグ 追加タグ
<!--*****商品画像*****--> <div class="images"> <script language="javascript"> <!-- function Imgche(ado) { if(document.images)document.outside.src = ado; } //--> </script> <{if $product.img_url != ""}> <img src="<{$product.img_url}>" name="outside" /><{/if}> <ul> <li><a href="#" onMouseOver="Imgche('<{$product.img_url}>');return false;"><img src="<{$product.img_url}>" /></a></li> <{if $product.ot1_url != ""}><li><a href="#" onMouseOver="Imgche('<{$product.ot1_url}>');return false;"><img src="<{$product.ot1_url}>" /></a></li><{/if}> <{if $product.ot2_url != ""}><li><a href="#" onMouseOver="Imgche('<{$product.ot2_url}>');return false;"><img src="<{$product.ot2_url}>" /></a></li><{/if}> <{if $product.ot3_url != ""}><li><a href="#" onMouseOver="Imgche('<{$product.ot3_url}>');return false;"><img src="<{$product.ot3_url}>" /></a></li><{/if}> <{if $product.img_url != "" || $otherimg_num != 0}> <{if $product.img_url != ""}> <img src="<{$product.img_url}>" name="outside" /> <{else}> <{section name=num loop=$otherimg}> <{if $smarty.section.num.iteration == 1}> <img src="<{$otherimg[num].url}>" name="outside" /> <{/if}> <{/section}> <{/if}> <{/if}> <{if $otherimg_num != 0}> <ul> <{if $product.img_url != ""}> <li><a href="#" onMouseOver="Imgche('<{$product.img_url}>');return false;"><img src="<{$product.img_url}>" /></a></li> <{/if}> <{section name=num loop=$otherimg}> <{if $otherimg[num].url != ""}><li><a href="#" onMouseOver="Imgche('<{$otherimg[num].url}>');return false;"><img src="<{$otherimg[num].url}>" /></a></li><{/if}> <{/section}> </ul><{/if}>
商品詳細CSS
削除タグ 追加タグ
#contents div.images { margin: 0px 10px 20px 0px; float: left; text-align: center; } #contents div.images img { display: block; margin: 0px 0px 10px; margin: 0px 20px 10px 0px; border-style: none; } #contents div.images ul { list-style-type:none; list-style-image:none; margin: 0px; margin: 0px 0px 20px 0px; } #contents div.images ul li { margin: 0px 5px 0px 0px; margin: 0px 1px 20px 0px; float: left; background: url(none); padding: 0px; }
■ カスタム(ピンク)
商品詳細HTML - 画像を1枚ずつ追加する場合のタグ
削除タグ 追加タグ
<!--*****商品画像*****--> <div class="images"> <script language="javascript"> <!-- function Imgche(ado) { if(document.images)document.outside.src = ado; } //--> </script> <{if $product.img_url != ""}> <img src="<{$product.img_url}>" name="outside" /><{/if}> <{if $product.ot1_url != "" or $product.ot2_url != "" or $product.ot3_url != ""}> <{if $otherimg_num != 0}> <ul> <li><a href="#" onMouseOver="Imgche('<{$product.img_url}>');return false;"><img src="<{$product.img_url}>" /></a></li> <{if $product.ot1_url != ""}><li><a href="#" onMouseOver="Imgche('<{$product.ot1_url}>');return false;"><img src="<{$product.ot1_url}>" /></a></li><{/if}> <{if $product.ot2_url != ""}><li><a href="#" onMouseOver="Imgche('<{$product.ot2_url}>');return false;"><img src="<{$product.ot2_url}>" /></a></li><{/if}> <{if $product.ot3_url != ""}><li><a href="#" onMouseOver="Imgche('<{$product.ot3_url}>');return false;"><img src="<{$product.ot3_url}>" /></a></li><{/if}> <{if $product.ot4_url != ""}><li><a href="#" onMouseOver="Imgche('<{$product.ot4_url}>');return false;"><img src="<{$product.ot4_url}>" /></a></li><{/if}> <{if $product.ot5_url != ""}><li><a href="#" onMouseOver="Imgche('<{$product.ot5_url}>');return false;"><img src="<{$product.ot5_url}>" /></a></li><{/if}> <{if $product.ot6_url != ""}><li><a href="#" onMouseOver="Imgche('<{$product.ot6_url}>');return false;"><img src="<{$product.ot6_url}>" /></a></li><{/if}> <{if $product.ot7_url != ""}><li><a href="#" onMouseOver="Imgche('<{$product.ot7_url}>');return false;"><img src="<{$product.ot7_url}>" /></a></li><{/if}> <{if $product.ot8_url != ""}><li><a href="#" onMouseOver="Imgche('<{$product.ot8_url}>');return false;"><img src="<{$product.ot8_url}>" /></a></li><{/if}> <{if $product.ot9_url != ""}><li><a href="#" onMouseOver="Imgche('<{$product.ot9_url}>');return false;"><img src="<{$product.ot9_url}>" /></a></li><{/if}> </ul><{/if}>
商品詳細HTML - 画像をまとめて出力するタグ
削除タグ 追加タグ
<!--*****商品画像*****--> <div class="images"> <script language="javascript"> <!-- function Imgche(ado) { if(document.images)document.outside.src = ado; } //--> </script> <{if $product.img_url != ""}> <img src="<{$product.img_url}>" name="outside" /><{/if}> <ul> <li><a href="#" onMouseOver="Imgche('<{$product.img_url}>');return false;"><img src="<{$product.img_url}>" /></a></li> <{if $product.ot1_url != ""}><li><a href="#" onMouseOver="Imgche('<{$product.ot1_url}>');return false;"><img src="<{$product.ot1_url}>" /></a></li><{/if}> <{if $product.ot2_url != ""}><li><a href="#" onMouseOver="Imgche('<{$product.ot2_url}>');return false;"><img src="<{$product.ot2_url}>" /></a></li><{/if}> <{if $product.ot3_url != ""}><li><a href="#" onMouseOver="Imgche('<{$product.ot3_url}>');return false;"><img src="<{$product.ot3_url}>" /></a></li><{/if}> <{if $product.img_url != "" || $otherimg_num != 0}> <{if $product.img_url != ""}> <img src="<{$product.img_url}>" name="outside" /> <{else}> <{section name=num loop=$otherimg}> <{if $smarty.section.num.iteration == 1}> <img src="<{$otherimg[num].url}>" name="outside" /> <{/if}> <{/section}> <{/if}> <{/if}> <{if $otherimg_num != 0}> <ul> <{if $product.img_url != ""}> <li><a href="#" onMouseOver="Imgche('<{$product.img_url}>');return false;"><img src="<{$product.img_url}>" /></a></li> <{/if}> <{section name=num loop=$otherimg}> <{if $otherimg[num].url != ""}><li><a href="#" onMouseOver="Imgche('<{$otherimg[num].url}>');return false;"><img src="<{$otherimg[num].url}>" /></a></li><{/if}> <{/section}> </ul><{/if}>
商品詳細CSS
削除タグ 追加タグ
#contents div.images { margin: 0px 10px 20px 0px; float: left; text-align: center; } #contents div.images img { display: block; margin: 0px 0px 10px; margin: 0px 20px 10px 0px; border-style: none; } #contents div.images ul { list-style-type:none; list-style-image:none; margin: 0px; margin: 0px 0px 20px 0px; } #contents div.images ul li { margin: 0px 5px 0px 0px; margin: 0px 1px 20px 0px; float: left; background: url(none); padding: 0px; }
■ カスタム(オレンジ)
商品詳細HTML - 画像を1枚ずつ追加する場合のタグ
削除タグ 追加タグ
<!--*****商品画像*****--> <div class="images"> <script language="javascript"> <!-- function Imgche(ado) { if(document.images)document.outside.src = ado; } //--> </script> <{if $product.img_url != ""}> <img src="<{$product.img_url}>" name="outside" /><{/if}> <{if $product.ot1_url != "" or $product.ot2_url != "" or $product.ot3_url != ""}> <{if $otherimg_num != 0}> <ul> <li><a href="#" onMouseOver="Imgche('<{$product.img_url}>');return false;"><img src="<{$product.img_url}>" /></a></li> <{if $product.ot1_url != ""}><li><a href="#" onMouseOver="Imgche('<{$product.ot1_url}>');return false;"><img src="<{$product.ot1_url}>" /></a></li><{/if}> <{if $product.ot2_url != ""}><li><a href="#" onMouseOver="Imgche('<{$product.ot2_url}>');return false;"><img src="<{$product.ot2_url}>" /></a></li><{/if}> <{if $product.ot3_url != ""}><li><a href="#" onMouseOver="Imgche('<{$product.ot3_url}>');return false;"><img src="<{$product.ot3_url}>" /></a></li><{/if}> <{if $product.ot4_url != ""}><li><a href="#" onMouseOver="Imgche('<{$product.ot4_url}>');return false;"><img src="<{$product.ot4_url}>" /></a></li><{/if}> <{if $product.ot5_url != ""}><li><a href="#" onMouseOver="Imgche('<{$product.ot5_url}>');return false;"><img src="<{$product.ot5_url}>" /></a></li><{/if}> <{if $product.ot6_url != ""}><li><a href="#" onMouseOver="Imgche('<{$product.ot6_url}>');return false;"><img src="<{$product.ot6_url}>" /></a></li><{/if}> <{if $product.ot7_url != ""}><li><a href="#" onMouseOver="Imgche('<{$product.ot7_url}>');return false;"><img src="<{$product.ot7_url}>" /></a></li><{/if}> <{if $product.ot8_url != ""}><li><a href="#" onMouseOver="Imgche('<{$product.ot8_url}>');return false;"><img src="<{$product.ot8_url}>" /></a></li><{/if}> <{if $product.ot9_url != ""}><li><a href="#" onMouseOver="Imgche('<{$product.ot9_url}>');return false;"><img src="<{$product.ot9_url}>" /></a></li><{/if}> </ul><{/if}>
商品詳細HTML - 画像をまとめて出力するタグ
削除タグ 追加タグ
<!--*****商品画像*****--> <div class="images"> <script language="javascript"> <!-- function Imgche(ado) { if(document.images)document.outside.src = ado; } //--> </script> <{if $product.img_url != ""}> <img src="<{$product.img_url}>" name="outside" /><{/if}> <ul> <li><a href="#" onMouseOver="Imgche('<{$product.img_url}>');return false;"><img src="<{$product.img_url}>" /></a></li> <{if $product.ot1_url != ""}><li><a href="#" onMouseOver="Imgche('<{$product.ot1_url}>');return false;"><img src="<{$product.ot1_url}>" /></a></li><{/if}> <{if $product.ot2_url != ""}><li><a href="#" onMouseOver="Imgche('<{$product.ot2_url}>');return false;"><img src="<{$product.ot2_url}>" /></a></li><{/if}> <{if $product.ot3_url != ""}><li><a href="#" onMouseOver="Imgche('<{$product.ot3_url}>');return false;"><img src="<{$product.ot3_url}>" /></a></li><{/if}> <{if $product.img_url != "" || $otherimg_num != 0}> <{if $product.img_url != ""}> <img src="<{$product.img_url}>" name="outside" /> <{else}> <{section name=num loop=$otherimg}> <{if $smarty.section.num.iteration == 1}> <img src="<{$otherimg[num].url}>" name="outside" /> <{/if}> <{/section}> <{/if}> <{/if}> <{if $otherimg_num != 0}> <ul> <{if $product.img_url != ""}> <li><a href="#" onMouseOver="Imgche('<{$product.img_url}>');return false;"><img src="<{$product.img_url}>" /></a></li> <{/if}> <{section name=num loop=$otherimg}> <{if $otherimg[num].url != ""}><li><a href="#" onMouseOver="Imgche('<{$otherimg[num].url}>');return false;"><img src="<{$otherimg[num].url}>" /></a></li><{/if}> <{/section}> </ul><{/if}>
商品詳細CSS
削除タグ 追加タグ
#contents div.images { margin: 0px 10px 20px 0px; float: left; text-align: center; } #contents div.images img { display: block; margin: 0px 0px 10px; margin: 0px 20px 10px 0px; border-style: none; } #contents div.images ul { list-style-type:none; list-style-image:none; margin: 0px; margin: 0px 0px 20px 0px; } #contents div.images ul li { margin: 0px 5px 0px 0px; margin: 0px 1px 20px 0px; float: left; background: url(none); padding: 0px; }
■ ファッションサテライト
商品詳細HTML - 画像を1枚ずつ追加する場合のタグ
削除タグ 追加タグ
<!--*****商品画像*****--> <div class="images"> <script language="javascript"> <!-- function Imgche(ado) { if(document.images)document.outside.src = ado; } //--> </script> <{if $product.img_url != ""}> <img src="<{$product.img_url}>" name="outside" /><{/if}> <{if $product.ot1_url != "" or $product.ot2_url != "" or $product.ot3_url != ""}> <{if $otherimg_num != 0}> <ul> <li><a href="#" onMouseOver="Imgche('<{$product.img_url}>');return false;"><img src="<{$product.img_url}>" /></a></li> <{if $product.ot1_url != ""}><li><a href="#" onMouseOver="Imgche('<{$product.ot1_url}>');return false;"><img src="<{$product.ot1_url}>" /></a></li><{/if}> <{if $product.ot2_url != ""}><li><a href="#" onMouseOver="Imgche('<{$product.ot2_url}>');return false;"><img src="<{$product.ot2_url}>" /></a></li><{/if}> <{if $product.ot3_url != ""}><li><a href="#" onMouseOver="Imgche('<{$product.ot3_url}>');return false;"><img src="<{$product.ot3_url}>" /></a></li><{/if}> <{if $product.ot4_url != ""}><li><a href="#" onMouseOver="Imgche('<{$product.ot4_url}>');return false;"><img src="<{$product.ot4_url}>" /></a></li><{/if}> <{if $product.ot5_url != ""}><li><a href="#" onMouseOver="Imgche('<{$product.ot5_url}>');return false;"><img src="<{$product.ot5_url}>" /></a></li><{/if}> <{if $product.ot6_url != ""}><li><a href="#" onMouseOver="Imgche('<{$product.ot6_url}>');return false;"><img src="<{$product.ot6_url}>" /></a></li><{/if}> <{if $product.ot7_url != ""}><li><a href="#" onMouseOver="Imgche('<{$product.ot7_url}>');return false;"><img src="<{$product.ot7_url}>" /></a></li><{/if}> <{if $product.ot8_url != ""}><li><a href="#" onMouseOver="Imgche('<{$product.ot8_url}>');return false;"><img src="<{$product.ot8_url}>" /></a></li><{/if}> <{if $product.ot9_url != ""}><li><a href="#" onMouseOver="Imgche('<{$product.ot9_url}>');return false;"><img src="<{$product.ot9_url}>" /></a></li><{/if}> </ul><{/if}>
商品詳細HTML - 画像をまとめて出力するタグ
削除タグ 追加タグ
<!--*****商品画像*****--> <div class="images"> <script language="javascript"> <!-- function Imgche(ado) { if(document.images)document.outside.src = ado; } //--> </script> <{if $product.img_url != ""}> <img src="<{$product.img_url}>" name="outside" /><{/if}> <ul> <li><a href="#" onMouseOver="Imgche('<{$product.img_url}>');return false;"><img src="<{$product.img_url}>" /></a></li> <{if $product.ot1_url != ""}><li><a href="#" onMouseOver="Imgche('<{$product.ot1_url}>');return false;"><img src="<{$product.ot1_url}>" /></a></li><{/if}> <{if $product.ot2_url != ""}><li><a href="#" onMouseOver="Imgche('<{$product.ot2_url}>');return false;"><img src="<{$product.ot2_url}>" /></a></li><{/if}> <{if $product.ot3_url != ""}><li><a href="#" onMouseOver="Imgche('<{$product.ot3_url}>');return false;"><img src="<{$product.ot3_url}>" /></a></li><{/if}> <{if $product.img_url != "" || $otherimg_num != 0}> <{if $product.img_url != ""}> <img src="<{$product.img_url}>" name="outside" /> <{else}> <{section name=num loop=$otherimg}> <{if $smarty.section.num.iteration == 1}> <img src="<{$otherimg[num].url}>" name="outside" /> <{/if}> <{/section}> <{/if}> <{/if}> <{if $otherimg_num != 0}> <ul> <{if $product.img_url != ""}> <li><a href="#" onMouseOver="Imgche('<{$product.img_url}>');return false;"><img src="<{$product.img_url}>" /></a></li> <{/if}> <{section name=num loop=$otherimg}> <{if $otherimg[num].url != ""}><li><a href="#" onMouseOver="Imgche('<{$otherimg[num].url}>');return false;"><img src="<{$otherimg[num].url}>" /></a></li><{/if}> <{/section}> </ul><{/if}>
商品詳細CSS
削除タグ 追加タグ
#inn-box div.images { margin: 0px 10px 20px 0px; float: left; text-align: center; } #inn-box div.images img { display: block; margin: 0px 0px 10px; margin: 0px 20px 10px 0px; border-style: none; } #inn-box div.images ul { list-style-type:none; list-style-image:none; margin: 0px; margin: 0px 0px 20px 0px; } #inn-box div.images ul li { margin: 0px 5px 0px 0px; margin: 0px 1px 20px 0px; float: left; background: url(none); padding: 0px; }
2018.02.26