In HTML5 you can use placeholders in your forms to name fields or guide the users. I would like to use this in Jetpack forms but it seems it doesn't support it. You can add a default value like default="Your name", but the user will then have to delete this text before writing. With placeholders the field is cleared when you start writing.

Any workarounds in JavaScript maybe?

closed as off-topic by birgire, Pieter Goosen, Johannes Pille, kaiser Sep 22 '14 at 20:12

This question appears to be off-topic. The users who voted to close gave this specific reason:

If this question can be reworded to fit the rules in the help center, please edit the question.


You can do this by means of jQuery (which means this is rather a jQuery/JavaScript question).

Put the following in one of your (already included) JS files, or create a new JS file and enqueue it, or hard-code it in between <script>...</script> tags:

jQuery(document).ready(function($) {
    $('#my-form-field').attr('placeholder', 'Please enter your name...');
  • Forms in Jetpack ignores the placeholder attribute (added manually) but this will work you think? – BoBoz Apr 23 '13 at 19:56
  • Well, I don't use Jetpack Contact Form, so why don't you try it and we both know for sure? :) I'm pretty confident this will work, unless Jetpack Contact Form removes anything not wanted (after your script is executed). – tfrommen Apr 23 '13 at 19:59
  • Thanks, and will of course try it out. Although I'm not trusting Jetpack from not removing stuff. – BoBoz Apr 24 '13 at 10:59
  • Yeah, works! For others using Jepack contact forms, below is a working jQuery selector ` jQuery(document).ready(function($) { $('.contact-form input').attr('placeholder', 'Please enter your name...'); }); ` – BoBoz Apr 24 '13 at 11:15

Not the answer you're looking for? Browse other questions tagged or ask your own question.