All Collections
Website Builder
Website Elements
Website Builder: How to Add And Manage Contact Forms
Website Builder: How to Add And Manage Contact Forms

Learn how to add a contact form using Hostinger Website Builder

Updated over a week ago

With Hostinger Website Builder, you can easily add a contact form to your site!

Adding a Contact Form

To add contact forms to your website, you can use contact form elements and/or contact form sections.

To add a contact form element, expand the Add element panel on the left. Find the Contact form element and drag and drop it anywhere on your page:

To add a contact form section, click on Add section – you'll see this button on the horizontal border of any section:

From the menu on the left, choose Contact form. Select the preferred section template on the right and click on it – a contact form section will be inserted into your page.

Editing the Contact Form

Click on the contact form element to see more options (edit, duplicate, change visibility, delete, resize, etc.):

Click on Edit form to open its settings:

General

  • Rename the form – if you have multiple forms on your site, form submissions are listed separately for each form

  • Specify an email address for receiving notifications about newly submitted forms

  • View form submissions

Fields

  • Customize fields: add, edit, sort, remove

  • Specify required fields

  • Supported field types:

    • Short answer

    • Paragraph

    • Single choice

    • Multiple choice

Button

  • Rename the “Submit” button

  • Change the button position (alignment)

  • Specify what happens after submitting the form:

    • Show a thank-you message

    • Redirect the user to a particular page within your website

Style

Change the style of the following (select from the dropdown):

  • Button

  • Form fields

  • Background

Animation

Viewing Form Submissions

Once your website visitor submits a contact form, you'll automatically get a notification to the email address that's linked to your Hostinger account.

You can view all the forms that people have submitted through your contact form within the builder. Expand the Website settings panel on the left and go to Form submissions:

Next to the preferred form, click on View list:

Here, you'll find all submissions of a particular form. You can easily export selected forms to a .CSV file and delete the unnecessary ones:

Embedding a Third-Party Contact Form

If you've tried our contact form element but need more features for it, Elfsight is one of many platforms that offer various embeddable widgets, as well as the Contact Form widget.

On Elfsight, you will find a variety of contact form templates. Once you select a template, customize it to your liking:

Once you're finished creating your widget, save it:

Then, click on Add to website and copy the integration code:

Embed the code into your website using the embed code element, and the contact form will be added to your page.

NOTES

  • If you decide to use an Elfsight widget, you will be asked to select an Elfsight plan

  • Using a third-party integration, you won't be able to view form submissions within the website builder

Did this answer your question?