Add Class to Specific Paragraph of the_content()

The question:

Let’s say I want to give the first paragraph bold text by adding a body class to the first paragraph. Is there a way to filter the output of

the_content();

or any other paragraph? First paragraph? Last paragraph?

I know I can do this using Javascript or CSS (:firstchild), but is there a native WordPress way?

Thanks.

J

The Solutions:

Below are the methods you can try. The first solution is probably the best. Try others if the first one doesn’t work. Senior developers aren’t just copying/pasting – they read the methods carefully & apply them wisely to each case.

Method 1

The following bit of code adds a class to the first paragraph output by the_content:

function first_paragraph($content){
    return preg_replace('/<p([^>]+)?>/', '<p$1 class="intro">', $content, 1);
}
add_filter('the_content', 'first_paragraph');

Add the above to your theme’s functions.php file.

Then in your CSS add something like:

p.intro { font-weight:bold; }

I can’t claim credit for this solution (see this thread in the WP forums) but I tested it and it worked great for me in WordPress 3.3.2. You should be able to modify it as needed to target whichever paragraph your heart desires.


All methods was sourced from stackoverflow.com or stackexchange.com, is licensed under cc by-sa 2.5, cc by-sa 3.0 and cc by-sa 4.0

Leave a Comment