Add Snippet To Project
Are you tired of the limited formatting options available in the default WordPress excerpt box? Do you wish you could have a full-fledged visual editor like TinyMCE to make your post excerpts more visually appealing? Well, you’re in luck! In this article, we’ll show you how to enable the TinyMCE editor for the post excerpt field, giving you more flexibility and control over how your excerpts are displayed on your WordPress site.
function wpturbo_enable_tinymce_for_excerpt() {
add_post_type_support( 'post', 'excerpt' );
remove_filter( 'the_excerpt', 'wpautop' );
add_filter( 'the_excerpt', 'wpturbo_enable_tinymce' );
}
function wpturbo_enable_tinymce($excerpt) {
global $post;
if ($post->post_type == 'post') {
ob_start();
wp_editor( htmlspecialchars_decode($excerpt), 'excerpt', array(
'textarea_rows' => 5,
'tinymce' => true,
'quicktags' => false,
'media_buttons' => false,
'textarea_name' => 'excerpt',
'teeny' => true,
'editor_css' => '<style>.wp-editor-container { width: 100% !important; }</style>'
) );
$editor = ob_get_clean();
return $editor;
} else {
return $excerpt;
}
}
add_action( 'init', 'wpturbo_enable_tinymce_for_excerpt' );
The provided code snippet is used to enable the TinyMCE editor for the post excerpt in WordPress. By default, WordPress uses a plain text editor for the excerpt field, but with the help of this code, we can replace it with the more advanced TinyMCE editor.
Let's break down the code step by step to understand how it works.
First, we define a function called wpturbo_enable_tinymce_for_excerpt(). This function is responsible for enabling the excerpt field for the post type 'post' and configuring the TinyMCE editor for it.
Inside this function, we use the add_post_type_support() function to add support for the 'excerpt' field in the 'post' post type. This enables the excerpt field and allows us to modify it.
Next, we remove the filter that adds automatic paragraph tags to the excerpt using the remove_filter() function. This ensures that the TinyMCE editor can render the HTML correctly without any interference from the WordPress filter.
Then, we add a new filter to the the_excerpt hook using the add_filter() function. This filter allows us to modify the excerpt content before it is displayed. We pass the name of the callback function wpturbo_enable_tinymce as the second argument to specify the function to be executed when the filter is applied.
Moving on to the wpturbo_enable_tinymce() function, this function is responsible for replacing the plain text excerpt field with the TinyMCE editor.
First, we check if the current post type is 'post' using the $post->post_type global variable. If it is, we proceed with modifying the excerpt, otherwise, we return it as is.
Next, we start an output buffer using ob_start() to capture the HTML output of the TinyMCE editor.
Inside the wp_editor() function, we pass the current excerpt value as the content for the editor. The function accepts an array of arguments to customize the editor. We set textarea_rows to 5 to define the number of rows in the editor, tinymce to true to enable the TinyMCE editor, quicktags to false to disable the Quicktags toolbar, media_buttons to false to remove the media buttons, textarea_name to 'excerpt' to specify the name of the textarea element, teeny to true to enable the simplified TinyMCE mode, and editor_css to override the width of the editor's container using CSS.
After capturing the output buffer content, we clean the buffer and return the editor HTML content using ob_get_clean().
Finally, the modified excerpt is returned or the unchanged excerpt is returned if the post type is not 'post'.
To make this functionality available, we hook the wpturbo_enable_tinymce_for_excerpt() function to the init action using the add_action() function. This ensures that the code is executed when WordPress initializes.
With this code in place, the post excerpt field will be replaced with the TinyMCE editor, allowing users to format the excerpt content using rich text formatting options provided by TinyMCE.