How to add a contact form to my website?

Add a contact form to your website to allow your visitors to leave you messages and ask questions.

You’ll be able to respond via chat or manually via email or phone.

How can I add a contact form?

1. When in the Website Builder editor, click on the Add elements button.

2. Drag and drop the Form element into your page content. Note that the editor will highlight the spots where you can drop it.

3. Click on the Contact type of form on the left.

4. Click on the form you want to add to your page.

Where can I find messages sent via my contact form?

Messages sent via any contact form on your website are shown in Chats as new conversations.

You can type your reply directly in the chat window and send it to the email provided by the visitor.

Note: Replies are sent from ‘Chat reply <noreply@contact.getresponse.chat> sender.

How can I change the name of the form?

Type in the Name field to change the name of the form.

This name is for your internal use only to check the website statistics, your visitors won’t see it.

How can I edit fields in my form?

The contact form contains predefined fields that can’t be removed.

Click on the Edit button next to the field you want to adjust. You can type a custom label and decide if the field should be required.

Click on the Save button to save your changes.

How to set up a success view?

Click on the Success view section to choose what will happen after a visitor sends you a message.

Select the Show a message (keeps visitors on the same page) option and add a message you want your visitor to see if you prefer them to stay on the current page.

Use the Redirect to another page or site option if you prefer to use a link.

There are several types of links you can use. Make sure to choose the right type.

• External page or website – use it to link another site with a URL.
• Landing page – select a GetResponse landing page that you want to open.
• Custom protocol – use to it embed protocols.
• Website – select another website created with the GetResponse Website Builder.
• Current website – link to the current website. Choose the page you want it to open.

How to change the form’s design?

Set up design details for labels, fields and buttons in your form in the Design section.

Labels

• Show labels
  Choose if you want to place fields labels inside or above inputs.
  
  
• Mark the required questions with
  Decide if you want to mark required fields with the asterisk* or “required” text.
  
  
• Font, font size, font style, font color
  Select a font type, size, style and color for the labels.

Fields

• Shape
  Choose the sharp, soft or rounded shape of the fields.
  
  
• Size
  Choose from three predefined sizes or click on the … button to enter your own size manually.
  
  
• Font, font size, font style, font color
  Select font type, size, style and colour for the text your visitors will input in the form fields.
  Note: it can be different from the labels font settings.
  
  
• Background color
  Choose the background color of the fields.
  
  
• Error color
  Select a color for the error message.

Click on the Advanced settings section to set up the border, radius and shadow settings of the fields.

Buttons

• Type your custom text for the form’s button in the Button text field.
  
  
• Style
  Select one of the predesigned styles or choose one from our library by clicking on the More styles link.
  
  
• Shape
  Choose the sharp, soft or rounded shape of the button.
  
  
• Size
  Choose from three predefined sizes or click on the … button to enter your own size manually.
  
  
• Alignment
  You can move the whole button to the left, right or centre of the section.

• Advanced settings
  If you want to further adjust your button, click on the link to open advanced settings.
  You can customize font, colours, border, radius, and shadow.

• Reset to default
  To reverse all custom changes, use this link to restore the default button settings.

Block settings

The form block is a framed workspace around your form with a Contact form label on the left. You can only see the frame after clicking on the object. It won’t be visible on your website.

You can customize its color, padding, border, radius, and shadow.

Absolute positioning

Enable this option to move the form to any place on your website.

Hide on mobile devices

Enable this option to hide your form while your page is opened on a mobile device.
You may want to use this option to make your page simpler for mobile users.