【基本操作】フォーム一体型LP:「カートに入れる」ボタンの記述方法①

LPのコンテンツ内で「カートに入れる(購入)」ボタンを押した際に、入力フォームへ移動しかつ商品が選択された状態にするための記述です。

ボタンとなる要素に以下の記述を追加
class="easybuy_set" data-item_id="**" data-item_num="*"
「class=”easybuy_set”」この記述は固定です。クラス追加は可能です。
「data-item_id=”**”」対象となる商品IDです。(必須)
「data-item_num=”*”」カゴに入れる数量を指定します。(省略可能)
加えてaタグのページ内アンカーで移動先を指定します。

ボタンとなる要素がaタグで囲まれていないとき、スタイルシートに以下の記述(一例)を追加することでマウスオン時のポインタ形状を変えてクリッカブル要素であることを示すことができます。(参考イメージ
.easybuy_set:hover {cursor: pointer;}
参考LP:https://demoshop.web-store.jp/product-buy-form/btn_sample

従来の記述方法も引き続きご利用いただけます。

  1. ボタンのリンク先にフォームへのアンカーを指定
  2. ボタン画像のimgタグ内に以下の記述を追加
    class="btn_b*" reg_val="**"
    「class=”btn_b*”」定期購入商品の場合は”btn_b1″、通常商品では”btn_b2″とします。
    「reg_val=”**”」対象となる商品IDです。(必須)

参考LP:https://demoshop.web-store.jp/product-buy-form/regular_buy_sample