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 Ghost
Ghost is a great publishing platform, but it doesn’t have built-in forms. Spike adds:
- Contact forms, feedback forms, or any custom form
- Unlimited submissions on the free plan
- Email notifications on every submission
- Spam protection (honeypot, reCAPTCHA, Turnstile)
- Webhooks and 21+ integrations
- No plugins or third-party apps needed
Setup Steps
Add HTML Card
In the Ghost editor, type /html to insert an HTML card.
Paste Form HTML
Paste your Spike form HTML into the card.
Publish
Publish or update your post/page.
Paste this into a Ghost HTML card:
<form action="https://api.spike.ac/f/YOUR_FORM_SLUG" method="POST" style="max-width:500px;margin:0 auto;font-family:inherit;">
<input type="text" name="_gotcha" style="display:none">
<div style="margin-bottom:16px;">
<label style="display:block;font-size:14px;margin-bottom:4px;font-weight:600;">Name</label>
<input type="text" name="name" required
style="width:100%;padding:10px;border:1px solid #e1e1e1;border-radius:4px;font-size:15px;">
</div>
<div style="margin-bottom:16px;">
<label style="display:block;font-size:14px;margin-bottom:4px;font-weight:600;">Email</label>
<input type="email" name="email" required
style="width:100%;padding:10px;border:1px solid #e1e1e1;border-radius:4px;font-size:15px;">
</div>
<div style="margin-bottom:16px;">
<label style="display:block;font-size:14px;margin-bottom:4px;font-weight:600;">Message</label>
<textarea name="message" rows="5" required
style="width:100%;padding:10px;border:1px solid #e1e1e1;border-radius:4px;font-size:15px;resize:vertical;"></textarea>
</div>
<button type="submit"
style="padding:12px 24px;background:#000;color:#fff;border:none;border-radius:4px;font-size:15px;cursor:pointer;">
Send Message
</button>
</form>
Add a quick feedback form at the end of your posts:
<div style="border-top:1px solid #eee;padding-top:24px;margin-top:32px;max-width:500px;">
<h4 style="margin-bottom:8px;">Was this helpful?</h4>
<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="Post Feedback">
<textarea name="feedback" placeholder="Share your thoughts..." rows="3" required
style="width:100%;padding:10px;border:1px solid #e1e1e1;border-radius:4px;font-size:14px;margin-bottom:12px;resize:vertical;"></textarea>
<input type="email" name="email" placeholder="Email (optional)"
style="width:100%;padding:10px;border:1px solid #e1e1e1;border-radius:4px;font-size:14px;margin-bottom:12px;">
<button type="submit"
style="padding:10px 20px;background:#000;color:#fff;border:none;border-radius:4px;font-size:14px;cursor:pointer;">
Send Feedback
</button>
</form>
</div>
Theme Integration
For a site-wide contact form, add it directly to your Ghost theme. Edit your theme’s contact.hbs (or create a custom template):
{{!-- contact.hbs --}}
{{!< default}}
<main class="site-main">
<article class="post">
<header class="post-header">
<h1 class="post-title">Contact Us</h1>
</header>
<div class="post-content">
<form action="https://api.spike.ac/f/YOUR_FORM_SLUG" method="POST">
<input type="text" name="_gotcha" style="display:none">
<p><label>Name</label><input type="text" name="name" required></p>
<p><label>Email</label><input type="email" name="email" required></p>
<p><label>Message</label><textarea name="message" rows="5" required></textarea></p>
<button type="submit">Send</button>
</form>
</div>
</article>
</main>
Ghost HTML cards render raw HTML, so font-family: inherit will pick up your theme’s typography.