LWP Contact Form
Create your own contact form plugin for beginners.
by Lax Mariappan · github.com/laxmariappan/lwp-contact-form-v2 · website
Install
No release zip yet. The repository archive installs, but the folder name will carry the branch suffix and updates will not flow:
wp plugin install https://github.com/laxmariappan/lwp-contact-form-v2/archive/refs/heads/main.zipLWP Contact Form
Description
This is a simple demo plugin to create a contact form in WordPress. The plugin adds a shortcode [lwp_contact_form] to display the form on the front end.
The form has the following fields:
- First Name
- Last Name
- Message
How to use the plugin?
If you are familiar with git, you can clone the repository and checkout the branches to see the step by step development of the plugin.
If you are new to git, you can download the zip file of the repository and install the plugin in your WordPress site.
Note: This is a demo plugin and should not be used in a production site without proper testing and validation.
Learning Objectives
- Create a simple contact form in WordPress.
- Use the shortcode API to display the form on the front end.
- Handle form submission and display success message.
- Use nonce field to prevent CSRF attacks. ( Branch
step-8) - Sanitize and validate form data. ( Branch
step-9) - Save form entry to the database. ( Branch
step-10) - Display form entries in the admin. ( Branch
step-10)
Resources
Let’s code: creating your first WordPress plugin
WordPress Concepts Used
- Shortcode API
- Nonce field
- Sanitization
- Custom Post Type
- Custom Meta fields
- Admin Columns
Extend the plugin
- Add more fields to the form.
- Multistep form.
- Add file upload field.
- Use PHP Classes to organize the code.
- Add email notification to the admin.
Branches
main- Stable versionstep-1- Adds readme file and plugin header for the plugin.step-2- Adds shortcode and placeholder for the form.step-3- Adds the form fields HTML.step-4- Adds the CSS for the form.step-5- Adds the submission handler, print the form data for testing.step-6- Adds the success message.