Free page builder · A form that emails you · WordPress-ready
Contact Us Page Generator: A Contact Page with a Form That Emails You
Add your email, phone, WhatsApp, address, hours and map, then connect a free form service (or your WordPress form plugin) so messages really reach you. Copy clean HTML with no JavaScript, ready for a WordPress Custom HTML block, Elementor, Blogger or any site.
- Add your contact details
- Connect a form and pick a style
- Copy the code into your site
Your details
Privacy: everything is built in this browser. Nothing is uploaded; your draft is saved in this browser only, until you press Clear form.
Your contact page
The form doesn't send from this preview. Send yourself a test message once it is on your site.
Checks
What this generator does, and what it doesn't
Especially about the contact form, which is where most contact pages quietly fail.
✓What it does
- Builds a complete contact page: email, phone, WhatsApp chat link, address, opening hours, departments, social links and a map.
- Makes a form that really sends, through Web3Forms, Formspree, FormSubmit, another service or your WordPress form plugin, with a hidden spam trap.
- Leaves the form out until it's connected, so you never publish a form that goes nowhere.
- Writes accessible fields: labels, required markers and autocomplete, so phones fill in names and emails for people.
- Keeps the code WordPress-safe: no JavaScript, scoped CSS, a lazy-loading map with a fixed height.
✕What it doesn't do
- Send email by itself. No plain HTML page can. The form service you choose receives and forwards the messages, under its own terms and free-plan limits.
- Stop all spam. The hidden trap stops simple bots. For heavy spam, use a form plugin or service with CAPTCHA.
- Hide your email address. Email and phone links can be collected by spam bots. A form avoids showing your address.
- Store messages. Neither this tool nor allinonetools.net sees what your visitors send.
- Send an automatic reply to the visitor. You get the email; the visitor sees a thank-you page. Auto-replies are a feature of some form services and plugins, often on paid plans.
- Test the form for you. We check that the form sends the right fields to the right address, but only a test message from your live page proves that email reaches your inbox.
- Guarantee delivery. Messages can land in spam, and free plans have monthly limits. Check your spam folder and the service's dashboard.
Which form option should you choose?
All of these work without JavaScript on your page. Free-plan limits change, so check each service's site.
| Option | Setup | Good for | Keep in mind |
|---|---|---|---|
| WordPress form plugin | Create a form in Contact Form 7, WPForms or similar, paste its shortcode | WordPress sites that want messages saved in the dashboard | Your site must be able to send email (an SMTP plugin helps) |
| Web3Forms | Enter your email at web3forms.com, paste the access key | Any site, quickest setup | The key is visible in your page; that is how it is designed |
| Formspree | Create a free account and form, paste the form link | Any site, with a dashboard of messages | The free plan has a monthly message limit |
| FormSubmit | Enter your email, then confirm the first message | Quick tests and small sites | Your email is in the code until you switch to their alias |
| No form | Nothing to set up | Businesses that prefer calls or WhatsApp | Show at least two ways to reach you |
How to make the contact form really work
A contact form that silently fails costs you customers and trust. Follow the steps for your option, then always send yourself a test message. Menu names can differ a little between versions.
WordPress with Contact Form 7 (free plugin)
- In WordPress, go to Plugins → Add New, search for Contact Form 7, then Install and Activate.
- Go to Contact → Contact Forms. A form called "Contact form 1" is ready. Copy its shortcode, for example
Error: Contact form not found.
- Open the form and check the Mail tab: To is the email that receives messages, and From should be an address on your own domain, such as
wordpress@yourdomain.com. - Install an SMTP plugin such as WP Mail SMTP and connect it to your email provider or host. Without it, many hosts send WordPress email unreliably and it often lands in spam.
- In this tool, choose My WordPress form plugin, paste the shortcode, copy the HTML and paste it into a Custom HTML block on your Contact page.
- Publish, open the page in a private window and send a test message.
WordPress with WPForms Lite (free plugin)
- Install and activate WPForms Lite from Plugins → Add New.
- Go to WPForms → Add New, pick the Simple Contact Form template and save.
- Under Settings → Notifications in the form builder, check the email address that receives messages.
- Copy the form's shortcode, for example
[wpforms id="123"], from WPForms → All Forms. - As with Contact Form 7, an SMTP plugin makes delivery much more reliable.
- Paste the shortcode in this tool, copy the HTML into a Custom HTML block, publish and send a test message.
Web3Forms (any website, no plugin)
- Go to web3forms.com, enter the email that should receive messages and create an access key. The key arrives by email.
- In this tool, choose Web3Forms and paste the key. It is meant to be visible in your page; it can only send to your email.
- Optionally add your own thank-you page link.
- Copy the HTML into your site, publish and send a test message. Messages come from Web3Forms to your inbox.
Formspree (any website, with a message dashboard)
- Create a free account at formspree.io and verify your email address.
- Create a new form and copy its endpoint, which looks like
https://formspree.io/f/abcdwxyz. - In this tool, choose Formspree, paste the link, copy the HTML into your site and publish.
- Send a test message. You get it by email and can also see it in your Formspree dashboard. The free plan has a monthly limit.
FormSubmit (any website, quickest test)
- In this tool, choose FormSubmit and enter the email that should receive messages.
- Copy the HTML into your site and publish.
- Send the first message yourself. FormSubmit emails you a confirmation link: open it to activate the form. Until then, messages are not delivered.
- FormSubmit then gives you a random alias. Put it in this tool instead of your email and paste the new code, so your address isn't visible in the page.
Test checklist before you trust the form
- Open your live Contact page in a private window, so you see it as a visitor does.
- Fill in every field with a real email address you can check, and send.
- Check your inbox and the spam folder. If it is in spam, mark it as "Not spam".
- Reply to the test email to make sure replies go to the visitor's address.
- Try once from your phone too.
- Repeat the test after changing your theme, plugins, caching or email settings.
If messages don't arrive
- Nothing at all: check the spam folder, then check that the key, link or email in the tool is correct and that you confirmed the email if the service asked.
- WordPress plugin forms: install an SMTP plugin and send its test email. Many hosts block or limit PHP mail.
- "Session expired" or similar errors with a plugin form: exclude the Contact page from page caching in WP Rocket or your caching plugin, then clear the cache.
- The form vanished after saving: paste the code as an administrator; WordPress removes forms and maps from HTML saved by other roles.
- Still stuck: show your email address and phone number on the page too, so nobody is left without a way to reach you.
Why the code works with WordPress, WP Rocket and other plugins
No JavaScript
The form is a normal HTML form and the map is a normal embed. "Delay JavaScript", Rocket Loader and script minifying have nothing to break.
Delay JS, Defer JS, Combine JS
Scoped CSS
Every style starts with .aic.aic, so form fields keep their look even if your theme styles inputs and buttons, and nothing else on your site changes.
Remove Unused CSS, Minify CSS
Map without layout jumps
The map has a fixed height and loads lazily, so the page doesn't jump, and WP Rocket's iframe lazy load works with it.
No layout shift
Shortcodes work
WordPress runs shortcodes inside a Custom HTML block, so your form plugin's form appears inside this layout.
Contact Form 7, WPForms
Admin only
WordPress lets administrators add forms and maps in HTML. Other roles may have them removed when saving.
Paste as an administrator
Don't cache the thank-you step
The form sends straight to the service, so page caching doesn't affect it. If you add your own thank-you page, a normal cached page is fine.
Page cache
How to make your contact page
Add your contact details
Email, phone, WhatsApp and address. Add a reply time so people know what to expect.
Add a map
In Google Maps, press Share, then Embed a map, copy the HTML and paste it in the Map box.
Connect a form
Pick a form service or your WordPress form plugin and paste its key, link or shortcode.
Pick a style and colour
Check the preview on desktop and mobile.
Paste it into your site
In WordPress, add a Custom HTML block to your Contact page and paste the WordPress-safe code.
Send a test message
Submit the form yourself, check your inbox and spam folder, and confirm the email if the service asks.
Frequently asked questions
Will the contact form actually send me emails?
Yes, once you connect it. Plain HTML can't send email, so the form posts to the service you choose (Web3Forms, Formspree, FormSubmit or another) or you use your WordPress form plugin's shortcode. Until a form is connected, the tool leaves it out of the code. Always send yourself a test message after publishing.
Will the visitor get an automatic reply?
Not from this code. You receive the message by email and the visitor sees a thank-you page. Automatic replies to visitors are offered by some form services and WordPress form plugins, often on paid plans; set them up there if you need them.
How do I know the form really works?
Send yourself a test message from your live page, in a private window, and check your inbox and spam folder. The setup guide on this page has a short test checklist and fixes for the most common problems.
Which free form service should I use?
For the quickest setup, Web3Forms needs only an access key sent to your email. Formspree gives you a dashboard of messages. FormSubmit needs no key but puts your email in the code until you switch to its alias. On WordPress, a form plugin such as Contact Form 7 or WPForms keeps everything on your own site. Free-plan limits change, so check each service.
How do I add a Google Map?
In Google Maps, find your place, press Share, open Embed a map and copy the HTML. Paste all of it into the Map box; the tool keeps only the Google Maps link. If you just want something quick, choose "Simple map from my address" or an "Open in Google Maps" button.
Will it work with WP Rocket and other caching plugins?
Yes. The page has no JavaScript, only scoped CSS that is all used, and a lazy-loading map with a fixed height, so Delay JavaScript, Remove Unused CSS and lazy loading have nothing to break. Clear your cache after publishing.
Can I use my Contact Form 7 or WPForms form?
Yes. Choose "My WordPress form plugin", paste the shortcode, and the tool places it inside the layout next to your contact details. WordPress runs shortcodes inside a Custom HTML block.
How do I stop spam?
The form includes each service's hidden spam trap, which stops simple bots. For more protection, turn on the CAPTCHA or spam filter your form service or plugin offers. Showing an email address openly can attract spam; a form helps avoid that.
Is my information stored?
No. Everything is built in your browser and nothing is uploaded. Your draft is kept in this browser so you can continue later; press Clear form to remove it. Messages your visitors send go to the form service you chose, not to allinonetools.net.
What to do next
Other pages every site needs.