Hugo Form Integration
Hugo is a popular static site generator. Common uses include:
- blogs
- portfolios
- documentation websites.
In fact, the documentation you’re reading now is made using Hugo!
Why Integrate GoodSheet.io with Hugo?
Hugo generates static websites, which means it’s great for speed and simplicity. But static sites can sometimes feel limiting when you want to collect information from your viewers. That’s where GoodSheet.io steps in:
- Form Handling Simplified: GoodSheet.io allows you to handle form submissions effortlessly, storing data directly in Google Sheets for secure and easy access.
- No Backend Needed: You don’t need to set up a server or database to handle form submissions. GoodSheet.io provides a simple and reliable solution.
Instructions
1. Create a GoodSheet.io Account
First, you’ll need a GoodSheet.io account. Sign up for free and create your first form. Once the form is created, a unique endpoint for submissions will be generated, which we’ll use later.
2. Create or Navigate Your Hugo Site
If you already have a Hugo site, skip ahead. If you’re new to Hugo, you can set up a Hugo site in just a few minutes:
hugo new site my-hugo-site
cd my-hugo-site
hugo server
3. Add the HTML Form to Hugo
Next, you need to add the form to your Hugo site. This can be done in any page or template where you want the form to appear. Here’s a basic HTML form you can copy:
<form action="https://gdsht.app/s/{your-form-key}" method="POST">
<label for="name">Name:</label>
<input type="text" id="name" name="name" required>
<label for="email">Email:</label>
<input type="email" id="email" name="email" required>
<input type="submit" value="Submit">
</form>
Replace {your-form-key}
with the Form Action for your form in GoodSheet.io.
You can place this code inside any Hugo template file (such as an _index.md
or other custom page).
If you’re still in development, make sure to test the form locally by running the Hugo server:
hugo server
Once you deploy the changes to your site, it the form should be live and functioning with GoodSheet.io taking care of the submissions!