Forms are an essential part of almost every website. By default, you can not use forms on a static website as they require some sort of server-side processing. That’s why I build a solution for that right into Simply Static.
Navigate to Simply Static Forms and create a new integration. Currently Simply Static supports Forms created by Contact Form 7 and Gravity Forms. You can also use one of the several external services like Zapier, Formspree, or IFTTT.
Example with Contact Form 7
To keep things simple we do a simple example with Contact Form 7 and create an integration for it within Simply Static.
I created a simple form in Contact Form 7 which looks like that:
You can use pretty much every field you can imagine within Contact Form 7. The only thing here you have to keep in mind is the names of your “name” attributes as we need them for the next step in making the integration in Simply Static.
Create the integration
Now we head back to Simply Static -> Forms and create a new integration form here.
First, we choose “Contact Form 7” as the tool. Then we add the form id from Contact Form 7 to the next field. This ensures we submit the correct form on your static website.
Next, we add the form field with the name attribute “your-subject” to the subject. This is the subject of the mail you will get after someone submits the form.
Next, we fill out the name attributes field. Here we add a comma-separated list of all name attributes you want to be included in the send mails.
This ensures that get only the data you want and not everything that’s provided within a Contact Form 7 submission.
Now we switch over to the right side of the settings.
Add the e-mail address you want the get the mails send to. Then you have to provide a webhook to send the request to.
Luckily Simply Static provides a ready solution for you, just copy the link from “Simply Static Endpoint” and add it to the field.
Make sure you have configured the details in Simply Static -> Settings -> CORS to make sure everything is working correctly.
Finally, you should add a redirect URL to a “Thank You” page to inform your visitor that the form was successfully sent. This is required because you can not use the build-in submission confirmation from Contact Form 7 as you don’t have access to AJAX on your static website.
That’s it, now you can use (and test) your contact form on your static website. You should get an e-mail that contains all information you have added within the name attributes setting.