Contact form: some html elements don't seem to work

Help
,
1

I am trying to add a Contact Me form to a pinned post on a write.as blog. However, it seems that the way posts are rendered won’t let me do so.


# Contact Me

<form
  action="https://formspree.io/f/redacted"
  method="POST">
  <label for="from">
    Your email:
</label> <!-- This label disappears entirely when looking at a "View Source" on the rendered post. Only the text remains.

    <input type="text" name="_replyto""id="from"> </input> <!-- this input is now no longer programmatically associated with the label, rendering screenreaders and other assistive technologies unable to determine what the form field is called.
 

  <label for="message">
    Your message:
</label> <!-- same deal, this label element vanishes and only leaves its inner text.
    <input type="text" name="message" id="message"></input> <!-- this was actually a <textarea> but that element seems to not render at all.

  <button type="submit">Send</button> <!--  this just shows up as the word "Send" without any HTML markup.
</form>

What am I doing wrong here?
2

Hi @zersiax, thanks for bringing this up! This doesn’t look like anything on your end, but on ours – we remove certain HTML elements when the page renders.

We’ll get this fixed so you can share this form, likely within the next day or two. Will keep you updated here!

3

This is fixed now! Specifically, we’ve added support for the following HTML elements:

  • label
  • textarea
  • button
1 Like
4

I attempted to create the following form below, but the textarea still does not render.

<form
  action="https://formspree.io/f/xxxxxxxx"
  method="POST">
<label for=“full-name”>Your Name</label>
	<input type=“text” name=“name” id=“full-name” placeholder=“First and Last” required=“”>
<label for=“email-address”>Email Adresss</label> 
    <input type=“email” name="replyto" id=“email-address” placeholder=“email@domain.tld” required=“”>  
<label for=“message”>Message</label>
    <textarea name=“message” rows=“5” cols=“40” id=“message” placeholder=“Type your message…” required=“”></textarea>

<button type="submit">Send</button>
</form>
5

@mikejones,

textarea element does render for me. I would suggest trying the following:

  1. Remove label elements
  2. Remove all the attributes from elements other than type, name and value.
  3. Optionally, you can modify the height of the textarea using something like style=“height:200px;” (using the hight value in pixels that you prefer).

I hope it helps.
Javier

6

the id and for-attributes should work as expected, they are necessary for various mechanisms to work correctly/ If they don’t, that needs fixing. :slight_smile:

7

Thanks for the suggestions. I’ll use them to work with it a bit more.

8

Do any form elements work in Writefreely?
I checked the thread on differences (from Write.as) and see no mention of this as being different, but form elements in my Writefreely installation simply get stripped away when the page renders.