Having Trouble With My Email Button For My Website

Question

I want to make an "Email" button, and I want this button to send the text that user enters to my email address.

Code:

<form method="post" action="malto:trillyreign@gmail.com">
    <div class="fields">
        <div class="field half">
            <label for="name">Name</label>
            <input type="text" name="name" id="name" />
        </div>
        <div class="field half">
            <label for="email">Email</label>
            <input type="text" name="email" id="email" />
        </div>
        <div class="field">
            <label for="message">Message</label>
            <textarea name="message" id="message" rows="5"></textarea>
        </div>
    </div>
    <ul class="actions">
        <li>
            <a href="malto:trillyreign@gmail.com" class="button submit">Send Message</a>
        </li>
    </ul>
</form>

Answer 1

You need to change "malto" in your form action to "mailto". Further you need a submit button not a Mailto-Link to send your form. If you use a Mailto-Link the values form the fields are not appended to the message.

I would also recommend to use enctype="text/plain" on your form to send plain text. Another thing you can do is to add ?subject=Your Subject so you have subject field prefilled.

<form method="post" action="mailto:test@example.com?subject=Website Feedback" enctype="text/plain">
    <div class="fields">
        <div class="field half">
            <label for="name">Name</label>
            <input type="text" name="name" id="name" />
        </div>
        <div class="field half">
            <label for="email">Email</label>
            <input type="text" name="email" id="email" />
        </div>
        <div class="field">
            <label for="message">Message</label>
            <textarea name="message" id="message" rows="5"></textarea>
        </div>
    </div>
    <input type="submit" value="Send" />
</form>

Example: https://jsfiddle.net/av4mjd6z/