Quick start guide
#Quick start guide
This guide walks you through everything you need to go from installing the app to collecting your first form submission. You can have a working form live on your store in under 10 minutes.
#Step 1: Install the app
- Find Form Builder in the Shopify App Store and click Add app.
- You will be redirected to your Shopify admin to review the permissions the app needs.
- Click Install app to confirm.
- Once installed, the app opens automatically in your Shopify admin. You will see the Form Builder dashboard.
After installation, Form Builder is ready to use right away on the Free plan, which includes up to 3 forms and 100 submissions per month. You can upgrade anytime from the Pricing page if you need more.
#Step 2: Navigate the dashboard
When you open Form Builder, you will land on the Dashboard. Here is what you will find:
- Submission chart — A visual overview of how many form submissions you have received over time
- Storage usage — Shows how much of your file upload quota you have used this month
- Recent submissions — A quick look at the latest form responses
- Create Form button — Your shortcut to start building a new form
The left sidebar gives you access to all sections of the app:
- Dashboard — Your home base with stats and recent activity
- Forms — View, create, edit, and manage all your forms
- Submissions — Browse and export all form responses
- Pricing — View plans and manage your subscription
- Settings — Configure reCAPTCHA and other global settings
#Step 3: Create your first form
You have three ways to create a form. Pick whichever suits you best.
#Option A: Start from scratch
- Go to Forms in the sidebar and click Create Form.
- This opens the form builder with a blank canvas.
- Give your form a name in the header field at the top.
- Start adding fields by dragging them from the left sidebar onto the canvas.
#Option B: Start from a template
- Go to Forms and click Browse Templates (or go to the Templates page).
- Browse 31 templates across 9 categories — Contact, Register, Popup, Booking, Order, Survey, Warranty, Wholesale, and Third-party.
- Click on any template to preview it, then click Use Template.
- The template loads into the form builder with all fields pre-configured. Customize anything you like.
#Option C: Use the AI generator
- Go to the Templates page and find the AI Form Generator card at the top.
- Describe the form you want in plain English. For example: "A customer feedback form with name, email, a 5-star rating for overall experience, and a comments box."
- Click Generate with AI.
- The AI creates a complete form with fields, styling, and a thank-you message. It loads directly into the form builder for you to review and adjust.
You can also access the AI generator from inside the form builder, using the prompt input at the top of the left sidebar.
#Step 4: Add and configure fields
Once you are in the form builder, adding fields is simple:
Browse the field library on the left sidebar. Fields are organized into categories like Contact Info, Selection Fields, Input Fields, Text, Ratings, and more.
Drag a field from the library and drop it onto the canvas in the center. It appears exactly where you drop it.
Click any field on the canvas to select it. The right panel shows all the settings for that field.
Configure the field in the right panel:
- Label — The name shown above the field (e.g., "Your Email")
- Placeholder — Hint text shown inside the empty field
- Required — Toggle this on if the field must be filled out before submitting
- Column width — Set to 100% for full width, or 50% to place two fields side by side
- Type-specific settings — Depending on the field type, you will see options like dropdown choices, file type restrictions, min/max values, and more
Reorder fields by dragging them up or down on the canvas.
Duplicate or delete a field using the icons that appear when you hover over it.
For longer forms, you can add multiple pages using the page controls at the top of the canvas. Customers will see a step-by-step progress bar as they move through your form.
#Step 5: Customize the appearance
Click the Design tab in the right panel to style your form:
Layout — Choose how the form appears on your page:
- Default — Standard inline form embedded in the page
- Boxed — Form inside a contained box with rounded corners
- Float — A floating button that opens the form when clicked
- Popup — A modal overlay that appears based on triggers like scroll depth or time delay
Style — Pick an input field style: Classic, Material, Line, or Flat (each with a rounded variant).
Colors — Set colors for the background, text, buttons, labels, and outlines to match your store's branding.
Font — Choose from popular Google Fonts like Inter, Roboto, Poppins, or Montserrat. Set the size to Small, Medium, or Large.
Background — Use a solid color or upload a background image.
#Step 6: Set up after-submit behavior
Click the After Submit tab to decide what happens when a customer submits your form:
- Hide the form — The form disappears after submission
- Show a message — Display a custom thank-you title and message
- Redirect — Send the customer to a specific URL after submitting
- Discount code — Show a discount code as a reward for submitting
#Step 7: Configure email notifications (optional)
Click the Email tab to set up notifications:
- Admin notification — Enter one or more email addresses (up to 5) to receive an email every time someone submits the form. Customize the subject line and email content.
- Auto-responder — Send an automatic confirmation email to the customer. Select which email field in your form to use as the recipient address, and customize the message.
Both email types support template variables like {{data}} (a table of all answers), {{id}} (submission number), and {{customer.name}}.
#Step 8: Publish your form
Once you are happy with your form, it is time to put it on your store:
- Click the Publish button at the top of the form builder.
- Choose where to display the form:
- Homepage — Show the form on your store's front page
- A specific page — Select from your Shopify pages
- A product page — Attach the form to a specific product
- Confirm the publish location. If the form has not been saved yet, it is automatically saved for you.
- Your form is now live on your storefront.
You can publish the same form to multiple locations, and you can unpublish it at any time from the form builder.
#Step 9: View and manage submissions
As customers fill out your form, submissions appear in two places:
- Dashboard — The recent submissions table shows the latest responses at a glance.
- Submissions page — Go to Submissions in the sidebar. You will see a list of your forms with submission counts. Click any form to see all its responses.
For each submission, you can:
- View the full response with all field answers
- Navigate between submissions using previous/next buttons
- See metadata like the page URL, browser, and device used
- Export submissions to CSV or Excel
- Delete individual submissions or clear them in bulk
#What's next?
You now have a working form on your store. Here are some ways to get more out of Form Builder:
- Explore all field types — Check the field types reference to discover 30+ field types including star ratings, file uploads, signature pads, and more.
- Set up integrations — Connect your forms to Google Sheets, Mailchimp, Slack, and other tools to automate your workflow.
- Use conditional logic — Show or hide fields based on customer selections to keep forms clean and relevant (available on Growth plan and above).
- Try different layouts — Experiment with floating and popup forms to capture leads without taking up page space.
- Dive into the builder — Read the full form builder guide to master every feature.