商品詳細ページと買い物カゴページに記述を追記することで、表示が可能です。
・商品詳細ページ
ショップデザイン / テンプレート選択・編集 / クリエイターモード / 商品詳細
(1)
HTML欄 テンプレート初期値では58行目付近
<div class="productnum-wrap clearfix">
<p class="purchase-num">数量</p>
こちらの記述の前に下記を追記してください。
追記例)
<{if $item.is_name_print}>
<div class="nameprint-area">
<{if $item.name_print.has_item}>
<p class="nameprint-description"><{$item.name_print.description}></p>
<{section name=i loop=$item.name_print.list}>
<div class="nameprint-title-wrap">
<p class="nameprint-title"><{$item.name_print.list[i].title}><{if $item.name_print.list[i].is_required}><span>※必須</span><{/if}></p>
</div>
<div class="nameprint-text-wrap">
<p class="nameprint-text"><{$item.name_print.list[i].html}></p>
<p class="nameprint-total">最大<{$item.name_print.list[i].total_max}>文字(半角)/<{$item.name_print.list[i].row_max}>行まで</p>
<p class="nameprint-character">利用可能文字:<{$item.name_print.list[i].character_type}></p>
</div>
<{/section}>
<{/if}>
</div>
<{/if}>
(2)
CSS欄に下記を追記してください。
.nameprint-area {
margin-top: 20px;
}
.nameprint-title-wrap {
margin: 18px 0 auto;
font-size: 12px;
}
.nameprint-text-wrap p {
margin-bottom: 4px;
font-size: 12px;
}
.nameprint-title {
font-size: 14px;
font-weight: bold;
margin-bottom: 5px;
}
.nameprint-title span {
color: #F23E0C;
font-size: 12px;
font-weight: normal;
margin-left: 6px;
}
.nameprint-text input,
.nameprint-text textarea {
font-family: 'Noto Sans JP', sans-serif;
width: 100%;
height: 40px;
padding: 0 5px;
border: 1px solid #000;
font-size: 24px;
color: #6E6E6E;
margin: 0;
}
@media screen and (max-width: 768px) {
.nameprint-area {
margin-bottom: 40px;
}
}
・買い物カゴページ
ショップデザイン / テンプレート選択・編集 / クリエイターモード / 買い物カゴ
(1)
HTML欄 テンプレート初期値では45行目付近
<div class="name">
<a href="<{$cart.list[i].url}>"><{$cart.list[i].name}></a>
<{if $cart.list[i].selected_option.has_item}>
<div class="cart-option-area">
<{section name=j loop=$cart.list[i].selected_option.list}>
<span><{$cart.list[i].selected_option.list[j].title}>:<{$cart.list[i].selected_option.list[j].option_name}></span>
<{/section}>
</div>
<{/if}>
</div>
こちらの記述を下記に変更してください。
変更例)
<div class="name">
<a href="<{$cart.list[i].url}>"><{$cart.list[i].name}></a>
<{if $cart.list[i].selected_option.has_item}>
<div class="cart-option-area">
<{section name=j loop=$cart.list[i].selected_option.list}>
<span><{$cart.list[i].selected_option.list[j].title}>:<{$cart.list[i].selected_option.list[j].option_name}></span>
<{/section}>
</div>
<{/if}>
<{if $cart.list[i].name_print.has_item}>
<div class="item-cart-nameprint">
<{section name=j loop=$cart.list[i].name_print.list}>
<span><{$cart.list[i].name_print.list[j].title}>:<{$cart.list[i].name_print.list[j].name|escape|nl2br}></span>
<{/section}>
</div>
<{/if}>
</div>
(2)
CSS欄に下記を追記してください。
.item-cart-nameprint{
font-size: 12px;
margin-top: 5px;
}
.item-cart-nameprint span {
display: block;
}

