Add Custom Forms to Shopify with Basin

In this guide, we'll show you how to add a custom contact form to your Shopify store and connect it to Basin.

Basin is a no-code form backend that pairs nicely with e-commerce platforms like Shopify.

Shopify is one of the most popular e-commerce platforms in the world, powering millions of online stores. While Shopify includes a basic contact form, Basin gives you far more control — custom fields, spam filtering, file uploads, integrations, and email notifications.

By following this guide, you'll have a custom contact form on your Shopify store that sends you email notifications when visitors submit.

Requirements

You'll need a Basin account, which you can create for free here, and a Shopify store. You should be comfortable editing your theme code or using Shopify's custom page/HTML features.

Step 1 — Create a form endpoint in Basin

After logging in to your Basin account, create a new form endpoint from the Forms index page. Fill out the fields and click "Create Form".

After your new form endpoint is created, it will appear in your My Forms list. Select it to view the Submissions page, where you can see the inbox, check analytics, and configure integrations and mailer settings.

Copy the form endpoint URL — you'll use it in the next step.

Step 2 — Add a contact form to your Shopify store

There are two ways to add a Basin form to Shopify:

Option A — Custom Liquid template: From your Shopify admin, go to Online Store → Themes → Edit code. Create or edit a template (such as page.contact.liquid) and add the following form:

<div class="page-width">
  <h1>Contact Us</h1>
  <form action="https://usebasin.com/f/<YOUR_FORM_ID>" method="POST">
    <div>
      <label for="name">Name</label>
      <input type="text" name="name" id="name" required />
    </div>
    <div>
      <label for="email">Email</label>
      <input type="email" name="email" id="email" required />
    </div>
    <div>
      <label for="message">Message</label>
      <textarea name="message" id="message" rows="5"></textarea>
    </div>
    <button type="submit">Send</button>
  </form>
</div>

Option B — Custom HTML page: From your Shopify admin, go to Online Store → Pages → Add page. Toggle the editor to HTML mode (the <> button) and paste the form HTML above (without the page-width wrapper).

In either case, replace <YOUR_FORM_ID> with the form endpoint ID you copied from Basin. Style the form using your theme's existing CSS classes, or add inline styles as needed.

Step 3 — Test your form

Visit the contact page on your Shopify store, fill out the form, and submit. You should see Basin's default success page, and the submission will appear in your Basin inbox.

From there you can configure email notifications, connect integrations like Slack or Google Sheets, set up spam filtering, and more.

Conclusion

In this guide, you learned how to add a Basin-powered contact form to your Shopify store. Since Basin works with standard HTML forms, no Shopify apps or server-side code are required — you get full control over form fields, styling, and submission handling.

To learn how Basin works with other frameworks and CMS platforms, check out our other step-by-step installation guides.

Happy form building!