Prefill form fields

Simplify customer interactions by pre-filling form fields.

Prefilling form fields enhances the customer experience by reducing manual input. You can achieve this by appending specific parameters to a URL and sharing it with the customer. When the customer accesses the URL, the form fields will automatically populate with the specified values.

Using Query Strings to Prefill Fields

Query strings are added to the URL in the format of key-value pairs, separated by &. For example:

https://apple.myshopify.com/apps/product-registration?sn=123&purchaseDate=2023-08-08

In this URL, everything after the ? is the query string. Each key-value pair represents a field and its value:

• sn=123: Prefills the serial number field.

• purchaseDate=2023-08-08: Prefills the purchase date field.

You can include multiple query strings by separating them with &.

Example

The following URL prefills both the serial number and purchase date fields:

https://apple.myshopify.com/apps/product-registration?sn=123&purchaseDate=2023-08-08

Prefilling the Product Field

The product field requires a product ID to match the product in Shopify. Use the following format:

product=product_id_12323

For example:

https://bigapple.myshopify.com/apps/product-registration?product=product_id_12323

To find the product ID:

1. Navigate to Products in the Shopify admin.

2. Open the product details.

3. Locate the product ID in the URL's last segment.

Prefilling Other Fields

You can prefill any form field by identifying its name. To find the field name:

1. Go to Forms in the App admin.

2. Select the form.

3. Navigate to Design.

4. Click on the field.

5. Check the field name in the options panel on the right.

Once you have the field name, use the same query string pattern:

fieldName=value

Example

To prefill the purchase date field:

https://apple.myshopify.com/apps/product-registration?purchaseDate=2023-08-08

Formatting Guidelines

Ensure values are in the correct format. For example:

• Dates should follow the YYYY-MM-DD format.

Incorrect formats may prevent fields from being prefilled.

Example

Correct: purchaseDate=2023-08-08 Incorrect: purchaseDate=08-08-2023

Testing the Prefill URL

Before sharing the URL with customers, test it to ensure it works as expected:

1. Copy the URL.

2. Open a new browser window or tab.

3. Paste the URL into the address bar and press Enter.

4. Verify that the form fields are correctly prefilled.

Testing ensures all query strings are properly formatted and functional.