I want to add HTML5 required for the client side validation on textarea generated by

    $content = '';
    $editor_id = 'YOURID';
    wp_editor( $content, $editor_id );

What is the best way to add required on textarea? Thank you.

2 Answers 2


The visual editor is not a textarea, it is an iframe, therefor even if you could set an attribute it will do nothing. You can set the attribute on the hidden textarea that will be sent to the server but since it is hidden I am not sure how an alert about it not being filled will be displayed and it might be different between browsers (it is hidden so there is no obvious visual anchor for the display of the alert)

  • Thank you for the explanation. That made things clear for me. Any work around for this? I tried jquery validate plugin but didn't work out either.
    – Ohsik
    Commented Nov 24, 2015 at 4:45
  • @Ohsik You can always check the content of the text area on form onsubmit (or similar) event and make your own popup message. Commented Nov 24, 2015 at 5:06
  • Thank you for the answer. I'm using jQuery validate plugin and couldn't find a way to make this work. Any suggestions?
    – Ohsik
    Commented Nov 25, 2015 at 2:58
  • sorry but those are details that I don't usually look for and remember (For similar problems I would just say that the effort do not justify the result as you still should handle on server side the case where that field in empty) Commented Nov 25, 2015 at 3:02

I have done the following successfully for a plug-in that uses several visual editors (only some of which are required) on an Admin Screen.

  1. When creating the editor, add a class that is unique to my plugin and indicates that content is required in this editor.
  2. Hook a function to 'the_editor'.
  3. This function will check if the markup for the editor contains my custom class. If so, it adds the required attribute.

I am able to style the field using


and the form generates an error if it is submitted while this field is empty (though I've only tested in Safari so far).

Sample code is below (This code was taken from a much larger class). First, an excerpt from the function that builds the editor.

$addlClass = ($required) ? 'my-required-field' : '';
$settings  = array(
  'media_buttons' => false,
  'textarea_name' => $fieldName,
  'editor_class'  => $addlClass
wp_editor($cleanFld, $fieldId, $settings);

Then, my hook:

add_action('the_editor', array($this, 'CheckIfEditorFieldIsRequired'));

Finally, that function:

public function CheckIfEditorFieldIsRequired($editorMarkup)
  if (stripos($editorMarkup, 'my-required-field') !== false) {
    $editorMarkup = str_replace('<textarea', '<textarea required', $editorMarkup);
  return $editorMarkup;

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

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