Skip to main content

Documentation Index

Fetch the complete documentation index at: https://doc.spike.ac/docs/llms.txt

Use this file to discover all available pages before exploring further.

Why Use Spike with Shopify

Shopify doesn’t have a built-in contact form backend with advanced features. Spike gives you:
  • Unlimited form submissions
  • Email notifications for every submission
  • Spam protection (honeypot, reCAPTCHA, Turnstile)
  • Webhooks to connect to your order systems
  • 21+ integrations (Slack, Google Sheets, etc.)
  • File upload support for order attachments

Setup Steps

1

Create Spike Form

Create a new form in your Spike dashboard and copy the form slug.
2

Edit Theme

In Shopify admin, go to Online StoreThemesCustomize. Add a Custom Liquid section where you want the form.
3

Paste Form HTML

Paste your Spike form HTML into the Custom Liquid block.
4

Save

Save the theme. Your form is live.

Contact Form Example

Paste this into a Custom Liquid section:
<div class="spike-form-wrapper" style="max-width:500px;margin:0 auto;padding:20px;">
  <form action="https://api.spike.ac/f/YOUR_FORM_SLUG" method="POST">
    <input type="text" name="_gotcha" style="display:none">
    <input type="hidden" name="_next" value="https://yourstore.myshopify.com/pages/thank-you">

    <div style="margin-bottom:16px;">
      <label style="display:block;font-size:14px;margin-bottom:4px;">Name</label>
      <input type="text" name="name" required
        style="width:100%;padding:10px;border:1px solid #ddd;border-radius:4px;">
    </div>

    <div style="margin-bottom:16px;">
      <label style="display:block;font-size:14px;margin-bottom:4px;">Email</label>
      <input type="email" name="email" required
        style="width:100%;padding:10px;border:1px solid #ddd;border-radius:4px;">
    </div>

    <div style="margin-bottom:16px;">
      <label style="display:block;font-size:14px;margin-bottom:4px;">Order Number (optional)</label>
      <input type="text" name="order_number"
        style="width:100%;padding:10px;border:1px solid #ddd;border-radius:4px;">
    </div>

    <div style="margin-bottom:16px;">
      <label style="display:block;font-size:14px;margin-bottom:4px;">Message</label>
      <textarea name="message" rows="4" required
        style="width:100%;padding:10px;border:1px solid #ddd;border-radius:4px;resize:vertical;"></textarea>
    </div>

    <button type="submit"
      style="width:100%;padding:12px;background:#000;color:#fff;border:none;border-radius:4px;font-size:14px;cursor:pointer;">
      Send Message
    </button>
  </form>
</div>

Wholesale / Quote Request Form

A more advanced form for B2B stores:
<form action="https://api.spike.ac/f/YOUR_FORM_SLUG" method="POST">
  <input type="text" name="_gotcha" style="display:none">
  <input type="hidden" name="_subject" value="New Wholesale Inquiry">

  <input type="text" name="company" placeholder="Company Name" required
    style="width:100%;padding:10px;border:1px solid #ddd;margin-bottom:12px;">

  <input type="text" name="name" placeholder="Contact Name" required
    style="width:100%;padding:10px;border:1px solid #ddd;margin-bottom:12px;">

  <input type="email" name="email" placeholder="Email" required
    style="width:100%;padding:10px;border:1px solid #ddd;margin-bottom:12px;">

  <input type="tel" name="phone" placeholder="Phone"
    style="width:100%;padding:10px;border:1px solid #ddd;margin-bottom:12px;">

  <textarea name="products" placeholder="Which products are you interested in?" rows="4" required
    style="width:100%;padding:10px;border:1px solid #ddd;margin-bottom:12px;resize:vertical;"></textarea>

  <button type="submit"
    style="padding:12px 24px;background:#000;color:#fff;border:none;cursor:pointer;">
    Request Quote
  </button>
</form>
Use the _subject hidden field to customize the email notification subject line. This helps you distinguish between different form types in your inbox.