RyanFitzgerald / devportfolio

A lightweight, customizable single-page personal portfolio website template built with JavaScript and Sass

Home Page:https://ryanfitzgerald.github.io/devportfolio

Geek Repo:Geek Repo

Github PK Tool:Github PK Tool

Limit spam with the contact form

incyclum opened this issue · comments

As stated on https://formspree.io/ you can add <input type="text" name="_gotcha" style="display:none" /> to the contact form.

Add this "honeypot" field to avoid spam by fooling scrapers. If a value is provided, the submission will be silently ignored. The input should be hidden with CSS.

You can also follow this tip from https://webdesign.tutsplus.com/tutorials/quick-tip-add-a-formspree-form-to-your-static-sites--cms-23870 to avoid email scraping.

<script>
    var contactform =  document.getElementById('contactform');
    contactform.setAttribute('action', '//formspree.io/' + 'your' + '@' + 'email' + '.' + 'com');
</script>

The honeypot field was originally omitted since it isn't really necessary due to their built in reCAPTCHA, but it does provide an additional layer of filtering that some may wish to have. Similarly, with the email scraping JS snippet, although it provides an additional layer of security, overall I think there is a bit of a trade-off in terms of reducing email scraping versus having your form be functional with no JS. Overall, I decided to simply include a link to that tutsplus tutorial and leave that choice up to the individual users.