What are HTML forms? Why do you need them?
An HTML form is an area that allows users to enter and submit data, and is commonly used to collect user information such as name, email address, feedback, and order information. Unlike WordPress form plugins, HTML forms are implemented by manually writing HTML code, which gives them more control and customization. With HTML forms, you are free to set fields such as text boxes, checkboxes, radio buttons, etc., while controlling the layout and style of the form.
Advantages of using HTML forms
- performance optimization: HTML forms are lightweight, fast-loading code, and suitable for sites with high performance requirements.
- Total control: Handwriting HTML code gives you precise control over the appearance and functionality of your forms.
- Flexible customization: HTML forms can be flexibly customized to meet your needs without the functionality limitations of a plug-in.
Two Ways to Add HTML Forms to WordPress
Method 1: Use the HTML Forms plug-in
For users with no coding experience, using an HTML form plugin is the easiest way. If you use the HTML Forms Plugin. This plugin allows for quick creation and configuration of forms in the WordPress dashboard for users who want to get set up quickly.
Steps:
- Installation of plug-ins: Navigate to the plugin repository in the WordPress dashboard, search for and install the HTML Forms Plug-ins.
- Creating a new form: After activating the plugin, navigate to
HTML Forms > Add New Form
If you want to create a form, enter a form name, such as "Example Form", and then click "Creating Forms".
- Configuring form fields: On the edit page, you can add fields such as text, dates, checkboxes, etc. to the form via tabs. Reorder fields and remove unwanted fields to ensure that the form layout is as expected.
- Posting Forms: After saving your changes, use theshort codeInsert the form into the page or article, publish the page and then you can see the form effect on the front end.
Attention:HTML forms do not support email marketing service integration. Therefore, the user's email address needs to be manually added to your mailing list.
Method 2: Use WPForms to add custom HTML to WordPress forms
WPForms is an ideal choice for those who wish to add custom HTML code to their forms. Although WPForms is a drag-and-drop form builder, it allows users to insert snippets of HTML code into the form for more personalized effects.
Steps:
- Installation of WPForms plugin: Search for and install in the WordPress plugin repository WPForms Plug-ins.
- Creating a new form: After activating the plugin, navigate to
WPForms > Add New Form
Select the "Simple Contact Form" template.
- Insert HTML field: In the form builder, from the left paneldrag-and-drop (computing)"HTML" field to the form. Custom code snippets, such as tooltips or special instructions, can be added to this field.
- Customized form settings: Set up notification and confirmation messages to ensure that users can receive email notifications after submitting a form and display a customized message on the form confirmation page.
- Posting Forms: the WPForms form will beembeddingpage or article, update the page to go live.
Upload custom HTML pages to WordPress
If you have a complete HTML page, such as a static template or an old website page, you can upload it by uploading the HTML pageTo display in WordPress. Simply place the HTML file and its associated CSS and image files in a folder and upload it to the WordPress root folder.