WooCommerceでカートに商品をいれるため方法。
フォームで入れる方法や、リンクで入れる方法がある。
フォームで入れる場合は、下記のような方法
・通常商品
・バリエーション商品
URLでカートに入れたい場合は、下記を参考に。
https://teamtreehouse.com/library/woocommerce-theme-development
色々なパターンでのリンク方法を紹介してくれています。
★★★★★★★★★★★★★★★★★フォームで入れる方法や、リンクで入れる方法がある。
フォームで入れる場合は、下記のような方法
・通常商品
<form method="post" enctype='multipart/form-data' data-product_id="ポストID" action="カートURL">
<input type="number" class="input-text qty text" step="1" min="1" max="" name="quantity" value="1" title="数" size="4" pattern="[0-9]*" inputmode="numeric" />
<button type="submit" class="single_add_to_cart_button button alt">カートに入れる</button>
<input type="hidden" name="add-to-cart" value="ポストID" />
<input type="hidden" name="product_id" value="ポストID" />
</form>
・バリエーション商品
<form method="post" enctype='multipart/form-data' data-product_id="ポストID" action="カートURL">
<label for="バリエーション名1">カラー上着</label>
<select id="バリエーション名1" class="" name="attribute_バリエーション名1" data-attribute_name="
attribute_バリエーション名1" data-show_option_none="yes"><option value="">選択してください</option>
<option value="レッド" >レッド</option><option value="イエロー" >イエロー</option>
<option value="グリーン" >グリーン</option></select>
attribute_バリエーション名1" data-show_option_none="yes"><option value="">選択してください</option>
<option value="レッド" >レッド</option><option value="イエロー" >イエロー</option>
<option value="グリーン" >グリーン</option></select>
<label for="バリエーション名2">カラーズボン</label>
<select id="バリエーション名2" class="" name="attribute_バリエーション名2 data-attribute_name="
attribute_バリエーション名2" data-show_option_none="yes"><option value="">選択してください</option>
<option value="レッド" >レッド</option><option value="イエロー" >イエロー</option>
<option value="グリーン" >グリーン</option></select>
attribute_バリエーション名2" data-show_option_none="yes"><option value="">選択してください</option>
<option value="レッド" >レッド</option><option value="イエロー" >イエロー</option>
<option value="グリーン" >グリーン</option></select>
<input type="number" class="input-text qty text" step="1" min="1" max="" name="quantity"
value="1" title="数" size="4" pattern="[0-9]*" inputmode="numeric" />
value="1" title="数" size="4" pattern="[0-9]*" inputmode="numeric" />
<button type="submit" class="single_add_to_cart_button button alt">カートに入れる</button>
<input type="hidden" name="add-to-cart" value="ポストID" />
<input type="hidden" name="product_id" value="ポストID" />
<input type="hidden" name="variation_id" class="variation_id" value="0" />
</form>
URLでカートに入れたい場合は、下記を参考に。
https://teamtreehouse.com/library/woocommerce-theme-development
色々なパターンでのリンク方法を紹介してくれています。
お仕事に関するご相談・お問い合わせは 株式会社オートプロジェクトのお問い合わせページよりお願いします。
運営サイト:
IMCショップ
オートプロジェクト
システム開発案内:
株式会社オートプロジェクト
コメント