フォーム:formタグの種類
formタグの種類と用途を把握し、購入・カート・問い合わせのフォームを正しく組める
最終確認: 2026-09
解説
受託の現場でなぜ必要か: この回では、{% form %}タグの種類と用途を把握し、購入・カート・問い合わせのフォームを正しく組めるようになります。
受託では、購入フォームを<form action="/cart/add">で自作すると多言語や隠しフィールドの扱いで壊れるので、必ずこのタグに任せます。
{% form 'type' %}とは
Shopifyがactionとmethod、必要な隠しフィールド、送信後の処理を生成してくれるタグです。
自前の`<form>`より安全で、テーマエディタや多言語でも壊れません。
例えば問い合わせフォームの成功メッセージも、formオブジェクトを見れば出せます。
主な種類はどれか
product(購入。productを渡す)/ cart(数量更新・メモ)/ contact(問い合わせ)/ localization(言語・国の切替)/ new_comment(記事のコメント)/ storefront_password(パスワードページ)があります。
用途ごとに種類が決まっているので、まずどれに当たるかを選びます。
送信結果はどう扱うか
エラーはform.errorsに入り、文言はform.errors.messagesで取れます。
成功したかはform.posted_successfully?で分かります。
送信後の遷移先は、return_toの隠しフィールドで指定します。
問い合わせフォームのスパム対策は、オンラインストア › 優先設定のスパム対策(hCaptcha)と組み合わせます。
テーマ側で追加の実装は要りません。
発展:customer系のフォームは使えるか
新しいテーマでは使いません。customer_login / create_customer / customer_addressなどは、従来型アカウント用のフォームです。
代わりに、ホスト型の顧客アカウントへリンクします。
※ ShopifyはShopify Inc.の商標です。本サイトは個人が制作した非公式の学習教材であり、同社の承認・提携・後援を受けていません。記載内容は2026-09時点のものです。料金・上限値・管理画面のラベルは変わるため、作業の前に公式ドキュメントで確認してください。