Bolding several words at once

Question

One of my WordPress users has a need to bold several words in any given post. These words will vary dependant on post and not every instance will be made bold for a given post.

An example of the output they want is;

• Team X vs Team Y
• Team A vs Youth Team B

The thing I like about C United is...

There is no rhyme or reason to it and unfortunately it takes them a long time to highlight each word and bold it.

Is anyone aware of a way he can quickly select multiple words in a given post and bold them in one go?

I was thinking about writing some JS that would listen for a certain modifier key being held down and then on click it would remember the word to be made bold, but I can't think how I would then run through and bold everything on the front end.

Any advice or pointers in a particular direction would be appreciated.

Answer 1

This is a neat idea that I think I may use too. Here's the solution I've just cooked up.

First, add the following to your functions.php file:

/* BOLDED CONTENT */

// Affect the content after it's retrieved and before it's displayed
add_filter( 'the_content', 'bolded_content' );

function bolded_content( $content ) { 

    // Look for custom meta field called 'bold'
    if ( get_post_meta( get_the_ID(), 'bold', true ) ) {

        // Get 'bold' value
        $bold_terms = get_post_meta( get_the_ID(), 'bold', true );

        // Split string into multiple values at each comma
        $keys= explode(", ",$bold_terms);

        // Add <strong> tag with special class if needed
        $bolded_content = preg_replace('/('.implode('|', $keys) .')/iu', '<strong class="bolded_content">\0</strong>', $content); // Adds 

        // Remove strong tag if it was added anywhere inside of an existing tag.
        // For example:  <a href="/folder/<strong class="bolded_content">VALUE</strong>.html"> would break things.
        foreach ($keys as $key) {
            $bolded_content = preg_replace("|(<[^>]+?)(<strong class=\"bolded_content\">($key)</strong>)([^<]+?>)|","$1$3$4",$bolded_content);
        }

        $content = $bolded_content;

        }

    return $content;
}

Then add a custom field to your post where the name is "bold" and the value is whatever terms you wish to bold (separated by comma and a space). In your case, this would be:

Name: bold
Value: Team X, Youth Team B, C United

For further styling, you can tweak .bolded_content in your CSS file.

This should allow you to add as many terms as you like and they are set at the post/page level. That should do it. Hope that helps!