Embedded Files
カート画面に移動せずにカート情報を確認できるようにするサンプルスクリプトをご紹介します。
買い回りを促し、購入単価を上げるために有効です。
設置後イメージ
設置後イメージ
ページ内の任意の位置に、カート内の情報が表示されます。
本稿では、ページの一番上部に配置します。
１）カートに商品が入っていない場合の表示（トップページ）
２）カートに商品が入った場合の表示（トップページ）
３）カートに商品が入った場合の表示（商品詳細）
設置手順
設置手順
共通ヘッダのデザインテンプレートを変更する
サイトのヘッダにカート情報を追加します。
共通ヘッダのデザインテンプレートに、青字部分を追加してください。
<!-- ショップ名orロゴ -->
<div id="header_logo_area"><span class="header_logo"><{$logo}></span></div>
<!--// ショップ名orロゴ -->
<!-- カート合計をヘッダに表示 -->
<{if $head_cart_total_display_flag == "1"}>
<!-- カートの中に商品がある時 -->
<{if $head_cart_total.total_kosu > 0}>
お買い物中の
<br />
合計：<{$head_cart_total.total_kosu}>点
<br />
合計金額：<{$head_cart_total.total_price}> <{$head_cart_total.tsuka_tani}>(国内価格)
/<{$head_cart_total.total_price2}> <{$head_cart_total.tsuka_tani}>(国外価格)
<!-- カートの中に商品が無い時 -->
<{else}>
お買い物かごに商品はございません。
<{/if}>
<a href="<{$cart_acturl}>">注文・確認ページへ</a>
<{/if}>
<!--// カート合計をヘッダに表示 -- -->
<!-- 言語選択 -->
<{if count($langslct) > 0}>
<div id="header_lang_select_area">
<form action="<{$langslct_acturl}>" method="get">
<{$langslct_hidden}>
<select name="lang_id">
<{section name=key loop=$langslct}>
<option value="<{$langslct[key].id}>"<{if $langslct[key].on}> selected<{/if}>><{$langslct[key].name}></option>
<{/section}>
</select>
<input type="submit" value="GO">
</form>
</div>
<{/if}>
<!--// 言語選択 -->
商品一覧のデザインテンプレートを変更する
商品を選択し「カートに入れる」をクリックした場合に、カート画面に移動せず共通ヘッダに追加したカート情報が更新される
ようにする場合は、「トップ」のデザインテンプレートに青字部分を追加してください
※この変更は必須ではありません。
<!-- カートボタンフォーム -->
<div align="right">
<form action="<{$cart_acturl}>" method="post">
<{$goodslist[key].cart_hidden}>
<!-- カートからの戻り設定 -->
<input type="hidden" name="nomove" value="1">
<input type="hidden" name="cart_back_url" value="<{$cart_back_url}>">
<!--// カートからの戻り設定 -->
<{section name=key2 loop=$goodslist[key].opt}>
<{$goodslist[key].opt[key2].name}>
<select name="goods_opt[]">
<{html_options values=$goodslist[key].optv[key2].id output=$goodslist[key].optv[key2].name}>
</select><br>
<{/section}>
<!-- 在庫がない時はカートボタンを表示しない -->
<{if $goodslist[key].zaiko_flag && $goodslist[key].zaikosu <= 0}>
*在庫無し
<{else}>
注文数:<input type="text" name="kosu" size="4" value="<{$goodslist[key].min_kosu}>"><{$goodslist[key].tani}>
<input type="submit" value="カートに入れる">
<{/if}>
<!--// 在庫がない時はカートボタンを表示しない -->
</form>
</div>
<!--// カートボタンフォーム -->
商品詳細のデザインテンプレートを変更する
商品を選択し「カートに入れる」をクリックした場合に、カート画面に移動せず共通ヘッダに追加したカート情報が更新される
ようにする場合は、「商品詳細」のデザインテンプレートに青字部分を追加してください。
※この変更は必須ではありません。
<!-- カートボタンフォーム -->
<table class="tbl" cellspacing="1" width="100%"><tr><td class="cell_t" align="right">
<form action="<{$cart_acturl}>" method="post">
<{$goods.cart_hidden}>
<!-- カートからの戻り設定 -->
<input type="hidden" name="nomove" value="1">
<input type="hidden" name="cart_back_url" value="<{$cart_back_url}>">
<!--// カートからの戻り設定 -->
<{section name=key loop=$goods.opt}>
<{$goods.opt[key].name}>
<select name="goods_opt[]">
<{html_options values=$goods.optv[key].id output=$goods.optv[key].name}>
</select><br>
<{/section}>
<!-- 在庫がない時はカートボタンを表示しない -->
<{if $goods.zaiko_flag && $goods.zaikosu <= 0}>
*申し訳ございません。この商品は売り切れました。
<{else}>
注文数:<input type="text" name="kosu" size="4" value="<{$goods.min_kosu}>"><{$goods.tani}>
<input type="submit" value="カートに入れる">
<{/if}>
<!--// 在庫がない時はカートボタンを表示しない -->
</form>
</td></tr></table>
<!--// カートボタンフォーム -->
Page updated
Report abuse