Prevent shortcode from being wrapped in <p> tags

I'm using a latex plugin to display formulas on my wordpress site, and I would like to add shortcodes with formulas inside them, so the content of the shortcodes must be processed by the plugin before it gets displayed in the page.

For example, by writing $\frac{15}{5} = 3$ in the editor, this gets displayed in the page .

So I wrote this simple shortcode

add_shortcode( 'test', 'test_sc' );
function test_sc( $atts ){
    return "$\frac{15}{5} = 3$";
}

but by writing [test] in the editor, this gets displayed in the page $\frac{15}{5} = 3$ .

So I searched to solve the problem, and found out that by writing

add_shortcode( 'test', 'test_sc' );
function test_sc( $atts ){
    return apply_filters( 'the_content', '$\frac{15}{5} = 3$' );
}

the formula is displayed correctly, BUT it gets wrapped in <p> tags, so that by writing the fraction [test] equals a natural number , this gets displayed

and this is the HTML from the console

<p>the fraction </p><p><img ...></p>
 equals a natural number<p></p>

I would like that shortcodes would not be wrapped in p tags.

I know there is the plguin Toggle wpautop but since I write formulas in all pages, it would be a huge waste of time to manually write <p> tags in every page.


I searched a lot about the problem, and this is what I tried so far (all the following codes were placed in functions.php file)

remove_filter( 'the_content', 'wpautop' );
add_filter( 'the_content', 'wpautop' , 99);
add_filter( 'the_content', 'shortcode_unautop',100 );

add_shortcode( 'test', 'test_sc' );
function test_sc( $atts ){
    return apply_filters( 'the_content', '$\frac{15}{5} = 3$' );
}

function wpex_clean_shortcodes($content){
$array = array (
    '<p>[' => '[',
    ']</p>' => ']',
    ']<br />' => ']'
);
$content = strtr($content, $array);
return $content;
}
add_filter('the_content', 'wpex_clean_shortcodes');

add_shortcode( 'test', 'test_sc' );
function test_sc( $atts ){
    return wpex_clean_shortcodes(apply_filters( 'the_content','$\frac{15}{5} = 3$' ));
}

add_shortcode( 'test', 'test_sc' );
function test_sc( $atts ){
        $content = apply_filters( 'the_content','$\frac{15}{5} = 3$' );
        $content = shortcode_unautop($content);
        return $content;
}

add_shortcode( 'test', 'test_sc' );
function test_sc( $atts ){
        $content = apply_filters( 'the_content','$\frac{15}{5} = 3$' );
        return do_shortcode(wpautop($content));
}

and lastly, this code from Shortcode Empty Paragraph Fix plugin

add_shortcode( 'test', 'test_sc' );
function test_sc( $atts ){
        return apply_filters( 'the_content','$\frac{15}{5} = 3$' );
}

add_filter( 'the_content', 'shortcode_empty_paragraph_fix' );
function shortcode_empty_paragraph_fix( $content ) {
    // define your shortcodes to filter, '' filters all shortcodes
    $shortcodes = array( 'test' );
    foreach ( $shortcodes as $shortcode ) {
        $array = array (
            '<p>[' . $shortcode => '[' .$shortcode,
            '<p>[/' . $shortcode => '[/' .$shortcode,
            $shortcode . ']</p>' => $shortcode . ']',
            $shortcode . ']<br />' => $shortcode . ']'
        );
        $content = strtr( $content, $array );
    }
    return $content;
}

In all the previous cases, what gets displayed is

How to solve the problem?

Solutions

Instead of trying to remove the automatically added paragraphs before or after the fact, you can try removing the wpautop filter from the_content within your shortcode (and re-adding it to maintain consistency for other plugins etc.):

add_shortcode( 'test', 'test_sc' );
function test_sc( $atts ){
    remove_filter( 'the_content', 'wpautop' );
    $content = apply_filters( 'the_content', '$\frac{15}{5} = 3$' );
    add_filter( 'the_content', 'wpautop' );
    return $content;
}

Similar questions

Shortcode from a widget is wrapped in unwanted <p> element
I'm using Black Studio TinyMCE Widget as a rich text editor widget. In a sidebar I inserted the TinyMCE widget with a [testimonial] shortcode and some content after it. For example: When I switch to the HTML tab of that widget I've got the following: The shorcode simply displaying a random Testimonial CPT post: However, when I view a page, stray &l...
basic shortcode - Why 1st paragraph not wrapped in p tag, but 2nd is
I'm working on a basic plugin that adds shortcodes for columns, buttons, panels, ect. Nothing new here. I haven't altered wpautop in anyway; I've tried removing it and delaying it - no change. What happens with all shortcodes used is, the first paragraph isn't wrapped within a p tag (the p tags are actually appearing directly after the first paragr...
custom shortcode will not display the wrapped content
I'm trying to create a plugin to have some shortcodes utility for my custom bootstrap 4 layouts. I'm reading the shortcode API docs but I'm unable to display the contents wrapped inside the shortcodes I've created. The plugin class is loaded correctly but if I load the test page I've made, it will display only the header and the footer, the content...
Wordpress shortcode does not work when its wrapped in HTML
I have create Wordpress pages that contain HTML elements like <div> and <ul> e.g. I would like to place short codes inside these HTML elements like this: When I do this, the short codes just show up as regular text on the rendered page. If I just place the short codes outside of the HTML elements then they function properly rendering th...
Create shortcode in Wordpress that disables wpautop() on wrapped content?
Looking to place a graphic on the same line/row as an h3 title like this: First I make the h3 display = inline so it only occupies it's actual width rather than the full row. I could float the h3 and the graphic left and then do a clearfix but it seems excessive. The goal is to simply place both the h3 and small graphic on the same line. It fails b...
Images are not being displayed, but they are clearly being loaded (Javascript Game being hosted on Wordpress)
So here's the deal. I created this Sonic themed "Brick Breaker" style game that I wanted to host on a Wordpress site. Originally the game had 8 JS files, a CSS file and an HTML file but for the purposes of wordpress I threw everything into one file. My first issue was that the JavaScript wasn't loading, but the images were being displayed as static...

Also ask

We use cookies to deliver the best possible experience on our website. By continuing to use this site, accepting or closing this box, you consent to our use of cookies. To learn more, visit our privacy policy .