Implement Newsletter Subscription Using Staticman
Dec 12, 2019 · 4 Min Read · 8 Likes · 1 Comment
Collecting data in static sites or serverless sites(with POST request) is a hassle because you don’t have a server to receive POST requests and store data. But Staticman is here to help. It will enable users to make POST requests, that will allow you to gather these data. In this article, I am going to tweak Staticman a little to implement newsletter subscription.
FYI: _I am not going to share how to make a commenting system using Staticman because there are countless examples available on the internet, even from Eduardo Bouças, creator of Staticman._
How ‘Staticman’ works
Before starting anything, you need to understand how Staticman works. First, you have a form, when you submit the form(with any kind of data), it will make a POST request to Staticman server, then the data is sent your git repository. Checkout the following image for understanding it better:

How are we going to tweak ‘Staticman’
What Staticman does when notification is allowed, that it creates a mailing list in mailgun. For each data entry, they create a mailing list/add emails to an existing mailing list. Similarly for newsletter, we need a mailing list. So, we are going to use it to collect email addresses to create a mailing list for newsletter.
Steps for setting up newsletter subscription
Host your ‘Staticman’ server
Default Staticman server is already being over used by many people, so it does not work properly. So, its better to host your own. Checkout this article to install Staticman in Heroku server.
Create a staticman.yml
in your public repository
You need to create a public git repo, there you need to create a staticman.yml
file with following(which has bare minimum settings):
comments:
allowedFields: ["email", "other_fields_if_necessary"]
moderation: true
name: "newsletter-subscription"
requiredFields: ["email"]
notifications:
enabled: true
apiKey: "XXXXXX"
domain: "XXXXXX"
Important thing to remember here is that, you need to allow email
field and also add email
in requiredFields
. You can add additional fields in allowedField
(like if you already have a commenting system them fields like name, comment etc are necessary).
Most crucial part, you must configure mailgun to generate API Key, then put the value in notifications
. Value of API Key and Domain must be base64 encoded.
You can enable moderation to keep the code clean, so when someone submits a newsletter form, it will not be stored in git immediately, instead you can close the Pull Request(because the email is already stored in mailing list).
Setup the form
For newsletter subscription, you need to render a form. For that, you can use the following:
<h1>Newsletter Subscription</h1>
<form id="comment-form" method="post" action="https://your.Staticman.server">
<input
type="hidden"
name="options[redirect]"
value="https://your-domain.com/submitted"
/>
<input
type="hidden"
name="options[parent]"
value="a-random-name-which-will-consistant-in-all-pages"
/>
<input
type="hidden"
name="options[slug]"
value="a-random-name-which-will-consistant-in-all-pages"
/>
<input
type="hidden"
name="options[origin]"
value="https://your-domain.net/"
/>
<input
type="hidden"
name="options[redirectError]"
value="https://your-doamin.net/error"
/>
<input
type="email"
name="fields[email]"
placeholder="Enter your email"
required
/>
<input name="options[subscribe]" type="checkbox" value="email" required /> I
want to receive emails
<button type="submit">Subscribe</button>
</form>
In the form, for input
field you need to make sure you a consistant value for slug and parent in every page where you put this form. Because based on the value of slug
a mailing list will be created.
Push changes
All is done. Now its time for testing. Upload the code to your git repository or serverless hosting(like Netlify) and see how it goes. There for each form submission, a new email will be added to a specific mailing list in mailgun.
After mailing list is created
Now its up to you, you need to create templates and send bulk emails to that mailing list.
In conclusion
Although Staticman is for collecting any kind of data, most of the people use it for a decent commenting system. My idea here was to use Staticman for both commenting and newsletter subscription. In this Article, I wrote about Newsletters(by the way they are GDPR complient), maybe you will find more usage of Staticman.
Useful links
- https://www.gabescode.com/staticman/2019/01/04/staticman-comments-for-jekyll.html
- https://networkhobo.com/hugo-staticman-nested-replies-and-email-notifications/
- https://yasoob.me/posts/running_staticman_on_static_hugo_blog_with_nested_comments/
- https://yasoob.me/posts/staticman_comment_notifications_mailgun/
- https://binarymist.io/blog/2018/02/24/hugo-with-staticman-commenting-and-subscriptions/
Last updated: Feb 15, 2025
Good