mce_css │ filter-hook │ WP 2.1.0

Allows arbitrary CSS styles (a CSS file) to be added to the WordPress TinyMCE visual editor.

The function passes the $mce_css parameter, which contains comma-separated URLs of CSS files.

In addition to a .css file, the URL of a .php file can be specified when styles must be generated dynamically.

This hook should be used when writing a plugin. To add a stylesheet from a theme, use add_editor_style().

Usage

add_filter( 'mce_css', 'wp_kama_mce_css_filter' );

/**
 * Function for `mce_css` filter-hook.
 * 
 * @param string $stylesheets Comma-delimited list of stylesheets.
 *
 * @return string
 */
function wp_kama_mce_css_filter( $stylesheets ){

	// filter...
	return $stylesheets;
}

Parameters

$mce_css(string)

Comma-separated URLs of CSS files.

Examples

#1 Load a Google font

Because mce_css is a comma-separated string of URLs, the added URL must not contain commas. However, a Google Fonts URL does contain them when multiple styles of one font are loaded, for example: 'http://fonts.googleapis.com/css?family=Lato:300,400,700'. To load this URL, encode it or replace the commas with “%2C”:

add_filter( 'mce_css', 'plugin_mce_css' );
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 .= urlencode( $font_url ); // or the following line
	$mce_css .= str_replace( ',', '%2C', $font_url );

	return $mce_css;
}