Contact Forms

Adding a contact form to your site is a good way for people to get in touch with you.  You can set it up in ‘Contact’ which is in the backend, on the left hand side menu.

  1. Click on the ‘Add new‘ form
  2. Name the form; I called this one ‘Contact Us’
  3. Make sure the form is setup correctly – it should look something like the image below:
  4. Visit Contact in the backendClick on ‘Mail along the top menu header of Contact forms (see image below)
  5. Set the ‘To‘ email to the email you’d like to receive the message (your email)
  6. Change the ‘From‘ email to: [Project Norfolk Site] <>
  7. The subject line can be something like ‘site contact form’ – this is how it will appear in your inbox if someone uses it.
  8. Update the details of the formSave the changes.
  9. Copy (ctrl+c) the shortcode of the contact form – which you can see highlighted in blue at the top of the form.
  10. Go to ‘Appearance’ then ‘Widgets’ (on the left hand side menu)
  11. Drag a ‘Text’ widget to one of the areas ‘Village sign’ or ‘Primary Widget Area’ or Secondary Widget Area’
    Add the contact form to widgets
  12. Paste the shortcode you copied from the Contact form into the text area in the widget.
  13.  Give the widget a title (I used “Get in touch”)
  14. I also added the paragraph code <p> </p> which gives a space between the title and the form.
  15. Save the widget and go and view it on the front of the site.
  16. Test it works, send yourself a test message
    Check it looks okay on the frontend of the site

Add reCAPTCHA to prevent spam bots

Register with Google to set up a reCAPTCHA API key, this will allow your form to include a little checkbox which prevents bots from spamming your contact form.

Google reCAPTCHA

Once you’ve registered to get your reCAPTCHA API Keys you will need to add your parish site to the domains list on the reCAPTCHA site, under ‘Adding reCAPTCHA to your site’ – you should also see an option called ‘Keys’ which will give you a site key and secret key – 2 sets of characters to use on your parish site.

reCAPTCHA Integration

Then when you’ve added the two keys to your parish site, you will need to go back to Contact forms, and select the ‘reCAPTCHA’ button on the ‘form’ menu section, make sure you place it at the end of the form. Save the updated form, then go and test it on the front end of the site – you shouldn’t be able to send a message without the checkbox checked.

Add reCAPTCHA to your form

Comments are closed.