Contact

Communication is the cornerstone of almost any website, especially business sites. With Wowchemy, you can easily add communicate elements including a contact form, social messaging links, appointment booking, and a map to your website. A well-designed contact section is essential to network with other people, spark new business, and increase conversions.

The contact widget will automatically display the following information according to what you entered in config/_default/params.yaml:

  • contact form or an email link (see section below)
  • contact links such as for Twitter, Skype, Weixin, Weibo, Discussion Forums, etc.
  • phone number
  • address
  • office hours
  • appointment booking link
  • map

In the Academic template, you can find an example Contact widget at content/home/contact.md.

Example Contact widget YAML front matter prior to Wowchemy v5.0.0.beta1:

widget: contact
headless: true  # This file represents a page section.

# ... Put Your Section Options Here (title etc.) ...

# Automatically link email and phone?
autolink: true

# Email form provider
#   0: Disable email form
#   1: Netlify (requires that the site is hosted by Netlify)
#   2: formspree.io
email_form: 2

Example Contact widget YAML front matter for Wowchemy v5.0.0.beta1+:

widget: contact
headless: true  # This file represents a page section.

# ... Put Your Section Options Here (title etc.) ...

content:
  # Automatically link email and phone or display as text?
  autolink: true
  
  # Email form provider
  form:
    provider: netlify
    formspree:
      id:
    netlify:
      # Enable CAPTCHA challenge to reduce spam?
      captcha: true

Wowchemy enables you to use a wide range of icons in your contact links. Learn more about icons.

Contact form

For email there are three options. You can display either:

  • an email link
  • a contact form by Netlify (default)
  • a contact form by Formspree

By using a contact form, there’s no need to provide your email in config/_default/params.yaml, protecting your address from spammers.

Option 1: Email link

Enter an email address in params.yaml and remove the form settings from your contact widget to not use any form.

Option 2: Netlify

The Netlify option is only available if you are hosting your site with Netlify.

To use, set the provider to netlify:

content:
  form:
    provider: netlify
    netlify:
      captcha: true

In this case, user messages to you will be sent to your Netlify account admin panel.

A webhook can be created in your Netlify account if you wish to forward messages to your email address.

Captcha is enabled by default so that visitors can send you email and spam from bots is prevented.

Read more in the Netlify docs.

Option 3: Formspree

Register with Formspree for a Form ID.

Add the Form ID to your widget front matter:

content:
  form:
    provider: formspree
    formspree:
      id: yourID

Captcha

Both Formspree and Netlify forms can use Google reCAPTCHA to prevent spam from bots. However, China is known to block Google reCAPTCHA, so visitors in China may be unable to submit such a form. To prevent this, there is the Netlify option above to disable Captcha and Formspree offer a paid plan to disable reCAPTCHA.

Previous
Next