-1

I am trying to use mathJax in my wordpress. According to the documentation at mathjax, the mathjax script url needs to mentioned in headers.php. Which is exactly what I did. And right now this is what the head section in the headers.php looks like:

<head>
   <meta charset="<?php bloginfo( 'charset' ); ?>" />
   <title><?php wp_title( '|', true, 'right' ); ?></title>
   <script type="text/x-mathjax-config">
        MathJax.Hub.Config({
        extensions: ["tex2jax.js"],
        jax: ["input/TeX", "output/HTML-CSS"],
        tex2jax: {
           inlineMath: [ ['$','$'], ["\\(","\\)"] ],
           displayMath: [ ['$$','$$'], ["\\[","\\]"] ],
           processEscapes: true
        },
        "HTML-CSS": { availableFonts: ["TeX"] }
       });
    </script>
    <link rel="profile" href="http://gmpg.org/xfn/11" />
    <link rel="pingback" href="<?php bloginfo( 'pingback_url' ); ?>" />
    <!--[if lt IE 9]>
    <script src="<?php echo get_template_directory_uri(); ?>/js/html5.js" type="text/javascript"></script>
    <script type="text/javascript"src="http://cdn.mathjax.org/mathjax/latest/MathJax.js?config=TeX-AMS-MML_HTMLorMML">
   </script>
      <![endif]-->
  <?php wp_head(); ?>
</head>

This javascript is not loading on my website's index.php page, however its loading on a single posts page. What could be the problem. What am I missing here?

0

The proper way to enqueue a script is as follows:

function mathJax_scripts() {
    wp_enqueue_script( 'mathjax-js', http://cdn.mathjax.org/mathjax/latest/MathJax.js?config=TeX-AMS-MML_HTMLorMML', array(), '2.7.1', false );
}
add_action( 'wp_enqueue_scripts', 'mathJax_scripts' );

I added the version number (2.7.1) and I flipped the final parameter to 'false' - that last parameter asks 'add script to footer?', true means yes, false means no.

Then you'll want to add the inline code into the wp_head():

function mathJax_inlineScript() {
    <script type="text/x-mathjax-config">
        MathJax.Hub.Config({
            extensions: ["tex2jax.js"],
            jax: ["input/TeX", "output/HTML-CSS"],
            tex2jax: {
                inlineMath: [ ['$','$'], ["\\(","\\)"] ],
                displayMath: [ ['$$','$$'], ["\\[","\\]"] ],
                processEscapes: true
            },
            "HTML-CSS": { availableFonts: ["TeX"] }
        });
    </script>
<?php }
add_action( 'wp_head', 'mathJax_inlineScript' , 999 );

In the add action I've set it to 999 - you can adjust and fine tune that to get the inline script to appear where you want it to in the wp_head().

Hope that helps.

-1

I could understand what the problem was. Firstly the statement<script type="text/javascript"src="http://cdn.mathjax.org/mathjax/latest/MathJax.js?config=TeX-AMS-MML_HTMLorMML"> was inside an if for the browser IE. Even after removing that I faced the same problem because I had WP cache enabled and this was caching my webpages. So when you are testing your wp installation, I would recommend deactivating the cache.

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Not the answer you're looking for? Browse other questions tagged or ask your own question.