HTML Forms to Email (Without a Backend)
<form id="contact-form">
<input type="text" name="name">
<input type="email" name="email">
<input type="phone" name="phone">
<textarea name="message">
<input name="to-email" type="hidden" value="{YOUR_EMAIL}">
<input type="submit" value="Send">
</form>
<script src="https://webform.maman.ae/webform.js">
<script>
WebForm("contact-form");
<script>
To hide the email address, you can replace your email with a token.
Token:
Now, replace the hidden field to-email
with to-token
, for example:
<input name="to-email" type="hidden" value="{YOUR_EMAIL}">
<input name="to-token" type="hidden" value="{YOUR_TOKEN}">
form
tag
or by passing them in options
parameter to WebForm("form-id", options)
.
Note that options
will overide HTML attribute tags.
HTML Tag | JS option | Default | Description |
---|---|---|---|
success-message
|
successMessage
|
Thank you for contacting us |
[Optional] This is the message that will be displayed in the form when the form is sent. HTML Example: <form success-message="Ticket opened"> JS Example: WebForm("contact-form", {successMessage: "Ticket opened"});
|
fail-message
|
failMessage
|
Message was not sent |
[Optional] This is the message that will be displayed in the form when the form is not sent. HTML Example: <form fail-message="Something went wrong, please refresh and try again"> JS Example: WebForm("contact-form", {failMessage: "Something went wrong, please refresh and try again"});
|
html
|
html
|
false |
[Optional] If you want to add HTML code to your success and fail messages, set this to true HTML Example: <form html="true"> JS Example: WebForm("contact-form", {html: true});
|