MathJax inside shortcode

In my custom theme I included some shortcodes. One of them is called [alert]...[/alert] and results in a bootstrap alert box. It accepts a type (warning, danger, info or success), a title and the main content. The output is a simple return:

return 'div class="alert alert-' . $atts['type'] . '" role="alert"p class="alert-title"' . $atts['title'] . '/p' . $content . '/div';

I need to wrap an important math formula by one of these alerts, so I wrote:

[alert type="warning" title="Important Formula"][latex]a^2 + b^2 = c^2[/latex][/alert]

But this outputs:

div class="alert alert-warning" role="alert"p class="alert-title"Important Formula/p[latex]a^2 + b^2 = c^2[/latex]/div

So the mathjax latex shortcode is not being recognized and thus is not translated into a mathematical formula. Outside the alert shortcode they are translated into a formula.

Does anybody know what's happening here?

Topic shortcode plugin-mathjax Wordpress

Category Web


You cant call a shortcode inside a shortcode they do not automatically nest, you need to use do_shortcode($content) like this (i am assuming the name of your shortcode):

function alert_shortcode( $atts, $content = null ) {
  return '<div class="alert alert-' . $atts['type'] . '" role="alert"><p class="alert-title">' . $atts['title'] . '</p>' . do_shortcode($content) . '</div>';
}

About

Geeks Mental is a community that publishes articles and tutorials about Web, Android, Data Science, new techniques and Linux security.