Streamlining Shopify Wholesale Applications: How to Combine Forms for a Seamless Experience

Hey everyone, I recently dove into a really interesting discussion on the Shopify community forums that touched on a common pain point for many store owners: how to manage complex forms, especially for things like wholesale applications. Jason.Hart kicked off the thread asking about combining contact and customer_address forms into one seamless submission, and the insights shared were invaluable.

The Challenge: Why Two Shopify Forms Can't Be One

Jason’s original question highlighted a common misconception. He wanted to merge a contact form (for general inquiries) with a customer_address form (for shipping info) and have everything submit with a single button. Sounds logical, right? You want all the info in one go! However, as experts like Ploqo, Steve_TopNewYork, and the AI theme code editor pointed out, Shopify's built-in form helpers ({%- form 'contact' -%} and {%- form 'customer_address' -%}) are designed for very specific, separate tasks. They each have their own unique 'endpoint' – a dedicated destination for their data.

• The contact form sends its data to your store’s general contact email.
• The customer_address form is specifically for managing a logged-in customer’s saved addresses, interacting directly with a customer account.

Trying to use one submit button for two different backend processes simultaneously just doesn't work within Shopify's standard Liquid form structure. As Ploqo succinctly stated, "Two Shopify {%- form -%} tags cannot share one submit button."

The Elegant Solution: One Contact Form, Custom Fields

So, what's the trick? The community consensus was clear and brilliant: use a single {%- form 'contact' -%} tag and include all your additional fields within it as custom contact[...] inputs. This approach is perfect for scenarios like wholesale applications where you need to collect diverse information – personal details, company info, and shipping address – but prefer to review it manually before creating a customer account or granting wholesale access. Jason.Hart confirmed this was his exact goal: "simply to collect the details and manually set up their profiles." This makes the contact form the ideal candidate.

How contact[...] Inputs Work

When you add an input field like inside your contact form, Shopify captures the user's input and includes it in the email notification you receive. The text inside the brackets, like "Shipping city," becomes the label in your email, making it easy to understand each piece of information. This means you can collect first name, last name, company, email, phone, and a full shipping address all within that one contact form, and it all gets sent together in a single request.

Step-by-Step: Implementing Your Wholesale Application Form

Ploqo provided a fantastic code example. Here’s how to set it up:

1. Go to your Shopify admin: Online Store > Themes.
2. Find your current theme, click the … (Actions) button, and select Edit code.
3. For a dedicated wholesale application page, create a new template. In the templates directory, click Add a new template, choose page, and name it something like wholesale (this creates templates/page.wholesale.liquid).
4. Paste the following code into your new template file. This includes basic styling and clearly separates sections for contact details, shipping address, and additional information, all within one contact form.

   <div class="wholesale-apply" style="max-width:720px;margin:0 auto;padding:40px 20px;">
     <style>
       .wholesale-apply label{display:block;margin:14px 0 4px;font-weight:600;font-size:14px;}
       .wholesale-apply input,.wholesale-apply textarea{width:100%;padding:10px 12px;border:1px solid #ccc;border-radius:6px;box-sizing:border-box;font-size:15px;}
       .wholesale-apply h3{margin:26px 0 6px;border-bottom:1px solid #eee;padding-bottom:6px;}
       .wholesale-apply .row{display:flex;gap:16px;flex-wrap:wrap;}
       .wholesale-apply .row>div{flex:1;min-width:200px;}
       .wholesale-apply .btn{margin-top:22px;padding:12px 22px;background:#1a1a1a;color:#fff;border:0;border-radius:6px;font-size:15px;cursor:pointer;}
     </style>
   
     <h1 style="margin-bottom:6px;">Wholesale application</h1>
   
     {%- form 'contact', return_to: request.path -%}
       {%- if form.posted_successfully? -%}
         <p style="padding:14px;border:1px solid #2a9d5c;background:#eafaf0;border-radius:6px;">Thanks. We received your application and will be in touch.</p>
       {%- endif -%}
       {%- if form.errors -%}
         <p style="padding:14px;border:1px solid #d64a4a;background:#fdeaea;border-radius:6px;">{{ form.errors | default_errors }}</p>
       {%- endif -%}
   
       <h3>Contact details</h3>
       <div class="row">
         <div><label for="firstName">First name</label>
           <input type="text" id="firstName" name="contact[First name]" value="{{ form.first_name }}"></div>
         <div><label for="lastName">Last name</label>
           <input type="text" id="lastName" name="contact[Last name]" value="{{ form.last_name }}"></div>
       </div>
       <label for="company">Company</label>
       <input type="text" id="company" name="contact[Company]">
       <div class="row">
         <div><label for="email">Email</label>
           <input type="email" id="email" name="contact[email]" value="{{ form.email }}" required></div>
         <div><label for="phone">Phone</label>
           <input type="tel" id="phone" name="contact[phone]" value="{{ form.phone }}"></div>
       </div>
   
       <h3>Shipping address</h3>
       <label for="address1">Address</label>
       <input type="text" id="address1" name="contact[Shipping address]">
       <div class="row">
         <div><label for="city">City</label>
           <input type="text" id="city" name="contact[Shipping city]"></div>
         <div><label for="zip">ZIP / Postcode</label>
           <input type="text" id="zip" name="contact[Shipping ZIP]"></div>
       </div>
       <label for="country">Country</label>
       <input type="text" id="country" name="contact[Shipping country]">
   
       <h3>Additional details</h3>
       <label for="message">Tell us about your business</label>
       <textarea id="message" name="contact[body]" rows="4"></textarea>
   
       <button type="submit" class="btn">Submit application</button>
     {%- endform -%}
   </div>

5. Save the file.
6. Create a new page in your Shopify admin (Online Store > Pages > Add page). Give it a title like "Wholesale Application" and, under "Theme template," select your new template (e.g., page.wholesale).

What Happens After Submission?

Once someone fills out this form:

• Email Delivery: All submitted information arrives as a single email to your store's contact address (set in Settings > Notifications). Each contact[...] field will appear as a labelled line in this email.
• Manual Processing: As wilhelmpa wisely noted, "contact form submissions don't land anywhere in your admin. Shopify emails them... and that email is the only copy." For businesses with a manageable volume of applications, this manual approach – reading the email, approving, and then creating a customer profile in your Shopify admin – is efficient and gives you full control.

When to Consider Advanced Solutions

While the single contact form is a simple solution, it doesn't automate customer account creation or address saving. If your business processes many wholesale applications, manually handling them can become time-consuming. In such scenarios, you might need:

• Custom App or App Proxy: For full automation, you can develop a custom app or use an app proxy to send form data to your own server, then use the Shopify Admin API to programmatically create customer accounts and add details.
• Third-Party Wholesale App: The Shopify App Store offers many robust wholesale apps that automate the entire application, approval, and account creation process, integrating directly with customer accounts and pricing tiers.

For most growing businesses, starting with the single contact form is a brilliant, low-cost way to get your wholesale application up and running quickly. It keeps things simple and gives you control over the approval process. If you're just getting started with a new business venture on Shopify, remember that building out these foundational elements efficiently can make a huge difference. You can start your Shopify journey with a solid plan, knowing how to handle your custom forms like a pro! The key takeaway from this community thread is that sometimes the most straightforward solution involves understanding the underlying mechanics of Shopify's Liquid forms. By leveraging the contact form with custom contact[...] fields, you can collect all the necessary information for your wholesale applications efficiently and effectively, keeping your process lean and manageable as you grow. It's all about choosing the right tool for the job, and for manual wholesale application processing, this method is a clear winner.