Remove empty p-Tags in Shortcode content before non p-Tags

The empty p tag in the developer console means that you have other HTML being outputted inside it, which shouldn’t be there. i.e the H5 tag for the heading.

This is because “do_shortcode” uses the wpautop filter which wraps everything in a p tag

Try remove the wpautop filter, run do_shortcode, and then re add the wpautop filter (otherwise any other shortcode outputs will run without it).

Replace

$output .= '<div class="media-body">';
    $output .= do_shortcode( $content );
$output .= '</div>';

With

$output .= '<div class="media-body">';
    remove_filter( 'the_content', 'wpautop' );
    $output .= do_shortcode( $content );
    add_filter( 'the_content', 'wpautop' );
$output .= '</div>';

You might need to add some p tags manually to your shortcode call.

[media img="https://via.placeholder.com/64x64.png"]<h5>List-based media object</h5><p>Cras sit amet nibh libero, in gravida nulla. Nulla vel metus scelerisque ante sollicitudin. Cras purus odio, vestibulum in vulputate at, tempus viverra turpis. Fusce condimentum nunc ac nisi vulputate fringilla. Donec lacinia congue felis in faucibus.</p>[/media]

Related Posts: