Skip to content

Website Leads & Statistics

How to Add or Edit a Website Contact Form

A contact form gives visitors a simple way to send your business a message directly from your website. In your Site Before Night website editor, you can add a new Email Form section or update a form that is already on one of your pages.

Adding a new form?

Place an Email Form section where you want visitors to contact you, then personalize its content and appearance.

Editing an existing form?

Open the form section already on your page and continue with the Content and Style steps below.

Add a New Contact Form

  1. Open the page where you want the contact form and scroll to the location where it should appear.
  2. Select + Add New Section.
  3. Choose the Email Form option.
  4. Select Add to Site.

Already have a contact form? You do not need to add another one. Open the existing form section and continue to the Content controls in the next step.

Ls 002 s1 ss1

Edit the Contact Form Content and Fields

Once the Email Form section is on the page—or when you open an existing form—use the Content tab to change what visitors see and what information the form asks them to provide.

Use the Content tab to review:

  • the form title
  • the short description or instructions above the form
  • the fields visitors are asked to complete
  • the form button text and available button settings

Keep the form focused. Ask for the information your business actually needs. If another question is necessary, the form editor includes an + Add Form Field control.

Ls 002 s2 ss1

Adjust How the Contact Form Looks

Open the Style tab when you want to adjust the visual presentation of the form section. The available controls let you coordinate the form with the rest of your website without changing the information the form collects.

Background Review the background color or other supported background options for the section.
Layout Choose the available layout and form presentation that best fits the page.
Spacing Adjust the section's spacing and other available display settings when needed.

Design tip: Keep the form easy to read. Clear labels, comfortable spacing, and good contrast are more important than adding extra visual effects.

Ls 002 s3 ss1

Save and Check Your Contact Form

When you are finished editing the form, select Save in the form editor. Then review the finished page from a visitor's point of view.

Before you finish, check that:

  • the form title and instructions are clear
  • you are only asking visitors for information your business needs
  • the fields and button are easy to understand
  • the form is comfortable to use on a phone as well as a larger screen
  • your saved form looks consistent with the rest of your website

If you made important changes to the form fields, it is also a good idea to send a test submission so you can confirm the form collects the information you expect.

Need a More Advanced Form?

Ordinary contact-form changes can be handled in your website editor. If you need a third-party form service, custom code, a complex integration, or unusual technical functionality, use Site Before Night Technical Help rather than adding custom form code on your own.