form タグ（フォーム生成）

{
  "category": "html",
  "deprecated": false,
  "deprecation_reason": "",
  "description": "Because there are many different form types available in Shopify themes, the `form` tag requires a type. Depending on the\nform type, an additional parameter might be required. You can specify the following form types:\n\n- [`activate_customer_password`](/docs/api/liquid/tags/form#form-activate_customer_password)\n- [`cart`](/docs/api/liquid/tags/form#form-cart)\n- [`contact`](/docs/api/liquid/tags/form#form-contact)\n- [`create_customer`](/docs/api/liquid/tags/form#form-create_customer)\n- [`currency`](/docs/api/liquid/tags/form#form-currency)\n- [`customer`](/docs/api/liquid/tags/form#form-customer)\n- [`customer_address`](/docs/api/liquid/tags/form#form-customer_address)\n- [`customer_login`](/docs/api/liquid/tags/form#form-customer_login)\n- [`guest_login`](/docs/api/liquid/tags/form#form-guest_login)\n- [`localization`](/docs/api/liquid/tags/form#form-localization)\n- [`new_comment`](/docs/api/liquid/tags/form#form-new_comment)\n- [`product`](/docs/api/liquid/tags/form#form-product)\n- [`recover_customer_password`](/docs/api/liquid/tags/form#form-recover_customer_password)\n- [`reset_customer_password`](/docs/api/liquid/tags/form#form-reset_customer_password)\n- [`storefront_password`](/docs/api/liquid/tags/form#form-storefront_password)",
  "parameters": [
    {
      "description": "The desired URL to redirect to when the form submits.",
      "name": "return_to",
      "positional": true,
      "required": false,
      "types": [
        "string"
      ]
    }
  ],
  "summary": "Generates an HTML `<form>` tag, including any required `<input>` tags to submit the form to a specific endpoint.",
  "name": "form",
  "syntax": "{% form 'form_type' %}\n  content\n{% endform %}",
  "syntax_keywords": [
    {
      "keyword": "form_type",
      "description": "The name of the desired form type"
    },
    {
      "keyword": "content",
      "description": "The form contents"
    }
  ],
  "examples": [
    {
      "name": "activate_customer_password",
      "description": "Generates a form for activating a customer account.\nTo learn more about using this form, and its contents, refer to the [`customers/activate_account` template](/themes/architecture/templates/customers-activate-account#content).\n",
      "syntax": "{% form 'activate_customer_password', article %}\n  form_content\n{% endform %}\n",
      "path": "/",
      "raw_liquid": "{% form 'activate_customer_password' %}\n  <!-- form content -->\n{% endform %}",
      "parameter": false,
      "display_type": "text",
      "show_data_tab": true
    },
    {
      "name": "cart",
      "description": "Generates a form for creating a checkout based on the items currently in the cart. The `cart` form requires a [`cart` object](/docs/api/liquid/objects/cart) as a parameter.\nTo learn more about using the cart form in your theme, refer to the [`cart` template](/themes/architecture/templates/cart#proceed-to-checkout).\n",
      "syntax": "{% form 'cart', cart %}\n  form_content\n{% endform %}\n",
      "path": "/",
      "raw_liquid": "{% form 'cart', cart %}\n  <!-- form content -->\n{% endform %}",
      "parameter": false,
      "display_type": "text",
      "show_data_tab": true
    },
    {
      "name": "contact",
      "description": "Generates a form for submitting an email to the merchant. To learn more about using this form in your theme, refer to [Add a contact form to your theme](/themes/customer-engagement/add-contact-form).\n\n> Tip:\n> To learn more about the merchant experience of receiving submissions, refer to [the Shopify Help Center](https://help.shopify.com/manual/online-store/themes/customizing-themes/add-contact-page#view-contact-form-submissions).\n",
      "syntax": "{% form 'contact' %}\n  form_content\n{% endform %}\n",
      "path": "/",
      "raw_liquid": "{% form 'contact' %}\n  <!-- form content -->\n{% endform %}",
      "parameter": false,
      "display_type": "text",
      "show_data_tab": true
    },
    {
      "name": "create_customer",
      "description": "Generates a form for creating a new customer account.\nTo learn more about using this form, and its contents, refer to the [`customers/register` template](/themes/architecture/templates/customers-register#content).\n",
      "syntax": "{% form 'create_customer' %}\n  form_content\n{% endform %}\n",
      "path": "/",
      "raw_liquid": "{% form 'create_customer' %}\n  <!-- form content -->\n{% endform %}",
      "parameter": false,
      "display_type": "text",
      "show_data_tab": true
    },
    {
      "name": "currency",
      "description": "> Deprecated:\n> The `currency` form is deprecated and has been replaced by the [`localization` form](/docs/api/liquid/tags/form#form-localization).\n\nGenerates a form for customers to select their preferred currency.\n\n> Tip:\n> Use the [`currency_selector` filter](/docs/api/liquid/filters/currency_selector) to include a currency selector inside the form.\n",
      "syntax": "{% form 'currency' %}\n  form_content\n{% endform %}\n",
      "path": "/",
      "raw_liquid": "{% form 'currency' %}\n  {{ form | currency_selector }}\n{% endform %}",
      "parameter": false,
      "display_type": "text",
      "show_data_tab": true
    },
    {
      "name": "customer",
      "description": "Generates a form for creating a new customer without registering a new account. This form is useful for collecting customer information when you don't want customers to log in to your store, such as building a list of emails from a newsletter signup.\n\n> Tip:\n> To generate a form that registers a customer account, use the [`create_customer` form](/docs/api/liquid/tags/form#form-create_customer).\n\nTo learn more about using this form, and its contents, refer to [Email consent](/themes/customer-engagement/email-consent#newsletter-sign-up-form).\n",
      "syntax": "{% form 'customer' %}\n  form_content\n{% endform %}\n",
      "path": "/",
      "raw_liquid": "{% form 'customer' %}\n  <!-- form content -->\n{% endform %}",
      "parameter": false,
      "display_type": "text",
      "show_data_tab": true
    },
    {
      "name": "customer_address",
      "description": "Generates a form for creating a new address on a customer account, or editing an existing one. The `customer_address` form requires a specific parameter, depending on whether a new address is being created or an existing one is being edited:\n\n| Parameter value | Use-case |\n| --- | --- |\n| `customer.new_address` | When a new address is being created. |\n| `address` | When an existing address is being edited. |\n\nTo learn more about using this form, and its contents, refer to the [`customers/addresses` template](/themes/architecture/templates/customers-addresses#content).\n",
      "syntax": "{% form 'customer_address', address_type %}\n  form_content\n{% endform %}\n",
      "path": "/",
      "raw_liquid": "{% form 'customer_address', customer.new_address %}\n  <!-- form content -->\n{% endform %}",
      "parameter": false,
      "display_type": "text",
      "show_data_tab": false
    },
    {
      "name": "customer_login",
      "description": "Generates a form for logging into a customer account.\nTo learn more about using this form, and its contents, refer to the [`customers/login` template](/themes/architecture/templates/customers-login#the-customer-login-form).\n",
      "syntax": "{% form 'customer_login' %}\n  form_content\n{% endform %}\n",
      "path": "/",
      "raw_liquid": "{% form 'customer_login' %}\n  <!-- form content -->\n{% endform %}",
      "parameter": false,
      "display_type": "text",
      "show_data_tab": true
    },
    {
      "name": "guest_login",
      "description": "Generates a form, for use in the [`customers/login` template](/themes/architecture/templates/customers-login), that directs customers back to their checkout session as a guest instead of logging in to an account.\nTo learn more about using this form, and its contents, refer to [Offer guest checkout](/themes/architecture/templates/customers-login#offer-guest-checkout).\n",
      "syntax": "{% form 'guest_login' %}\n  form_content\n{% endform %}\n",
      "path": "/",
      "raw_liquid": "{% form 'guest_login' %}\n  <!-- form content -->\n{% endform %}",
      "parameter": false,
      "display_type": "text",
      "show_data_tab": true
    },
    {
      "name": "localization",
      "description": "Generates a form for customers to select their preferred country so that they're shown the appropriate language and currency. The `localization` form can contain one of two selectors:\n\n- A country selector\n- A language selector\n\n> Note:\n> The `localization` form replaces the deprecated [`currency` form](/docs/api/liquid/tags/form#form-currency).\n\nTo learn more about using this form, and its contents, refer to [Support multiple currencies and languages](/themes/internationalization/multiple-currencies-languages).\n",
      "syntax": "{% form 'localization' %}\n  form_content\n{% endform %}\n",
      "path": "/",
      "raw_liquid": "{% form 'localization' %}\n  <!-- form content -->\n{% endform %}",
      "parameter": false,
      "display_type": "text",
      "show_data_tab": true
    },
    {
      "name": "new_comment",
      "description": "Generates a form for creating a new comment on an article. The `new_comment` form requires an [`article` object](/docs/api/liquid/objects/article) as a parameter.\nTo learn more about using this form, and its contents, refer to the [`article` template](/themes/architecture/templates/article#the-comment-form).\n",
      "syntax": "{% form 'new_comment', article %}\n  form_content\n{% endform %}\n",
      "path": "/blogs/potion-notions/how-to-tell-if-you-have-run-out-of-invisibility-potion",
      "raw_liquid": "{% form 'new_comment', article %}\n  <!-- form content -->\n{% endform %}",
      "parameter": false,
      "display_type": "text",
      "show_data_tab": true
    },
    {
      "name": "product",
      "description": "Generates a form for adding a product variant to the cart. The `product` form requires a [`product` object](/docs/api/liquid/objects/product) as a parameter.\nTo learn more about using this form, and its contents, refer to the [`product` template](/themes/architecture/templates/product#the-product-form).\n",
      "syntax": "{% form 'product', product %}\n  form_content\n{% endform %}\n",
      "path": "/products/health-potion",
      "raw_liquid": "{% form 'product', product %}\n  <!-- form content -->\n{% endform %}",
      "parameter": false,
      "display_type": "text",
      "show_data_tab": true
    },
    {
      "name": "recover_customer_password",
      "description": "Generates a form, for use in the [`customers/login` template](/themes/architecture/templates/customers-login), for a customer to recover a lost or forgotten password.\nTo learn more about using this form, and its contents, refer to [Provide a \"Forgot your password\" option](/themes/architecture/templates/customers-login#provide-a-forgot-your-password-option).\n",
      "syntax": "{% form 'recover_customer_password' %}\n  form_content\n{% endform %}\n",
      "path": "/",
      "raw_liquid": "{% form 'recover_customer_password' %}\n  <!-- form content -->\n{% endform %}",
      "parameter": false,
      "display_type": "text",
      "show_data_tab": true
    },
    {
      "name": "reset_customer_password",
      "description": "Generates a form for a customer to reset their password.\nTo learn more about using this form, and its contents, refer to the [`customers/reset_password` template](/themes/architecture/templates/customers-reset-password#content).\n",
      "syntax": "{% form 'reset_customer_password' %}\n  form_content\n{% endform %}\n",
      "path": "/",
      "raw_liquid": "{% form 'reset_customer_password' %}\n  <!-- form content -->\n{% endform %}",
      "parameter": false,
      "display_type": "text",
      "show_data_tab": true
    },
    {
      "name": "storefront_password",
      "description": "Generates a form for entering a password protected storefront.\nTo learn more about using this form, and its contents, refer to the [`password` template](/themes/architecture/templates/password#the-password-form).\n",
      "syntax": "{% form 'storefront_password' %}\n  form_content\n{% endform %}\n",
      "path": "/",
      "raw_liquid": "{% form 'storefront_password' %}\n  <!-- form content -->\n{% endform %}",
      "parameter": false,
      "display_type": "text",
      "show_data_tab": true
    },
    {
      "name": "return_to",
      "description": "By default, each form type redirects customers to a specific page after the form submits. For example, the `product` form redirects to the cart page.\n\nThe `return_to` parameter allows you to specify a URL to redirect to. This can be done with the following values:\n\n| Value | Description |\n| --- | --- |\n| `back` | Redirect back to the same page that the customer was on before submitting the form. |\n| A relative path | A specific URL path. For example `/collections/all`. |\n| A [`routes` attribute](/docs/api/liquid/objects/routes) | For example, `routes.root_url` |\n",
      "syntax": "{% form 'form_type', return_to: string %}\n  content\n{% endform %}\n",
      "path": "/",
      "raw_liquid": "{% form 'customer_login', return_to: routes.root_url %}\n  <!-- form content -->\n{% endform %}",
      "parameter": true,
      "display_type": "text",
      "show_data_tab": true
    },
    {
      "name": "HTML attributes",
      "description": "You can specify [HTML attributes](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/iframe#attributes) by adding a parameter that matches the attribute name with `data-` prepended, and the desired value.\n",
      "syntax": "{% form 'form_type', attribute: string %}\n  content\n{% endform %}\n",
      "path": "/products/health-potion",
      "raw_liquid": "{% form \"product\", product, id: 'custom-id', class: 'custom-class', data-example: '100' %}\n  <!-- form content -->\n{% endform %}",
      "parameter": true,
      "display_type": "text",
      "show_data_tab": true
    }
  ]
}