Tip: How to add placeholder to textarea in Ninja Forms Wordpress plugin

Question

This is actually not a question. I just felt that I needed to share this small piece of magic with all peeps out there having a hard time with getting a placeholder in the Ninja Forms textarea field.

So, basically what you need to do is add the following code to your header.php file in the head section, then change the ID of the textarea and choose your placeholder text.

<script type="text/javascript">
    jQuery(document).ready(function($){
        $('#yourTextareaID').attr("placeholder","Your placeholder value");
    });
</script>

Hope this can help you save some time. You can thank me later.

Answer 1

A way of doing this to make it work for any textarea would be to set (in Ninja forms) the default value of the textarea as whatever you want the placeholder to be and then on page load, take the content of the each textarea, add it to the placeholder attribute, then remove the content:

$(document).ready(function() {
    // Remove textarea content and add placeholder
    $("textarea").each(function() {
        var $this = $(this);
        $this.attr("placeholder", $this.val());
        $this.val("");
    });
});