Support Netlify spam prevention (#14)

4 files changed, 18 insertions, 1 deletions

diff --git a/README.md b/README.md
index a9e3577..79798d2 100644
--- a/README.md
+++ b/README.md
@@ -74,6 +74,9 @@ params:
     repo:
     issueterm: pathname
     theme: github-light
+  netlify:
+    honeypot: false     # Set to true to add honeypot field in contact form
+    recaptcha: false    # Set to true to add recaptcha challenge in contact form
 
 menu:
   nav:
diff --git a/assets/css/contact.css b/assets/css/contact.css
index 3647b08..5468348 100644
--- a/assets/css/contact.css
+++ b/assets/css/contact.css
@@ -9,6 +9,10 @@
     padding: 0;
   }
 
+  .Contact-hidden {
+    display: none;
+  }
+
   .Contact-item {
     display: flex;
     flex-wrap: wrap;
diff --git a/config.yaml b/config.yaml
index bf3f836..2771607 100644
--- a/config.yaml
+++ b/config.yaml
@@ -15,6 +15,9 @@ params:
     repo:
     issueterm: pathname
     theme: github-light
+  netlify:
+    honeypot: false     # Set to true to add honeypot field in contact form
+    recaptcha: false    # Set to true to add recaptcha challenge in contact form
 
 menu:
   nav:
diff --git a/layouts/shortcodes/contact.html b/layouts/shortcodes/contact.html
index b42c64c..6675cd2 100644
--- a/layouts/shortcodes/contact.html
+++ b/layouts/shortcodes/contact.html
@@ -1,6 +1,12 @@
 {{ resources.Get "css/contact.css" | minify | fingerprint | .Page.Scratch.SetInMap "css" "contact" }}
-<form class="Contact" name="contact" method="POST" netlify{{ with .Get 0 }} action="{{ . }}"{{ end }}>
+<form class="Contact" name="contact" method="POST" netlify{{ if site.Params.netlify.honeypot }} netlify-honeypot="bot"{{ end }}{{ if site.Params.netlify.recaptcha }} netlify-recaptcha{{ end }}{{ with .Get 0 }} action="{{ . }}"{{ end }}>
   <ul class="Contact-group">
+    {{ if site.Params.netlify.honeypot }}
+    <li class="Contact-hidden">
+      <label>Don’t fill this out if you're human:</label>
+      <input name="bot">
+    </li>
+    {{ end }}
     <li class="Contact-item">
       <label class="Contact-label" for="Contact-name">Name:</label>
       <input class="Contact-input" id="Contact-name" type="text" name="name" autofocus>
@@ -17,6 +23,7 @@
       <label class="Contact-label" for="Contact-message">Message:</label>
       <textarea class="Contact-input Contact-input--textbox" id="Contact-message" name="message"></textarea>
     </li>
+    {{ if site.Params.netlify.recaptcha }}<div netlify-recaptcha></div>{{ end }}
     <li class="Contact-item">
       <button class="Contact-button" type="submit">Send</button>
     </li>