WordPress.org

Ready to get started?Download WordPress

Codex

Attention Interested in functions, hooks, classes, or methods? Check out the new WordPress Code Reference!

Plugin API/Filter Reference/mce css

Description

The mce_css filter provides a method to add custom stylesheets to the TinyMCE editor window.

$mce_css is a comma separated list of stylesheet URIs.

The file can be a .php file, allowing dynamic generation of CSS rules for the content editor.

Theme Usage

If you are doing this from within a theme, consider using add_editor_style() instead.

Examples

function plugin_mce_css( $mce_css ) {
	if ( ! empty( $mce_css ) )
		$mce_css .= ',';

	$mce_css .= plugins_url( 'editor.css', __FILE__ );

	return $mce_css;
}
add_filter( 'mce_css', 'plugin_mce_css' );

Example Using Google Fonts

Because mce_css is a comma-separated string of values, you cannot use the default href string from a source like Google Fonts if it contains multiple faces (e.g., 'http://fonts.googleapis.com/css?family=Lato:300,400,700'). You must replace the commas with their URL-encoded equivalent, '%2C'.

function plugin_mce_css( $mce_css ) {
	if ( ! empty( $mce_css ) )
		$mce_css .= ',';

	$font_url = 'http://fonts.googleapis.com/css?family=Lato:300,400,700';
	$mce_css .= str_replace( ',', '%2C', $font_url );

	return $mce_css;
}
add_filter( 'mce_css', 'plugin_mce_css' );

See Also

Related


This page is marked as incomplete. You can help Codex by expanding it.