How to Add a Character Counter to the Excerpt Metabox in WordPress

Home » Snippets » How to Add a Character Counter to the Excerpt Metabox in WordPress
0

Created with:

Visibility: 

public

Creator: Alex

Customize with WPTurbo AI
X

Add Snippet To Project

New Project
Add To Existing Project

As a writer or blogger, you know how important it is to create a concise and clear summary of your article. However, it can be frustrating when the excerpt section in the WordPress editor does not provide you with an accurate count of the characters in your summary. Fortunately, there is an easy solution to this problem: adding a character counter to the excerpt metabox. In this article, we will show you how to do just that step-by-step, so you can be sure that your summaries are the perfect length every time.

					function WPTurbo_excerpt_character_count() {
    global $post;

    $max_characters = 150; // Change this value to set the max number of characters

    $content = get_the_content($post->ID);
    $content = strip_tags($content); // Remove all HTML tags
    $content = str_replace(" ", " ", $content); // Remove non-breaking spaces

    $length = strlen($content);

    if($length > $max_characters) {
        $counter = '<strong class="excerpt-character-count red">' . $length . '/' . $max_characters . '</strong>';
    } else {
        $counter = '<strong class="excerpt-character-count green">' . $length . '/' . $max_characters . '</strong>';
    }

    echo $counter;
}
add_action('post_excerpt_html', 'WPTurbo_excerpt_character_count');
				

This code snippet adds a character counter to the WordPress excerpt metabox. This can be useful for ensuring that the excerpt is the appropriate length for displaying on the front end of a website.

First, the function WPTurbo_excerpt_character_count() is defined. Within the function, we set the maximum number of characters that we want to allow in the excerpt by defining a value for $max_characters. You can adjust this value to your desired character limit.

The next step is to get the content of the post using get_the_content(). We pass in the ID of the post that we want to get the content for, which we retrieve from the global $post object.

We then use strip_tags() to remove any HTML tags from the content, as those should not count towards the character limit. We also use str_replace() to replace non-breaking spaces with regular spaces, which can also skew the character count if not removed.

The strlen() function is then used to get the length of the excerpt in characters. We compare this length with the maximum character limit that we set earlier. If the length is greater than the maximum character limit, we set the text color to red by adding a CSS class red to the counter. If the length is equal or less than the maximum character limit, we set the color to green, by adding a CSS class green to the counter.

Finally, the counter is printed on the excerpt metabox using echo. We hook this function into the post_excerpt_html action, which ensures that the counter is displayed whenever the excerpt metabox is rendered for a post.

Register an account to save your snippets or go Pro to get more features.