Customize Quote Form

This tab lets you control two important aspects of the quote request experience:

• What product and customer information is shown in the quote popup

• How the quote form looks and feels to match your store branding

On the left-hand side, you’ll find two sub-sections:

• Product Information

• Form Fields

• Form Styles

On the right-hand side, a real-time preview shows how the form will appear in the popup modal shown to your customers. You can toggle between:

• Quote Form: The form appearing when customer add products to quote or click the quote widget

• After Submit: The state after customer clicks Submit Quote

1. Product Information

This controls what product details appear inside the quote popup.

• Variant: Show the selected variant (e.g., size/color).

• SKU: Show the SKU for each quoted item.

• Available Quantity: Displays the current inventory quantity of each product variant.

Advanced Information:

• Vendor: Show product vendor/brand.

• Type: Display the product type.

• Barcode: Show the product’s barcode (if applicable).

Recommended to keep SKU and Variant enabled for B2B buyers who often deal with large product lists.

2. Form Fields

This is where you customize the fields the customer needs to fill before submitting a quote.

There are three types of fields:

1. Information Fields: Include First Name, Last Name, Email, Phone, and Shipping Address.

• These fields can be auto-filled if the customer is logged in and their information already exists in your store.

• If you're using Shopify Plus, the form will also include Company Information: Company Name, Location, and Shipping Address.

Note: The form for Company customers (Shopify Plus) will have a Company Information section, which is automatically synced from Shopify, including company name, location, and address.

These fields cannot be edited in the quote form, as they are managed by Shopify directly.

2. Custom Fields:

• You can create additional fields to fit your business needs.

• Supported field types include: Text, Number, Date, Dropdown, Checkbox list, Radio buttons.

3. Additional Fields: These are layout elements to improve the form’s structure and clarity:

• Heading: To group or label sections

• Divider: To visually separate sections

• Default Fields:

  • First Name, Last Name, Email, Phone → Basic contact info

  • Shipping Address → Include fields like Country, Street, City...

Field Controls:

• Eye icon: Show/Hide the field.

• Pencil icon: Edit label or placeholder.

• Trash icon: Delete the field.

3. Form Styles

Style your form to match your store branding.

• General:

  • Border width: Thickness of the box outline.

  • Border radius: Controls corner roundness.

• Color scheme: Customize these 5 elements individually:

  • General: Base font colors include background, text, and the scrollbar

  • Form header: The background and text of the form header

  • Primary button: The button “Submit Request” (include color, hover color, text)

  • Secondary button: Buttons “Continue Shopping” and "Back to Store" (include color, hover color, text)

  • Box: Background, border and text colors for all the input fields.