search

gatsbyjs / gatsby

The best React-based framework with performance, scalability and security built in.
https://www.gatsbyjs.com
MIT License
55.27k stars 10.32k forks source link

Contact form in Gatsby? 🤔 #12022

Closed omattman closed 5 years ago

omattman commented 5 years ago

How would one go about integrating a contact form in a GatsbyJS application with a headless WP setup?

Been digging around the internet without any luck. Any hints are much appreciated.

Note: Netlify contact form integration is not an option.

TylerBarnes commented 5 years ago

Hey @omattman , I'm not part of gatsby and this is definitely not the gatsby way of doing things but I made a component for WP contact forms in gatsby. Essentially it's an iframe of a WP contact form but the iframe and gatsby send each other messages via post-robot by paypal which is a cross window messaging tool. So gatsby sends a css string to WP and WP sends back it's page height, then react unveils the contact form and removes the placeholder / loader. I made it because forms are so easy in WP and I don't want to have all these disconnected services even if it's part of the JAMstack philosophy. I just want it to be easy and work well enough.

You can see it in action here https://www.thedeckingsuperstore.com/request-a-quote/

Brief docs for it are here https://github.com/TylerBarnes/wordsby/wiki/WordPress-plugins-integration

I made it for my alternative WP source plugin wordsby but you don't need to use wordsby to use it. It'll work with gatsby-source-wordpress. If you're interested you do need to install wordsby-admin in WP and yarn add wordsby-components.

deemaagog commented 5 years ago

You can implement this using AWS lambda functions. Another option is to use services like FormSpree

omattman commented 5 years ago

Thanks for both suggestions @TylerBarnes @deemaagog

I'll have look into the AWS lambda functions. It looks very straight promising 💯

baobabKoodaa commented 5 years ago

I can recommend Google Scripts for this. The instructions are long, but only because it's handholding every step of the way. It will take you less than 30 minutes to set up.

I would advice against FormSpree. I tried them, and I had an issue where my first test submission got through without problems, but subsequent submissions disappeared into a void, all the while users of my webpage saw a "succesful" page not knowing there was any problem. Thankfully, my site is not live yet so no actual damage done. In any case having issues like "data disappears without showing errors anywhere" is not acceptable for a form provider imo.