Mga form na gumagana kahit walang backend
Magdagdag ng isang attribute sa isang form sa static site mo at mapupunta sa dashboard mo ang bawat submission. Walang JavaScript, walang naka-embed na widget, walang third-party service, at walang kailangang sign-up-an ang taong sumasagot.
<form harvis-form="contact"> <input name="email" type="email" required> <textarea name="message"></textarea> <button>Send</button> </form>
Tatlong hakbang, at ang isa doon ay pag-deploy uli
Walang form builder na kailangang matutunan at walang endpoint na kailangang kopyahin. Ang attribute mismo ang buong setup.
- 01
Idagdag ang attribute
Ilagay ang harvis-form sa kahit anong form sa HTML mo. Pangalanan ito kung mahigit isa ang form ng site. Huwag nang ilagay ang action at method — pupunan ang mga iyon habang inihahain ang page.
- 02
I-deploy uli
I-drag uli ang folder, o patakbuhin ang npx harvis. Walang ico-configure, walang key na ipe-paste, walang switch na kailangang buksan muna sa dashboard.
- 03
Basahin ang dumarating
Lalabas ang mga submission sa ilalim ng site mo sa dashboard, pinakabago ang una. Buksan ang isang row para basahin ang buo, o kunin ang lahat bilang CSV.
Dalawang attribute lang ang lahat ng ito
Sinusulat uli ng harvis ang form habang palabas ito ng server, kaya ang page na sinulat mo ay nananatiling ang page na sinulat mo.
<form harvis-form="contact"
data-harvis-redirect="/thanks.html">
<input name="email" type="email" required>
<button>Send</button>
</form><form harvis-form="contact"
data-harvis-redirect="/thanks.html"
action="/__harvis/form/contact" method="post">
<input type="hidden" name="_harvis_redirect" value="/thanks.html">
<input type="text" name="_harvis_hp" tabindex="-1" aria-hidden="true" style="…">
<input name="email" type="email" required>
<button>Send</button>
</form>Ang dalawang attribute
- harvis-form
- Minamarkahan nito ang form bilang kokolektahin. Ang value ang pangalan nito, kaya nananatiling magkahiwalay ang ilang form sa iisang site; kapag walang value, sa ilalim ng “default” ito kinokolekta.
- data-harvis-redirect
- Opsyonal. Ang page sa site mo kung saan dadalhin ang mga tao pagkatapos nilang mag-submit. Binabalewala ang anumang nakaturo sa labas ng site mo.
Ang makukuha mo
Naka-on na ang lahat ng nasa ibaba. Wala ni isang settings page para sa kahit alin sa mga ito.
Walang JavaScript
Nagsu-submit ang form sa paraang matagal nang ginagawa ng HTML. Gumagana pa rin ito kahit naka-block ang mga script, sa mabagal na telepono, at sa browser na teksto lang ang naipapakita.
Nasasala ang spam
Bawat form ay may kasamang pain na field na hindi nakikita ng tao, at tahimik na tinatapon ang anumang pumupuno rito. May rate limit din na naglilimita kung gaano karami ang kayang ipadala ng isang bisita, at ng isang site, sa loob ng isang oras.
Kasindami ng gusto mong form
Pangalanan mo sila — hiwalay ang listahan ng contact form at ng signup form sa iisang site, at puwede mo silang i-filter at i-export nang magkahiwalay.
Sarili mong thank-you page
Ituro ang form sa isang page na ikaw ang gumawa at doon mapupunta ang mga tao pagkatapos mag-submit. Kung wala nito, simpleng confirmation page ang makikita nila.
Mag-export kahit kailan
Isang button lang at makakakuha ka ng CSV na may column para sa bawat field na naipasa na ninuman, kaya kahit dumagdag ng tanong ang form sa gitna ng buhay nito, iisang table pa rin ang bubukas.
Walang sumusunod kahit kanino
Walang tracking script, walang cookie, walang third party sa loob ng page. Hino-hash ang address ng bisita bago itago, at iyon lang ay para lang makilala ng rate limit ang pagkakaiba ng dalawang submission.
Ang mga limitasyon
Sagana para sa isang contact form, at sapat na sikip para hindi mapuno ng script na nakaturo sa site mo ang inbox mo.
- Field kada submission
- 30
- Haba ng isang field
- 5,000 karakter
- Laki ng isang submission
- 64 KB
- Submission kada site
- 60 kada oras
- Submission kada bisita
- 20 kada oras
- Iniingatan kada site
- 1,000, pinakabago ang una
Mga tanong
Ang itinatanong ng mga tao bago maglagay ng form sa static site.
Ano ang static form?
Isang form sa site na walang sariling server. Karaniwan, ibig sabihin nito ay walang mapagpapadalhan ang form, kaya karamihan sa mga static site ay humihiram ng third-party na form service. Inihahain na ng harvis ang bawat page ng site mo, kaya kaya nitong salubungin ang submission habang dumadaan.
Kailangan ko bang marunong mag-code?
Kailangan mo lang makapagdagdag ng isang salita sa isang linya ng HTML. Kung AI ang gumawa ng site mo, pakiusapan mo itong idagdag ang harvis-form attribute sa form — alam nito kung paano, dahil nakasaad iyon sa mga instruction na inilalathala ng harvis para sa mga AI assistant.
Gumagana ba ito kapag naka-off ang JavaScript?
Oo. Iyon nga ang dahilan kaya ganito ito ginawa. Ordinaryong HTML post ang ginagawa ng form at susundan ng browser ang isang redirect pagkatapos, gaya mismo ng paggana ng mga form bago pa umiral ang JavaScript.
Puwede ko bang ipagpatuloy ang sarili kong endpoint o ibang form service?
Oo — huwag mo lang idagdag ang attribute. Ang mga form na walang harvis-form ay inihahain nang eksakto sa pagkasulat mo, pati na ang action. Sa form na mayroon nito, pinapalitan ng harvis ang action, dahil ang pagdaragdag ng attribute ang paraan mo para sabihin kung saan dapat pumunta ang submission.
Puwede bang mag-attach ng file ang mga tao?
Hindi pa. Gumagana pa rin sa bisita ang file input sa isang kinokolektang form, pero hindi iniimbak ang file — ang mga text field lang ang itinatago.
Ano ang mangyayari sa mga submission kapag na-delete ko ang site?
Kasama silang mawawala. Sa site nakakabit ang mga submission, hindi sa isang deploy, kaya nananatili sila kapag nag-deploy ka uli at tuluyang nawawala kapag na-delete ang site. Mag-export muna ng CSV kung gusto mo silang itago.
Mag-online ng site at subukan mo
Libre ang pag-publish at mga dalawang segundo lang. Idagdag ang attribute sa isang form, i-deploy uli, at padalhan ang sarili mo ng test message.