WordPress TinyMCE Placeholder Plugin

• Last Updated: March 23, 2016
• Last Tested: September 5, 2018
• Author: Myles McNamara
• Original Author: mohan999
• Original Source: https://github.com/mohan999/tinymce-placeholder

Preview

This plugin brings HTML5 placeholder attribute functionality for the TinyMCE editor in WordPress. The standard placeholder in the textarea will show when viewing in text mode, this plugin adds a <label> html element that is only shown when viewing the Visual editor.

Usage

• Add mce.placeholder.js to your site
• Add to list of WordPress TinyMCE Plugins through filter
• Set placeholder value of textarea through filter
• Profit!

Add mce.placeholder.js

Download the mce.placeholder.js file and place it in your theme OR plugin directory, or somewhere you know the full URL to.

The example below assumes you have placed the mce.placeholder.js in the ROOT directory of your child theme

Add placeholder plugin through filter

add_filter( 'mce_external_plugins', 'add_mce_placeholder_plugin' );

function add_mce_placeholder_plugin( $plugins ){

	// Optional, check for specific post type to add this
	// if( 'my_custom_post_type' !== get_post_type() ) return $plugins;

	// This assumes you placed mce.placeholder.js in root of child theme directory
	$plugins['placeholder'] = get_stylesheet_directory_uri() . '/mce.placeholder.js';

	// You can also specify the exact path if you want:
	// $plugins[ 'placeholder' ] = '//domain.com/full/path/to/mce.placeholder.js';

	return $plugins;
}

Set placeholder value in textarea

add_filter( 'the_editor', 'set_my_mce_editor_placeholder' );

function set_my_mce_editor_placeholder( $textarea_html ){

	// Optional, check for specific post type to add this (remove // to uncomment and use)
	// if( 'my_custom_post_type' !== get_post_type() ) return $plugins;

	$placeholder = __( 'Check it out...this is my custom placeholder!' );

	$textarea_html = preg_replace( '/<textarea/', "<textarea placeholder=\"{$placeholder}\"", $textarea_html );

	return $textarea_html;
}

Profit!