Cafe24新着情報
[PCデザイン] 「決済手数料」への名称変更をデザインに適用する方法(日本語) - 注文書HTML
2020-06-01
平素よりCafe24をご利用いただき、誠にありがとうございます。
この度の「決済手数料」への名称変更をデザインに適用する方法をご案内します。
詳細は以下の内容をご確認ください。
■ PCデザイン - スマートデザイン編集ウィンドウ(デザイン編集)
1) 位置 : order > commission_payment_guide_popup.html (新規作成)
▼ 上記の位置に新規ファイルを追加し、以下のように青色のソースを追加します。
<!--@layout(/layout/basic/popup.html)-->
<div module="Order_deferedpaymentguide" class="ec-base-layer">
<!--@css(/css/module/order/deferedpaymentguide.css)-->
<div class="header">
<h1><span class="{$calculation_org_title_display|display}">決済可能機関 / </span>決済手数料</h1>
</div>
<div class="content">
<div class="ec-base-help">
<h2><span
class="{$calculation_org_title_display|display}">決済可能機関 /
</span>決済手数料確認時の留意事項</h2>
<div class="inner">
<ul>
<li class="{$calculation_org_title_display|display}">決済代金の請求書を受け取った後、必ず決済可能機関で決済してください。</li>
<li>決済手数料の計算基準は、{$calculation_standard_title}です。({$calculation_standard_comment})</li>
</ul>
</div>
</div>
<div class="ec-base-table">
<table border="1" summary="">
<caption>決済可能機関 / 決済手数料</caption>
<colgroup>
<col style="width:160px;" />
<col style="width:auto;" />
</colgroup>
<tbody>
<tr class="{$calculation_org_title_display|display}">
<th scope="row">決済可能機関</th>
<td>{$payment_institution}</td>
</tr>
<tr>
<th scope="row">決済手数料</th>
<td>
<div class="ec-base-table typeList">
<table border="1" summary="">
<caption>決済手数料</caption>
<colgroup>
<col style="width:58px;" />
<col style="width:auto;" />
<col style="width:230px;" />
</colgroup>
<tbody class="head">
<tr>
<td scope="col">Ｎｏ．</td>
<td scope="col">範囲</td>
<td scope="col">手数料</td>
</tr>
</tbody>
</table>
<div class="scroll">
<table border="1" summary="">
<caption>決済手数料</caption>
<colgroup>
<col style="width:58px;" />
<col style="width:auto;" />
<col style="width:213px;" />
</colgroup>
<tbody module="Order_CommissionList" class="center">
<tr>
<td>{$idx}</td>
<td>{$min_amount} 以上 ~ {$max_amount} 未満</td>
<td>{$payment_commission} {$payment_commission_ref_price}</td>
</tr>
</tbody>
</table>
</div>
</div>
</td>
</tr>
</tbody>
</table>
</div>
</div>
<div class="ec-base-button">
<a href="#none" class="btnNormalFix sizeS" onclick="window.close()">閉じる</a>
</div>
</div>
2) 位置 : order > defered_payment_guide_popup.html
▼ 以下のように赤色のソースコードを削除し、青色のソースコードを追加します。
##上略## <tr> ##下略## |
3) 位置 : order > order_result.html
▼ 以下のように赤色のソースコードを削除し、青色のソースコードを追加します。
##上略## <div class="content"> ##下略## |
4) 位置 : order > orderform.html
▼ 以下のように赤色のソースコードを削除し、青色のソースコードを追加します。
##上略## <table border="1" summary="" id="{$payment_input_defer}" class="{$payment_input_defer_display|display}"><caption>後払い手数料</caption> <caption>決済手数料</caption> <colgroup> <col style="width:139px" /> <col style="width:auto" /> </colgroup> <tbody> <tr> <th scope="row">後払い手数料</th> <th scope="row">決済手数料</th> <td><span id="{$payment_input_defer_commission_id}"></span></td> </tr> </tbody> </table> ##下略## |
▼ 以下のように赤色のソースコードを削除し、青色のソースコードを追加します。
##上略## <div id="{$pg_paymethod_info_defer_type_a}"> |
▼ 以下のように青色の部分を追加します。
##上略## <div id="{$softbank_conveniencestore_info}" class="payHelp"> ##下略##
<ul class="ec-base-help">
<li>コンビニ決済は、年齢制限がなく、クレジットカードをお持ちでない利用者さまにおすすめです。</li>
<li>全国の主要コンビニエンスストアに対応しており、ご購入者がお近くのコンビニを利用して支払いすることが可能です。</li>
<li>利用者さまの入金確認後、すぐに商品が発送されます。</li>
<li>最終決済金額は、決済手数料が含まれた金額です。</li>
<li>決済手数料をご確認のうえ、お支払い下さい。<a href="/order/commission_payment_guide_popup.html" class="btnNormal ec-order-deffered-payment-popup">確認する</a></li>
</ul>
</div>
▼ 以下のように青色の部分を追加します。
##上略## <div id="{$softbank_payeasy_info}" class="payHelp"> ##下略##
<ul class="ec-base-help">
<li>一部の金融機関を除き、全国のATMやインターネットバンキングから商品の代金をお支払いいただけます。</li>
<li>ご注文の際は、「収納機関番号」「顧客番号」「確認番号」をお確かめください。</li>
<li>ご入金確認後、直ちに商品を発送いたします。</li>
<li>最終決済金額は、決済手数料が含まれた金額です。</li>
<li>決済手数料をご確認のうえ、お支払い下さい。<a href="/order/commission_payment_guide_popup.html" class="btnNormal ec-order-deffered-payment-popup">確認する</a></li>
</ul>
</div>
▼ 以下のように青色の部分を追加します。
##上略## <div id="{$zeus_conveniencestore_info}" class="payHelp"> ##下略##
<ul class="ec-base-help">
<li>コンビニ決済は、年齢制限がなく、クレジットカードをお持ちでない利用者さまにおすすめです。</li>
<li>全国の主要コンビニエンスストアに対応しており、ご購入者がお近くのコンビニを利用して支払いすることが可能です。</li>
<li>利用者さまの入金確認後、すぐに商品が発送されます。</li>
<li>最終決済金額は、決済手数料が含まれた金額です。</li>
<li>決済手数料をご確認のうえ、お支払い下さい。<a href="/order/commission_payment_guide_popup.html" class="btnNormal ec-order-deffered-payment-popup">確認する</a></li>
</ul>
</div>
▼ 以下のように赤色のソースコードを削除し、青色のソースコードを追加します。
##上略## <ul class="ec-base-desc typeDot gLarge rightDD"> ##下略##
<li><strong class="term">商品金額</strong><span class="desc">{$price_unit_head}{$total_product_base_price}{$price_unit_tail}</span></li>
<li class="{$total_vat_price_display|display}"><strong class="term">消費税</strong><span class="desc">{$price_unit_head}{$total_vat_price}{$price_unit_tail}</span></li>
<li><strong class="term">送料</strong><span id="{$total_ship_price_id}" class="desc">{$price_unit_head}{$total_ship_price}{$price_unit_tail}</span></li>
<li><strong class="term">地域別送料</strong><span id="{$total_local_ship_price_id}" class="desc">{$price_unit_head}0{$price_unit_tail}</span></li>
<li class="{$payment_input_defer_display|display}"><strong class="term">後払い手数料</strong><span id="{$total_defer_commission_id}" class="desc">{$price_unit_head}0{$price_unit_tail}</span></li>
<li class="{$payment_input_defer_display|display}"><strong class="term">決済手数料</strong><span id="{$total_defer_commission_id}" class="desc">{$price_unit_head}0{$price_unit_tail}</span></li>
</ul>
</div>
<a href="#none" class="close" onclick="{$total_order_layer_off}"><img src="//img.echosting.cafe24.com/skin/base/common/btn_close.gif" alt="閉じる" /></a>
</div>