How to add a contact form to a website page

You can add a contact form to a custom page on your website by inserting the Contact block, available from the page's edit mode. This article explains how to add the contact block, configure it and customize its appearance.

This article covers the following:

• Where to find the Contact block on a custom page
• How to add and configure a contact form
• How to customize the appearance of the Contact block

Where to find the Contact block on a custom page

1. Go to Website > Menus and Pages.
2. Find the custom page you want to edit (identified by the icon) and hover over the three horizontal dots .
3. Click Edit page.

The page now appears in edit mode.

If you're logged in as an Administrator and browsing your site in preview mode, you can also click the Edit page button at the top of any page to go straight to edit mode.

How to add and configure a contact form

Step 1. In edit mode, drag the Contact block and drop it onto the page grid.

Step 2. In the window that opens, fill in:

• the form title;
• the recipient — the email address of the person who will receive messages submitted through the form.

Step 3. Click Save in the top left corner of the editing page. The contact form now appears on your custom page.

To learn how to add a block to a page in general, see the article Adding pre-configured elements to a custom page.

How to customize the appearance of the Contact block

Once the Contact block is selected, an options menu appears at the top of the left-hand panel. If this menu doesn't appear, click the Contact block to select it.

• Edit: change the title or email address you entered (you can also access this by double-clicking the block).
• Delete: remove the block from the page.
• Choose a background: change the block's background color.
• Choose a border: add a border and adjust its thickness and color.
• Round the corners: round the block's corners.
• Outer margins: adjust the spacing around the block.
• Inner margins: adjust the spacing inside the block.
• Duplicate: create an identical copy of the block in a new editing window.

Go further:

• Creating a custom page on your Springly website
• Adding pre-configured elements to a custom page