Skip to content
Log in

Liquid forms reference

On this page

The {% form %} tag generates HTML forms with the correct action URL, CSRF protection, and field definitions. This article lists all available form types and their fields.

For usage patterns, the form drop, and how to extend forms with custom parameters, see Theme forms.

What this article covers

One entry per form type: the name to pass to {% form %}, the fields it defines, and the parameters it takes.

The tag itself is covered elsewhere. See the form tag reference for the form drop, field attributes and the error shape, and the Liquid forms guide for building and validating a form end to end.


Authentication forms

login

Logs in a customer.

```liquid

{% form “login” %} <input type=”email” name=”{{ form.fields[“username”].name }}” value=”{{ form.fields[“username”].value }}”> <input type=”password” name=”{{ form.fields[“password”].name }}”> {% endform %} ```

Fields: username, password

register

Registers a new customer.

```liquid

{% form “register” %} <input name=”{{ form.fields[“firstname”].name }}” value=”{{ form.fields[“firstname”].value }}” placeholder=”First name”> <input name=”{{ form.fields[“lastname”].name }}” value=”{{ form.fields[“lastname”].value }}” placeholder=”Last name”> <input type=”email” name=”{{ form.fields[“email”].name }}” value=”{{ form.fields[“email”].value }}” placeholder=”Email”> <input type=”password” name=”{{ form.fields[“password”].name }}” placeholder=”Password”> {% endform %} ```

Fields: firstname, lastname, email, password, phone (optional), campaign_ids (optional), company_name (optional), billing address fields: billing_address_lines, billing_city, billing_state, billing_postal_code, billing_country

sso-login

Single Sign-On login via an external provider. Renders the SSO redirect mechanism.

single-sign-on is registered as a second name for this same form, so {% form "single-sign-on" %} and {% form "sso-login" %} are interchangeable.

forgot-password

Requests a password reset email.

Fields: email

reset-password

Sets a new password from a reset token.

Fields: password, password_confirmation

resend-confirmation

Resends the email confirmation.

Fields: username

accept-invitation

Accepts an invitation to create an account.

Fields: password, password_confirmation, campaign_ids

account-missing-details

Collects required profile information after login when mandatory fields are missing. Only renders fields with missing values, so the set of fields is dynamic.

Fields: Varies based on what’s missing from the contact profile


Cart forms

add-to-cart

Adds a product to the cart. Pass the product as an option (preferred) or use product_id.

```liquid

{% form “add-to-cart”, product: current_product %} <input type=”number” name=”{{ form.fields[“quantity”].name }}” value=”1” min=”1”> {% endform %} ```

Options: product (ProductDrop, preferred) or product_id (String)

Fields: quantity, price (for variable pricing), product_bookable_location_id, booking_start, booking_end, plus any custom form question answers

“Buy now” pattern — use formaction to redirect directly to checkout:

```liquid

{% form “add-to-cart”, product: current_product %} <input type=”number” name=”{{ form.fields[“quantity”].name }}” value=”1”> {% endform %} ```

add-bundle-to-cart

Adds a bundle product with its configured components.

Fields: product_id, bundle configuration fields

add-preset-bundle

Adds a pre-configured bundle to the cart.

cart

Wraps the cart display for quantity updates. No pre-defined form fields; use raw <input> elements with the cart_items[ITEM_ID][quantity] naming convention.

```liquid

{% form “cart” %} {% for item in current_cart.items %} {% endfor %} {% endform %} ```

To remove a cart item, use the item’s delete_path:

```liquid

Remove ```


Checkout forms

checkout-customer-information

Collects customer details at the first checkout step.

```liquid

{% form “checkout-customer-information”, id: “SC-CheckoutShippingForm” %} {% render “form_errors”, errors: form.errors %} {% render “checkout/customer_information/form”, form: form %} {% endform %} ```

Fields: email, phone, company_name, first_name/last_name or full_name (depends on store config), shipping_address_lines, shipping_city, shipping_state, shipping_postal_code, shipping_country, billing_same_as_shipping, billing address fields, customer_notes, captcha_token, plus custom form question answers

checkout-shipping-information

Selects the shipping method.

```liquid

{% form “checkout-shipping-information” %} {% render “form_errors”, errors: form.errors %} {% render “checkout/shipping_information/form”, form: form %} {% endform %} ```

Fields: method (shipping rate ID), collection_time, notes (if enabled), use_points, click_and_collect_option, per-item delivery window fields, plus custom form question answers

checkout-accept-terms

Accepts terms and conditions.

```liquid

{% form “checkout-accept-terms”, id: “SC-CheckoutTerms” %} {% render “form_errors”, errors: form.errors %} {% render “checkout/accept_terms/form”, form: form %} {% endform %} ```

Fields: terms_accepted, plus custom form question answers

payment

Submits payment information. The form content varies by payment provider (Stripe, PayPal, Adyen, etc.) and is typically rendered inside a component that loads the payment provider’s JavaScript.

payment-not-required

Handles orders that don’t require payment, for example orders fully covered by account credits or using pay-by-account.


Voucher and promotion forms

apply-voucher

Applies a voucher code to the cart.

```liquid

{% form “apply-voucher” %} <input name=”{{ form.fields[“code”].name }}” placeholder=”Voucher code”> <input name=”{{ form.fields[“pin”].name }}” placeholder=”PIN (if required)”> {% endform %} ```

Fields: code, pin

remove-voucher

Removes an applied voucher. Pass the voucher as an option.

```liquid

{% form “remove-voucher”, voucher: voucher %} {% endform %} ```

activate-voucher

Activates a voucher from the voucher detail page. Pass the voucher as an option.

apply-promo-code

Applies a promotion/coupon code to the cart.

```liquid

{% form “apply-promo-code” %} <input name=”{{ form.fields[“code”].name }}” placeholder=”Promo code”> {% endform %} ```

Fields: code


Account credit forms

apply-account-credit

Applies account credit to the order.

Fields: id (credit account ID), amount (amount to apply)

remove-account-credit

Removes applied account credit. Requires account_credit option.


Account management forms

account

Updates the customer’s profile and login credentials.

```liquid

{% form “account” %} <input name=”{{ form.fields[“firstname”].name }}” value=”{{ form.fields[“firstname”].value }}”> <input name=”{{ form.fields[“lastname”].name }}” value=”{{ form.fields[“lastname”].value }}”> <input type=”email” name=”{{ form.fields[“email”].name }}” value=”{{ form.fields[“email”].value }}”> <input name=”{{ form.fields[“phone”].name }}” value=”{{ form.fields[“phone”].value }}”> {% endform %} ```

Fields: username, current_password, password, password_confirmation, email, firstname, lastname, phone, campaign_ids, company_name, billing address fields (billing_address_lines, billing_city, billing_state, billing_postal_code, billing_country), shipping address fields


Custom forms

Contact forms, newsletter sign-ups, and other configurable forms are implemented as custom forms in StoreConnect. Use the custom-form type with the form’s identifier.

custom-form

Submits a custom form defined in the CMS.

```liquid

{% form “custom-form”, custom_form: my_form %} {% for question in my_form.questions %} <div class="field"> {% case question.question_type %} {% when “text” %} {% when “text_area” %} {% when “picklist” %} {% when “integer” %} {% when “date” %} {% when “file” %} {% endcase %} </div> {% endfor %} {% endform %} ```

Supported question types: text, text_area, picklist, multi_picklist, integer, decimal, date, datetime, file, hidden


Subscription and additional payment forms

checkout-set-password

Creates an account after guest checkout. Requires the order option.

Fields: password, campaign_ids

additional-payment-billing-address

Updates the billing address for additional payment (pay-by-link). Requires the order context.

Fields: billing_address_lines, billing_city, billing_state, billing_postal_code, billing_country

subscription-payment

Pays an outstanding subscription installment. Requires the subscription option.

update-subscription-payment-details

Updates the payment method on a subscription. Requires the subscription option.


Booking forms

booking-attendee-add

Adds an attendee to a booking.

Fields: Attendee information fields (firstname, lastname, email, phone, etc.)

booking-attendee-edit

Edits an existing booking attendee.


Privacy forms

privacy-accept-all

Accepts all cookie groups.

privacy-reject-all

Rejects all optional cookie groups.

privacy-settings

Saves specific cookie preferences.


Geolocation forms

geolocation-select

Selects a store based on the customer’s location.

geolocation-dismiss

Dismisses the store location suggestion.


Form error handling

Every form type above exposes errors the same way, so it is documented once rather than per form: see error handling in the form tag reference for the shape of a FormError, and the Liquid forms guide for the display patterns.

Was this article helpful?

Was this article helpful?