{"id":20805,"date":"2021-08-18T18:08:24","date_gmt":"2021-08-18T10:08:24","guid":{"rendered":"https:\/\/www.exabytes.sg\/blog\/?p=20805"},"modified":"2022-06-01T15:58:56","modified_gmt":"2022-06-01T07:58:56","slug":"how-to-create-a-detailed-contact-form","status":"publish","type":"post","link":"https:\/\/www.exabytes.sg\/blog\/how-to-create-a-detailed-contact-form\/","title":{"rendered":"How to Create a Detailed Contact Form in WordPress"},"content":{"rendered":"<p><img data-recalc-dims=\"1\" decoding=\"async\" class=\"alignnone wp-image-20806 size-full\" src=\"https:\/\/i0.wp.com\/www.exabytes.sg\/blog\/wp-content\/uploads\/2021\/08\/1200X628-sg2021-createform.jpeg?resize=696%2C364&#038;ssl=1\" alt=\"How to Create a Detailed Contact Form\" width=\"696\" height=\"364\" srcset=\"https:\/\/i0.wp.com\/www.exabytes.sg\/blog\/wp-content\/uploads\/2021\/08\/1200X628-sg2021-createform.jpeg?w=1200&amp;ssl=1 1200w, https:\/\/i0.wp.com\/www.exabytes.sg\/blog\/wp-content\/uploads\/2021\/08\/1200X628-sg2021-createform.jpeg?resize=300%2C157&amp;ssl=1 300w, https:\/\/i0.wp.com\/www.exabytes.sg\/blog\/wp-content\/uploads\/2021\/08\/1200X628-sg2021-createform.jpeg?resize=1024%2C536&amp;ssl=1 1024w, https:\/\/i0.wp.com\/www.exabytes.sg\/blog\/wp-content\/uploads\/2021\/08\/1200X628-sg2021-createform.jpeg?resize=768%2C402&amp;ssl=1 768w, https:\/\/i0.wp.com\/www.exabytes.sg\/blog\/wp-content\/uploads\/2021\/08\/1200X628-sg2021-createform.jpeg?resize=696%2C364&amp;ssl=1 696w, https:\/\/i0.wp.com\/www.exabytes.sg\/blog\/wp-content\/uploads\/2021\/08\/1200X628-sg2021-createform.jpeg?resize=1068%2C559&amp;ssl=1 1068w, https:\/\/i0.wp.com\/www.exabytes.sg\/blog\/wp-content\/uploads\/2021\/08\/1200X628-sg2021-createform.jpeg?resize=803%2C420&amp;ssl=1 803w, https:\/\/i0.wp.com\/www.exabytes.sg\/blog\/wp-content\/uploads\/2021\/08\/1200X628-sg2021-createform.jpeg?resize=218%2C114&amp;ssl=1 218w\" sizes=\"(max-width: 696px) 100vw, 696px\" \/><\/p>\n<h3><strong>How to Create A Detailed Contact Form with FluentForm<\/strong><\/h3>\n<p><span style=\"font-weight: 400;\">Planning to create a detailed contact form for your website especially <a href=\"https:\/\/www.exabytes.sg\/web-hosting\/wordpress-hosting\" target=\"_blank\" rel=\"noopener\">WordPress hosted website<\/a> but do not know the best solution to it? <\/span><\/p>\n<p><span style=\"font-weight: 400;\">In this article, we will be guiding you how to create a detailed contact form with free WordPress plugin that does not slow down your website.<\/span><\/p>\n<p><span style=\"font-weight: 400;\">Let\u2019s get started!<\/span><\/p>\n<p><span style=\"font-weight: 400;\">The first thing you would need to do is to install <\/span><a href=\"https:\/\/wordpress.org\/plugins\/fluentform\/\" target=\"_blank\" rel=\"noopener\" data-schema-attribute=\"\"><span style=\"font-weight: 400;\">FluentForm<\/span><\/a><span style=\"font-weight: 400;\"> into your WordPress account. <\/span><\/p>\n<p><span style=\"font-weight: 400;\">FluentForm is a freemium WordPress plugin, if you are not looking at those advanced forms with multiple steps, the free version is able to get the job done!<\/span><\/p>\n<p><span style=\"font-weight: 400;\">Once you\u2019ve successfully installed FluentForm, we\u2019ll start with the first step, which is to create your first contact form.<\/span><\/p>\n<h2><b>Step 1: Create a new form with FluentForm<\/b><\/h2>\n<p><span style=\"font-weight: 400;\">To create a new form, navigate to \u201c<\/span><b>FluentForm<\/b><span style=\"font-weight: 400;\"> &gt; <\/span><b>New Form<\/b><span style=\"font-weight: 400;\">\u201d. After clicking it, you\u2019ll see a popup as shown below. In FluentForm, the team has created some default forms for different purposes.\u00a0<\/span><\/p>\n<p><img data-recalc-dims=\"1\" decoding=\"async\" class=\"alignnone wp-image-20807 size-full\" src=\"https:\/\/i0.wp.com\/www.exabytes.sg\/blog\/wp-content\/uploads\/2021\/08\/Contact-Form-Options.jpg?resize=696%2C360&#038;ssl=1\" alt=\"\" width=\"696\" height=\"360\" srcset=\"https:\/\/i0.wp.com\/www.exabytes.sg\/blog\/wp-content\/uploads\/2021\/08\/Contact-Form-Options.jpg?w=1200&amp;ssl=1 1200w, https:\/\/i0.wp.com\/www.exabytes.sg\/blog\/wp-content\/uploads\/2021\/08\/Contact-Form-Options.jpg?resize=300%2C155&amp;ssl=1 300w, https:\/\/i0.wp.com\/www.exabytes.sg\/blog\/wp-content\/uploads\/2021\/08\/Contact-Form-Options.jpg?resize=1024%2C529&amp;ssl=1 1024w, https:\/\/i0.wp.com\/www.exabytes.sg\/blog\/wp-content\/uploads\/2021\/08\/Contact-Form-Options.jpg?resize=768%2C397&amp;ssl=1 768w, https:\/\/i0.wp.com\/www.exabytes.sg\/blog\/wp-content\/uploads\/2021\/08\/Contact-Form-Options.jpg?resize=696%2C360&amp;ssl=1 696w, https:\/\/i0.wp.com\/www.exabytes.sg\/blog\/wp-content\/uploads\/2021\/08\/Contact-Form-Options.jpg?resize=1068%2C552&amp;ssl=1 1068w, https:\/\/i0.wp.com\/www.exabytes.sg\/blog\/wp-content\/uploads\/2021\/08\/Contact-Form-Options.jpg?resize=813%2C420&amp;ssl=1 813w, https:\/\/i0.wp.com\/www.exabytes.sg\/blog\/wp-content\/uploads\/2021\/08\/Contact-Form-Options.jpg?resize=218%2C114&amp;ssl=1 218w\" sizes=\"(max-width: 696px) 100vw, 696px\" \/><\/p>\n<p><span style=\"font-weight: 400;\">If you are looking for more advanced options, you can subscribe to FluentForm PRO, which gives you these additional options:-<\/span><\/p>\n<ul>\n<li style=\"font-weight: 400;\" aria-level=\"1\"><span style=\"font-weight: 400;\">Product Order Form<\/span><\/li>\n<li style=\"font-weight: 400;\" aria-level=\"1\"><span style=\"font-weight: 400;\">Online Service Order Form<\/span><\/li>\n<li style=\"font-weight: 400;\" aria-level=\"1\"><span style=\"font-weight: 400;\">Online Donation Form<\/span><\/li>\n<li style=\"font-weight: 400;\" aria-level=\"1\"><span style=\"font-weight: 400;\">Order Bump Example Form<\/span><\/li>\n<li style=\"font-weight: 400;\" aria-level=\"1\"><span style=\"font-weight: 400;\">Student Survey Form<\/span><\/li>\n<li style=\"font-weight: 400;\" aria-level=\"1\"><span style=\"font-weight: 400;\">Classroom Observation Form<\/span><\/li>\n<li style=\"font-weight: 400;\" aria-level=\"1\"><span style=\"font-weight: 400;\">Course Evaluation Survey Form<\/span><\/li>\n<li style=\"font-weight: 400;\" aria-level=\"1\"><span style=\"font-weight: 400;\">University Enrolment Form<\/span><\/li>\n<li style=\"font-weight: 400;\" aria-level=\"1\"><span style=\"font-weight: 400;\">High School Transcript Request Form<\/span><\/li>\n<li style=\"font-weight: 400;\" aria-level=\"1\"><span style=\"font-weight: 400;\">Conference Proposal<\/span><\/li>\n<li style=\"font-weight: 400;\" aria-level=\"1\"><span style=\"font-weight: 400;\">Admission Form<\/span><\/li>\n<li style=\"font-weight: 400;\" aria-level=\"1\"><span style=\"font-weight: 400;\">Client Satisfaction Survey Form<\/span><\/li>\n<li style=\"font-weight: 400;\" aria-level=\"1\"><span style=\"font-weight: 400;\">Customer Complaint Form<\/span><\/li>\n<li style=\"font-weight: 400;\" aria-level=\"1\"><span style=\"font-weight: 400;\">Market Research Survey Form<\/span><\/li>\n<li style=\"font-weight: 400;\" aria-level=\"1\"><span style=\"font-weight: 400;\">Pricing Survey Form<\/span><\/li>\n<li style=\"font-weight: 400;\" aria-level=\"1\"><span style=\"font-weight: 400;\">Workshop Registration Form<\/span><\/li>\n<li style=\"font-weight: 400;\" aria-level=\"1\"><span style=\"font-weight: 400;\">Donation Form<\/span><\/li>\n<li style=\"font-weight: 400;\" aria-level=\"1\"><span style=\"font-weight: 400;\">Website Feedback Form<\/span><\/li>\n<li style=\"font-weight: 400;\" aria-level=\"1\"><span style=\"font-weight: 400;\">Many many more\u2026<\/span><\/li>\n<\/ul>\n<p><span style=\"font-weight: 400;\">In this article, we will be using one of the default forms &#8211; <\/span><b>Contact Form<\/b><span style=\"font-weight: 400;\"> as an example. <\/span><\/p>\n<p><span style=\"font-weight: 400;\">To use the default form, all you need to do is hover towards that element and click on the \u201c<\/span><b>Create Form<\/b><span style=\"font-weight: 400;\">\u201d<\/span><\/p>\n<p><img data-recalc-dims=\"1\" decoding=\"async\" class=\"alignnone wp-image-20808 size-full\" src=\"https:\/\/i0.wp.com\/www.exabytes.sg\/blog\/wp-content\/uploads\/2021\/08\/Contact-Form-Default-Form.jpg?resize=696%2C360&#038;ssl=1\" alt=\"\" width=\"696\" height=\"360\" srcset=\"https:\/\/i0.wp.com\/www.exabytes.sg\/blog\/wp-content\/uploads\/2021\/08\/Contact-Form-Default-Form.jpg?w=1200&amp;ssl=1 1200w, https:\/\/i0.wp.com\/www.exabytes.sg\/blog\/wp-content\/uploads\/2021\/08\/Contact-Form-Default-Form.jpg?resize=300%2C155&amp;ssl=1 300w, https:\/\/i0.wp.com\/www.exabytes.sg\/blog\/wp-content\/uploads\/2021\/08\/Contact-Form-Default-Form.jpg?resize=1024%2C529&amp;ssl=1 1024w, https:\/\/i0.wp.com\/www.exabytes.sg\/blog\/wp-content\/uploads\/2021\/08\/Contact-Form-Default-Form.jpg?resize=768%2C397&amp;ssl=1 768w, https:\/\/i0.wp.com\/www.exabytes.sg\/blog\/wp-content\/uploads\/2021\/08\/Contact-Form-Default-Form.jpg?resize=696%2C360&amp;ssl=1 696w, https:\/\/i0.wp.com\/www.exabytes.sg\/blog\/wp-content\/uploads\/2021\/08\/Contact-Form-Default-Form.jpg?resize=1068%2C552&amp;ssl=1 1068w, https:\/\/i0.wp.com\/www.exabytes.sg\/blog\/wp-content\/uploads\/2021\/08\/Contact-Form-Default-Form.jpg?resize=813%2C420&amp;ssl=1 813w, https:\/\/i0.wp.com\/www.exabytes.sg\/blog\/wp-content\/uploads\/2021\/08\/Contact-Form-Default-Form.jpg?resize=218%2C114&amp;ssl=1 218w\" sizes=\"(max-width: 696px) 100vw, 696px\" \/><\/p>\n<p><span style=\"font-weight: 400;\">After clicking it, you\u2019ll be able to see a form like the one shown below.<\/span><\/p>\n<p><img data-recalc-dims=\"1\" decoding=\"async\" class=\"alignnone wp-image-20809 size-full\" src=\"https:\/\/i0.wp.com\/www.exabytes.sg\/blog\/wp-content\/uploads\/2021\/08\/Contact-Form-Fluent-Form-Settings.jpg?resize=696%2C360&#038;ssl=1\" alt=\"\" width=\"696\" height=\"360\" srcset=\"https:\/\/i0.wp.com\/www.exabytes.sg\/blog\/wp-content\/uploads\/2021\/08\/Contact-Form-Fluent-Form-Settings.jpg?w=1200&amp;ssl=1 1200w, https:\/\/i0.wp.com\/www.exabytes.sg\/blog\/wp-content\/uploads\/2021\/08\/Contact-Form-Fluent-Form-Settings.jpg?resize=300%2C155&amp;ssl=1 300w, https:\/\/i0.wp.com\/www.exabytes.sg\/blog\/wp-content\/uploads\/2021\/08\/Contact-Form-Fluent-Form-Settings.jpg?resize=1024%2C529&amp;ssl=1 1024w, https:\/\/i0.wp.com\/www.exabytes.sg\/blog\/wp-content\/uploads\/2021\/08\/Contact-Form-Fluent-Form-Settings.jpg?resize=768%2C397&amp;ssl=1 768w, https:\/\/i0.wp.com\/www.exabytes.sg\/blog\/wp-content\/uploads\/2021\/08\/Contact-Form-Fluent-Form-Settings.jpg?resize=696%2C360&amp;ssl=1 696w, https:\/\/i0.wp.com\/www.exabytes.sg\/blog\/wp-content\/uploads\/2021\/08\/Contact-Form-Fluent-Form-Settings.jpg?resize=1068%2C552&amp;ssl=1 1068w, https:\/\/i0.wp.com\/www.exabytes.sg\/blog\/wp-content\/uploads\/2021\/08\/Contact-Form-Fluent-Form-Settings.jpg?resize=813%2C420&amp;ssl=1 813w, https:\/\/i0.wp.com\/www.exabytes.sg\/blog\/wp-content\/uploads\/2021\/08\/Contact-Form-Fluent-Form-Settings.jpg?resize=218%2C114&amp;ssl=1 218w\" sizes=\"(max-width: 696px) 100vw, 696px\" \/><\/p>\n<p><span style=\"font-weight: 400;\">Here, you can see that there are quite some options for you to add into your form. <\/span><\/p>\n<p><span style=\"font-weight: 400;\">You can include details such as Name, Email Address, Dropdown, Checkbox, Website URL, and many more. These elements are more than enough to create a decent form.<\/span><\/p>\n<p><span style=\"font-weight: 400;\">To add in a new input (eg. Website URL), all you need to do is drag it into the form, just like how you do it with Elementor.\u00a0<\/span><\/p>\n<p><span style=\"font-weight: 400;\">If you wish to make your form to have two column so that it won\u2019t look lengthy, you can easily do so by going to \u201c<\/span><b>Container<\/b><span style=\"font-weight: 400;\">\u201d and dragging \u201c<\/span><b>Two Column Container<\/b><span style=\"font-weight: 400;\">\u201d into your form.<\/span><\/p>\n<p><img data-recalc-dims=\"1\" decoding=\"async\" class=\"alignnone wp-image-20810 size-full\" src=\"https:\/\/i0.wp.com\/www.exabytes.sg\/blog\/wp-content\/uploads\/2021\/08\/Contact-Form-Multiple-Column.jpg?resize=696%2C360&#038;ssl=1\" alt=\"\" width=\"696\" height=\"360\" srcset=\"https:\/\/i0.wp.com\/www.exabytes.sg\/blog\/wp-content\/uploads\/2021\/08\/Contact-Form-Multiple-Column.jpg?w=1200&amp;ssl=1 1200w, https:\/\/i0.wp.com\/www.exabytes.sg\/blog\/wp-content\/uploads\/2021\/08\/Contact-Form-Multiple-Column.jpg?resize=300%2C155&amp;ssl=1 300w, https:\/\/i0.wp.com\/www.exabytes.sg\/blog\/wp-content\/uploads\/2021\/08\/Contact-Form-Multiple-Column.jpg?resize=1024%2C529&amp;ssl=1 1024w, https:\/\/i0.wp.com\/www.exabytes.sg\/blog\/wp-content\/uploads\/2021\/08\/Contact-Form-Multiple-Column.jpg?resize=768%2C397&amp;ssl=1 768w, https:\/\/i0.wp.com\/www.exabytes.sg\/blog\/wp-content\/uploads\/2021\/08\/Contact-Form-Multiple-Column.jpg?resize=696%2C360&amp;ssl=1 696w, https:\/\/i0.wp.com\/www.exabytes.sg\/blog\/wp-content\/uploads\/2021\/08\/Contact-Form-Multiple-Column.jpg?resize=1068%2C552&amp;ssl=1 1068w, https:\/\/i0.wp.com\/www.exabytes.sg\/blog\/wp-content\/uploads\/2021\/08\/Contact-Form-Multiple-Column.jpg?resize=813%2C420&amp;ssl=1 813w, https:\/\/i0.wp.com\/www.exabytes.sg\/blog\/wp-content\/uploads\/2021\/08\/Contact-Form-Multiple-Column.jpg?resize=218%2C114&amp;ssl=1 218w\" sizes=\"(max-width: 696px) 100vw, 696px\" \/><\/p>\n<p><span style=\"font-weight: 400;\">After doing so, it will look something like the image shown below.\u00a0<\/span><\/p>\n<p><img data-recalc-dims=\"1\" decoding=\"async\" class=\"alignnone wp-image-20811 size-full\" src=\"https:\/\/i0.wp.com\/www.exabytes.sg\/blog\/wp-content\/uploads\/2021\/08\/Contact-Form-2-Column.jpg?resize=696%2C360&#038;ssl=1\" alt=\"\" width=\"696\" height=\"360\" srcset=\"https:\/\/i0.wp.com\/www.exabytes.sg\/blog\/wp-content\/uploads\/2021\/08\/Contact-Form-2-Column.jpg?w=1200&amp;ssl=1 1200w, https:\/\/i0.wp.com\/www.exabytes.sg\/blog\/wp-content\/uploads\/2021\/08\/Contact-Form-2-Column.jpg?resize=300%2C155&amp;ssl=1 300w, https:\/\/i0.wp.com\/www.exabytes.sg\/blog\/wp-content\/uploads\/2021\/08\/Contact-Form-2-Column.jpg?resize=1024%2C529&amp;ssl=1 1024w, https:\/\/i0.wp.com\/www.exabytes.sg\/blog\/wp-content\/uploads\/2021\/08\/Contact-Form-2-Column.jpg?resize=768%2C397&amp;ssl=1 768w, https:\/\/i0.wp.com\/www.exabytes.sg\/blog\/wp-content\/uploads\/2021\/08\/Contact-Form-2-Column.jpg?resize=696%2C360&amp;ssl=1 696w, https:\/\/i0.wp.com\/www.exabytes.sg\/blog\/wp-content\/uploads\/2021\/08\/Contact-Form-2-Column.jpg?resize=1068%2C552&amp;ssl=1 1068w, https:\/\/i0.wp.com\/www.exabytes.sg\/blog\/wp-content\/uploads\/2021\/08\/Contact-Form-2-Column.jpg?resize=813%2C420&amp;ssl=1 813w, https:\/\/i0.wp.com\/www.exabytes.sg\/blog\/wp-content\/uploads\/2021\/08\/Contact-Form-2-Column.jpg?resize=218%2C114&amp;ssl=1 218w\" sizes=\"(max-width: 696px) 100vw, 696px\" \/><\/p>\n<p><span style=\"font-weight: 400;\">Then, you can drag any input you wish to have there.\u00a0<\/span><\/p>\n<p><img data-recalc-dims=\"1\" decoding=\"async\" class=\"alignnone wp-image-20812 size-full\" src=\"https:\/\/i0.wp.com\/www.exabytes.sg\/blog\/wp-content\/uploads\/2021\/08\/Contact-Form-2-Column-with-input.jpg?resize=696%2C360&#038;ssl=1\" alt=\"\" width=\"696\" height=\"360\" srcset=\"https:\/\/i0.wp.com\/www.exabytes.sg\/blog\/wp-content\/uploads\/2021\/08\/Contact-Form-2-Column-with-input.jpg?w=1200&amp;ssl=1 1200w, https:\/\/i0.wp.com\/www.exabytes.sg\/blog\/wp-content\/uploads\/2021\/08\/Contact-Form-2-Column-with-input.jpg?resize=300%2C155&amp;ssl=1 300w, https:\/\/i0.wp.com\/www.exabytes.sg\/blog\/wp-content\/uploads\/2021\/08\/Contact-Form-2-Column-with-input.jpg?resize=1024%2C529&amp;ssl=1 1024w, https:\/\/i0.wp.com\/www.exabytes.sg\/blog\/wp-content\/uploads\/2021\/08\/Contact-Form-2-Column-with-input.jpg?resize=768%2C397&amp;ssl=1 768w, https:\/\/i0.wp.com\/www.exabytes.sg\/blog\/wp-content\/uploads\/2021\/08\/Contact-Form-2-Column-with-input.jpg?resize=696%2C360&amp;ssl=1 696w, https:\/\/i0.wp.com\/www.exabytes.sg\/blog\/wp-content\/uploads\/2021\/08\/Contact-Form-2-Column-with-input.jpg?resize=1068%2C552&amp;ssl=1 1068w, https:\/\/i0.wp.com\/www.exabytes.sg\/blog\/wp-content\/uploads\/2021\/08\/Contact-Form-2-Column-with-input.jpg?resize=813%2C420&amp;ssl=1 813w, https:\/\/i0.wp.com\/www.exabytes.sg\/blog\/wp-content\/uploads\/2021\/08\/Contact-Form-2-Column-with-input.jpg?resize=218%2C114&amp;ssl=1 218w\" sizes=\"(max-width: 696px) 100vw, 696px\" \/><\/p>\n<p><span style=\"font-weight: 400;\">Once you\u2019re done with the form, click \u201cSave Form\u201d. Take a piece of paper to write down the form ID as we will be using it later.<\/span><\/p>\n<p><img data-recalc-dims=\"1\" decoding=\"async\" class=\"alignnone wp-image-20813 size-full\" src=\"https:\/\/i0.wp.com\/www.exabytes.sg\/blog\/wp-content\/uploads\/2021\/08\/Contact-Form-Save-FluentForm-settings.jpg?resize=696%2C360&#038;ssl=1\" alt=\"\" width=\"696\" height=\"360\" srcset=\"https:\/\/i0.wp.com\/www.exabytes.sg\/blog\/wp-content\/uploads\/2021\/08\/Contact-Form-Save-FluentForm-settings.jpg?w=1200&amp;ssl=1 1200w, https:\/\/i0.wp.com\/www.exabytes.sg\/blog\/wp-content\/uploads\/2021\/08\/Contact-Form-Save-FluentForm-settings.jpg?resize=300%2C155&amp;ssl=1 300w, https:\/\/i0.wp.com\/www.exabytes.sg\/blog\/wp-content\/uploads\/2021\/08\/Contact-Form-Save-FluentForm-settings.jpg?resize=1024%2C529&amp;ssl=1 1024w, https:\/\/i0.wp.com\/www.exabytes.sg\/blog\/wp-content\/uploads\/2021\/08\/Contact-Form-Save-FluentForm-settings.jpg?resize=768%2C397&amp;ssl=1 768w, https:\/\/i0.wp.com\/www.exabytes.sg\/blog\/wp-content\/uploads\/2021\/08\/Contact-Form-Save-FluentForm-settings.jpg?resize=696%2C360&amp;ssl=1 696w, https:\/\/i0.wp.com\/www.exabytes.sg\/blog\/wp-content\/uploads\/2021\/08\/Contact-Form-Save-FluentForm-settings.jpg?resize=1068%2C552&amp;ssl=1 1068w, https:\/\/i0.wp.com\/www.exabytes.sg\/blog\/wp-content\/uploads\/2021\/08\/Contact-Form-Save-FluentForm-settings.jpg?resize=813%2C420&amp;ssl=1 813w, https:\/\/i0.wp.com\/www.exabytes.sg\/blog\/wp-content\/uploads\/2021\/08\/Contact-Form-Save-FluentForm-settings.jpg?resize=218%2C114&amp;ssl=1 218w\" sizes=\"(max-width: 696px) 100vw, 696px\" \/><\/p>\n<h2><b>Step 2: Configure Additional Form Settings<\/b><\/h2>\n<p><span style=\"font-weight: 400;\">Then, you would need to configure some basic form settings. To do so, click on \u201c<\/span><b>Settings &amp; Integrations<\/b><span style=\"font-weight: 400;\">\u201d.<\/span><\/p>\n<p><img data-recalc-dims=\"1\" decoding=\"async\" class=\"alignnone wp-image-20814 size-full\" src=\"https:\/\/i0.wp.com\/www.exabytes.sg\/blog\/wp-content\/uploads\/2021\/08\/Contact-Form-Additional-Setting.jpg?resize=696%2C360&#038;ssl=1\" alt=\"\" width=\"696\" height=\"360\" srcset=\"https:\/\/i0.wp.com\/www.exabytes.sg\/blog\/wp-content\/uploads\/2021\/08\/Contact-Form-Additional-Setting.jpg?w=1200&amp;ssl=1 1200w, https:\/\/i0.wp.com\/www.exabytes.sg\/blog\/wp-content\/uploads\/2021\/08\/Contact-Form-Additional-Setting.jpg?resize=300%2C155&amp;ssl=1 300w, https:\/\/i0.wp.com\/www.exabytes.sg\/blog\/wp-content\/uploads\/2021\/08\/Contact-Form-Additional-Setting.jpg?resize=1024%2C529&amp;ssl=1 1024w, https:\/\/i0.wp.com\/www.exabytes.sg\/blog\/wp-content\/uploads\/2021\/08\/Contact-Form-Additional-Setting.jpg?resize=768%2C397&amp;ssl=1 768w, https:\/\/i0.wp.com\/www.exabytes.sg\/blog\/wp-content\/uploads\/2021\/08\/Contact-Form-Additional-Setting.jpg?resize=696%2C360&amp;ssl=1 696w, https:\/\/i0.wp.com\/www.exabytes.sg\/blog\/wp-content\/uploads\/2021\/08\/Contact-Form-Additional-Setting.jpg?resize=1068%2C552&amp;ssl=1 1068w, https:\/\/i0.wp.com\/www.exabytes.sg\/blog\/wp-content\/uploads\/2021\/08\/Contact-Form-Additional-Setting.jpg?resize=813%2C420&amp;ssl=1 813w, https:\/\/i0.wp.com\/www.exabytes.sg\/blog\/wp-content\/uploads\/2021\/08\/Contact-Form-Additional-Setting.jpg?resize=218%2C114&amp;ssl=1 218w\" sizes=\"(max-width: 696px) 100vw, 696px\" \/><\/p>\n<p><span style=\"font-weight: 400;\">In this section, there are a few things you can make changes on. <\/span><\/p>\n<p><span style=\"font-weight: 400;\">If you wish to have a different message when someone submitted the form, you can make changes on the section highlighted.\u00a0<\/span><\/p>\n<p><span style=\"font-weight: 400;\">In addition, by default, your form will disappear when someone successfully submitted the contact form. If you don\u2019t want that to happen, you can select \u201c<\/span><b>Reset Form<\/b><span style=\"font-weight: 400;\">\u201d instead. <\/span><\/p>\n<p><img data-recalc-dims=\"1\" decoding=\"async\" class=\"alignnone wp-image-20815 size-full\" src=\"https:\/\/i0.wp.com\/www.exabytes.sg\/blog\/wp-content\/uploads\/2021\/08\/Contact-Form-Form-Setting.jpg?resize=696%2C360&#038;ssl=1\" alt=\"\" width=\"696\" height=\"360\" srcset=\"https:\/\/i0.wp.com\/www.exabytes.sg\/blog\/wp-content\/uploads\/2021\/08\/Contact-Form-Form-Setting.jpg?w=1200&amp;ssl=1 1200w, https:\/\/i0.wp.com\/www.exabytes.sg\/blog\/wp-content\/uploads\/2021\/08\/Contact-Form-Form-Setting.jpg?resize=300%2C155&amp;ssl=1 300w, https:\/\/i0.wp.com\/www.exabytes.sg\/blog\/wp-content\/uploads\/2021\/08\/Contact-Form-Form-Setting.jpg?resize=1024%2C529&amp;ssl=1 1024w, https:\/\/i0.wp.com\/www.exabytes.sg\/blog\/wp-content\/uploads\/2021\/08\/Contact-Form-Form-Setting.jpg?resize=768%2C397&amp;ssl=1 768w, https:\/\/i0.wp.com\/www.exabytes.sg\/blog\/wp-content\/uploads\/2021\/08\/Contact-Form-Form-Setting.jpg?resize=696%2C360&amp;ssl=1 696w, https:\/\/i0.wp.com\/www.exabytes.sg\/blog\/wp-content\/uploads\/2021\/08\/Contact-Form-Form-Setting.jpg?resize=1068%2C552&amp;ssl=1 1068w, https:\/\/i0.wp.com\/www.exabytes.sg\/blog\/wp-content\/uploads\/2021\/08\/Contact-Form-Form-Setting.jpg?resize=813%2C420&amp;ssl=1 813w, https:\/\/i0.wp.com\/www.exabytes.sg\/blog\/wp-content\/uploads\/2021\/08\/Contact-Form-Form-Setting.jpg?resize=218%2C114&amp;ssl=1 218w\" sizes=\"(max-width: 696px) 100vw, 696px\" \/><\/p>\n<p><span style=\"font-weight: 400;\">Next, we\u2019ll move on to the \u201c<\/span><b>Email Notifications<\/b><span style=\"font-weight: 400;\">\u201d section. <\/span><\/p>\n<p><span style=\"font-weight: 400;\">If you wish to receive email notifications when someone submitted the form, you can easily do so by enabling the notification as shown on the image below.\u00a0 <\/span><\/p>\n<p><img data-recalc-dims=\"1\" decoding=\"async\" class=\"alignnone wp-image-20816 size-full\" src=\"https:\/\/i0.wp.com\/www.exabytes.sg\/blog\/wp-content\/uploads\/2021\/08\/Contact-Form-Email-Notification.jpg?resize=696%2C360&#038;ssl=1\" alt=\"\" width=\"696\" height=\"360\" srcset=\"https:\/\/i0.wp.com\/www.exabytes.sg\/blog\/wp-content\/uploads\/2021\/08\/Contact-Form-Email-Notification.jpg?w=1200&amp;ssl=1 1200w, https:\/\/i0.wp.com\/www.exabytes.sg\/blog\/wp-content\/uploads\/2021\/08\/Contact-Form-Email-Notification.jpg?resize=300%2C155&amp;ssl=1 300w, https:\/\/i0.wp.com\/www.exabytes.sg\/blog\/wp-content\/uploads\/2021\/08\/Contact-Form-Email-Notification.jpg?resize=1024%2C529&amp;ssl=1 1024w, https:\/\/i0.wp.com\/www.exabytes.sg\/blog\/wp-content\/uploads\/2021\/08\/Contact-Form-Email-Notification.jpg?resize=768%2C397&amp;ssl=1 768w, https:\/\/i0.wp.com\/www.exabytes.sg\/blog\/wp-content\/uploads\/2021\/08\/Contact-Form-Email-Notification.jpg?resize=696%2C360&amp;ssl=1 696w, https:\/\/i0.wp.com\/www.exabytes.sg\/blog\/wp-content\/uploads\/2021\/08\/Contact-Form-Email-Notification.jpg?resize=1068%2C552&amp;ssl=1 1068w, https:\/\/i0.wp.com\/www.exabytes.sg\/blog\/wp-content\/uploads\/2021\/08\/Contact-Form-Email-Notification.jpg?resize=813%2C420&amp;ssl=1 813w, https:\/\/i0.wp.com\/www.exabytes.sg\/blog\/wp-content\/uploads\/2021\/08\/Contact-Form-Email-Notification.jpg?resize=218%2C114&amp;ssl=1 218w\" sizes=\"(max-width: 696px) 100vw, 696px\" \/><\/p>\n<p><span style=\"font-weight: 400;\">Once it\u2019s enabled, the email notification will be sent to the admin\u2019s email address. If you wish to have the notification sent to a different email, click on the \u201c<\/span><b>Setting<\/b><span style=\"font-weight: 400;\">\u201d icon.\u00a0<\/span><\/p>\n<p><span style=\"font-weight: 400;\">Then, change it to your preferred email address and click \u201c<\/span><b>Save Notification<\/b><span style=\"font-weight: 400;\">\u201d.<\/span><\/p>\n<p><img data-recalc-dims=\"1\" decoding=\"async\" class=\"alignnone wp-image-20817 size-full\" src=\"https:\/\/i0.wp.com\/www.exabytes.sg\/blog\/wp-content\/uploads\/2021\/08\/Contact-Form-Change-Email.jpg?resize=696%2C360&#038;ssl=1\" alt=\"\" width=\"696\" height=\"360\" srcset=\"https:\/\/i0.wp.com\/www.exabytes.sg\/blog\/wp-content\/uploads\/2021\/08\/Contact-Form-Change-Email.jpg?w=1200&amp;ssl=1 1200w, https:\/\/i0.wp.com\/www.exabytes.sg\/blog\/wp-content\/uploads\/2021\/08\/Contact-Form-Change-Email.jpg?resize=300%2C155&amp;ssl=1 300w, https:\/\/i0.wp.com\/www.exabytes.sg\/blog\/wp-content\/uploads\/2021\/08\/Contact-Form-Change-Email.jpg?resize=1024%2C529&amp;ssl=1 1024w, https:\/\/i0.wp.com\/www.exabytes.sg\/blog\/wp-content\/uploads\/2021\/08\/Contact-Form-Change-Email.jpg?resize=768%2C397&amp;ssl=1 768w, https:\/\/i0.wp.com\/www.exabytes.sg\/blog\/wp-content\/uploads\/2021\/08\/Contact-Form-Change-Email.jpg?resize=696%2C360&amp;ssl=1 696w, https:\/\/i0.wp.com\/www.exabytes.sg\/blog\/wp-content\/uploads\/2021\/08\/Contact-Form-Change-Email.jpg?resize=1068%2C552&amp;ssl=1 1068w, https:\/\/i0.wp.com\/www.exabytes.sg\/blog\/wp-content\/uploads\/2021\/08\/Contact-Form-Change-Email.jpg?resize=813%2C420&amp;ssl=1 813w, https:\/\/i0.wp.com\/www.exabytes.sg\/blog\/wp-content\/uploads\/2021\/08\/Contact-Form-Change-Email.jpg?resize=218%2C114&amp;ssl=1 218w\" sizes=\"(max-width: 696px) 100vw, 696px\" \/><\/p>\n<h2><b>Step 3: Embed the Form Into Your Web Page<\/b><\/h2>\n<p><span style=\"font-weight: 400;\">The next step is to embed the form you created earlier into your web page. We will be using Elementor for this step. If you\u2019re using other page builders such as Oxygen or Divi, don\u2019t worry, the process is the same.<\/span><\/p>\n<p><strong><span style=\"font-weight: 400;\">First, go to your Elementor Page Editor, search for \u201c<\/span><b>FluentForm<\/b><span style=\"font-weight: 400;\">\u201d. When you see the element as shown below, drag it to the place you wish it will be.<\/span><\/strong><\/p>\n<p><img data-recalc-dims=\"1\" decoding=\"async\" class=\"alignnone wp-image-20818 size-full\" src=\"https:\/\/i0.wp.com\/www.exabytes.sg\/blog\/wp-content\/uploads\/2021\/08\/Contact-Form-Embed-on-Elementor.jpg?resize=696%2C360&#038;ssl=1\" alt=\"\" width=\"696\" height=\"360\" srcset=\"https:\/\/i0.wp.com\/www.exabytes.sg\/blog\/wp-content\/uploads\/2021\/08\/Contact-Form-Embed-on-Elementor.jpg?w=1200&amp;ssl=1 1200w, https:\/\/i0.wp.com\/www.exabytes.sg\/blog\/wp-content\/uploads\/2021\/08\/Contact-Form-Embed-on-Elementor.jpg?resize=300%2C155&amp;ssl=1 300w, https:\/\/i0.wp.com\/www.exabytes.sg\/blog\/wp-content\/uploads\/2021\/08\/Contact-Form-Embed-on-Elementor.jpg?resize=1024%2C529&amp;ssl=1 1024w, https:\/\/i0.wp.com\/www.exabytes.sg\/blog\/wp-content\/uploads\/2021\/08\/Contact-Form-Embed-on-Elementor.jpg?resize=768%2C397&amp;ssl=1 768w, https:\/\/i0.wp.com\/www.exabytes.sg\/blog\/wp-content\/uploads\/2021\/08\/Contact-Form-Embed-on-Elementor.jpg?resize=696%2C360&amp;ssl=1 696w, https:\/\/i0.wp.com\/www.exabytes.sg\/blog\/wp-content\/uploads\/2021\/08\/Contact-Form-Embed-on-Elementor.jpg?resize=1068%2C552&amp;ssl=1 1068w, https:\/\/i0.wp.com\/www.exabytes.sg\/blog\/wp-content\/uploads\/2021\/08\/Contact-Form-Embed-on-Elementor.jpg?resize=813%2C420&amp;ssl=1 813w, https:\/\/i0.wp.com\/www.exabytes.sg\/blog\/wp-content\/uploads\/2021\/08\/Contact-Form-Embed-on-Elementor.jpg?resize=218%2C114&amp;ssl=1 218w\" sizes=\"(max-width: 696px) 100vw, 696px\" \/><\/p>\n<p><span style=\"font-weight: 400;\">After doing so, at the FluentForm settings, select the form you wish to show here. For our case, it is \u201c<\/span><b>Support Form (#3) (3)<\/b><span style=\"font-weight: 400;\">\u201d. Then, you should be able to see the contact form you\u2019ve created earlier.\u00a0<\/span><\/p>\n<p><span style=\"font-weight: 400;\">Click \u201c<\/span><b>Publish<\/b><span style=\"font-weight: 400;\">\u201d.<\/span><\/p>\n<p><img data-recalc-dims=\"1\" decoding=\"async\" class=\"alignnone wp-image-20819 size-full\" src=\"https:\/\/i0.wp.com\/www.exabytes.sg\/blog\/wp-content\/uploads\/2021\/08\/Contact-Form-FluentForm-Setting-on-Elementor.jpg?resize=696%2C360&#038;ssl=1\" alt=\"\" width=\"696\" height=\"360\" srcset=\"https:\/\/i0.wp.com\/www.exabytes.sg\/blog\/wp-content\/uploads\/2021\/08\/Contact-Form-FluentForm-Setting-on-Elementor.jpg?w=1200&amp;ssl=1 1200w, https:\/\/i0.wp.com\/www.exabytes.sg\/blog\/wp-content\/uploads\/2021\/08\/Contact-Form-FluentForm-Setting-on-Elementor.jpg?resize=300%2C155&amp;ssl=1 300w, https:\/\/i0.wp.com\/www.exabytes.sg\/blog\/wp-content\/uploads\/2021\/08\/Contact-Form-FluentForm-Setting-on-Elementor.jpg?resize=1024%2C529&amp;ssl=1 1024w, https:\/\/i0.wp.com\/www.exabytes.sg\/blog\/wp-content\/uploads\/2021\/08\/Contact-Form-FluentForm-Setting-on-Elementor.jpg?resize=768%2C397&amp;ssl=1 768w, https:\/\/i0.wp.com\/www.exabytes.sg\/blog\/wp-content\/uploads\/2021\/08\/Contact-Form-FluentForm-Setting-on-Elementor.jpg?resize=696%2C360&amp;ssl=1 696w, https:\/\/i0.wp.com\/www.exabytes.sg\/blog\/wp-content\/uploads\/2021\/08\/Contact-Form-FluentForm-Setting-on-Elementor.jpg?resize=1068%2C552&amp;ssl=1 1068w, https:\/\/i0.wp.com\/www.exabytes.sg\/blog\/wp-content\/uploads\/2021\/08\/Contact-Form-FluentForm-Setting-on-Elementor.jpg?resize=813%2C420&amp;ssl=1 813w, https:\/\/i0.wp.com\/www.exabytes.sg\/blog\/wp-content\/uploads\/2021\/08\/Contact-Form-FluentForm-Setting-on-Elementor.jpg?resize=218%2C114&amp;ssl=1 218w\" sizes=\"(max-width: 696px) 100vw, 696px\" \/><\/p>\n<p><span style=\"font-weight: 400;\">Now, you can have a look at your website and try out the form you\u2019ve created!\u00a0<\/span><\/p>\n<p><img data-recalc-dims=\"1\" decoding=\"async\" class=\"alignnone wp-image-20820 size-full\" src=\"https:\/\/i0.wp.com\/www.exabytes.sg\/blog\/wp-content\/uploads\/2021\/08\/Contact-Form-End-Results.jpg?resize=696%2C360&#038;ssl=1\" alt=\"\" width=\"696\" height=\"360\" srcset=\"https:\/\/i0.wp.com\/www.exabytes.sg\/blog\/wp-content\/uploads\/2021\/08\/Contact-Form-End-Results.jpg?w=1200&amp;ssl=1 1200w, https:\/\/i0.wp.com\/www.exabytes.sg\/blog\/wp-content\/uploads\/2021\/08\/Contact-Form-End-Results.jpg?resize=300%2C155&amp;ssl=1 300w, https:\/\/i0.wp.com\/www.exabytes.sg\/blog\/wp-content\/uploads\/2021\/08\/Contact-Form-End-Results.jpg?resize=1024%2C529&amp;ssl=1 1024w, https:\/\/i0.wp.com\/www.exabytes.sg\/blog\/wp-content\/uploads\/2021\/08\/Contact-Form-End-Results.jpg?resize=768%2C397&amp;ssl=1 768w, https:\/\/i0.wp.com\/www.exabytes.sg\/blog\/wp-content\/uploads\/2021\/08\/Contact-Form-End-Results.jpg?resize=696%2C360&amp;ssl=1 696w, https:\/\/i0.wp.com\/www.exabytes.sg\/blog\/wp-content\/uploads\/2021\/08\/Contact-Form-End-Results.jpg?resize=1068%2C552&amp;ssl=1 1068w, https:\/\/i0.wp.com\/www.exabytes.sg\/blog\/wp-content\/uploads\/2021\/08\/Contact-Form-End-Results.jpg?resize=813%2C420&amp;ssl=1 813w, https:\/\/i0.wp.com\/www.exabytes.sg\/blog\/wp-content\/uploads\/2021\/08\/Contact-Form-End-Results.jpg?resize=218%2C114&amp;ssl=1 218w\" sizes=\"(max-width: 696px) 100vw, 696px\" \/><\/p>\n<p><span style=\"font-weight: 400;\">Congratulations! You\u2019ve now learned how to create a detailed contact form for your <a href=\"https:\/\/www.exabytes.sg\/web-hosting\/wordpress-hosting\" target=\"_blank\" rel=\"noopener\">WordPress website<\/a>. I hope this article is able to help you save time researching for a solution.<\/span><\/p>\n<p><span style=\"font-weight: 400;\">If you\u2019re interested in more WordPress related articles, here are a few topics you may be interested in:-<\/span><\/p>\n<ul>\n<li style=\"font-weight: 400;\" aria-level=\"1\"><a href=\"https:\/\/www.exabytes.sg\/blog\/5-best-wordpress-themes-to-use-in-2021\/\"><span style=\"font-weight: 400;\">5 Best WordPress Themes To Use<\/span><\/a><\/li>\n<li style=\"font-weight: 400;\" aria-level=\"1\"><a href=\"https:\/\/www.exabytes.sg\/blog\/wordpress-website-security-tips\/\"><span style=\"font-weight: 400;\">WordPress Website 13 Security Tips<\/span><\/a><\/li>\n<li style=\"font-weight: 400;\" aria-level=\"1\"><a href=\"https:\/\/www.exabytes.sg\/blog\/how-to-make-my-website-multilingual\/\"><span style=\"font-weight: 400;\">How to Make My Website Bilingual\/Multilingual?<\/span><\/a><\/li>\n<\/ul>\n","protected":false},"excerpt":{"rendered":"<p>How to Create A Detailed Contact Form with FluentForm Planning to create a detailed contact form for your website especially WordPress hosted website but do not know the best solution to it? In this article, we will be guiding you how to create a detailed contact form with free WordPress plugin that does not slow [&hellip;]<\/p>\n","protected":false},"author":17,"featured_media":20806,"comment_status":"open","ping_status":"closed","sticky":false,"template":"","format":"standard","meta":{"_jetpack_memberships_contains_paid_content":false,"footnotes":""},"categories":[292,280],"tags":[288,254],"class_list":{"0":"post-20805","1":"post","2":"type-post","3":"status-publish","4":"format-standard","5":"has-post-thumbnail","7":"category-hosting","8":"category-wordpress-sharing-tips","9":"tag-wordpress-hosting","10":"tag-wordpress-plugins"},"jetpack_featured_media_url":"https:\/\/i0.wp.com\/www.exabytes.sg\/blog\/wp-content\/uploads\/2021\/08\/1200X628-sg2021-createform.jpeg?fit=1200%2C628&ssl=1","jetpack_shortlink":"https:\/\/wp.me\/pbHhPQ-5pz","jetpack_sharing_enabled":true,"_links":{"self":[{"href":"https:\/\/www.exabytes.sg\/blog\/wp-json\/wp\/v2\/posts\/20805","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/www.exabytes.sg\/blog\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/www.exabytes.sg\/blog\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/www.exabytes.sg\/blog\/wp-json\/wp\/v2\/users\/17"}],"replies":[{"embeddable":true,"href":"https:\/\/www.exabytes.sg\/blog\/wp-json\/wp\/v2\/comments?post=20805"}],"version-history":[{"count":5,"href":"https:\/\/www.exabytes.sg\/blog\/wp-json\/wp\/v2\/posts\/20805\/revisions"}],"predecessor-version":[{"id":23249,"href":"https:\/\/www.exabytes.sg\/blog\/wp-json\/wp\/v2\/posts\/20805\/revisions\/23249"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/www.exabytes.sg\/blog\/wp-json\/wp\/v2\/media\/20806"}],"wp:attachment":[{"href":"https:\/\/www.exabytes.sg\/blog\/wp-json\/wp\/v2\/media?parent=20805"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/www.exabytes.sg\/blog\/wp-json\/wp\/v2\/categories?post=20805"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/www.exabytes.sg\/blog\/wp-json\/wp\/v2\/tags?post=20805"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}