Support » Plugin: KaTeX » Render in Learndash quiz

Viewing 6 replies - 1 through 6 (of 6 total)
  • Hi @dobldsoft

    I hope you well, I have the same issue with learndash. Im just wondering if you got any fix for it yet.

    Plugin Author Thomas Churchman

    (@beskhue)

    Hi,

    This is slightly dirty, but does adding this to functions.php work?

    
    add_action( 'wp_print_footer_scripts', function() {
      if ( is_singular( 'sfwd-quiz' ) ) {
        ?>
        <script>
          (function($) {
            renderKatex = function() {
              const eles = document.querySelectorAll(".katex-eq");
              for(let idx=0; idx < eles.length; idx++) {
                 const ele = eles[idx];
                 try {
                   katex.render(
                     ele.textContent,
                     ele,
                     {
                       displayMode: ele.getAttribute("data-katex-display") === 'true',
                       throwOnError: false
                     }
                   );
                 } catch(n) {
                   ele.style.color = "red";
                   ele.textContent = n.message;
                }
              }
            };
    
            jQuery('.wpProQuiz_content').on('learndash-quiz-answer-response-contentchanged', function(e) {
              renderKatex();
            });
    
            jQuery('.wpProQuiz_content').on('learndash-quiz-init', function(e) {
              renderKatex();
            });
          })( jQuery );
        </script>
        <?php
      }
    }, 999);
    

    Thank you for this and for making the plugin

    @beskhue The plugin is super useful

    Thread Starter dobldsoft

    (@dobldsoft)

    Hi @beskhue,

    Thank you for your dirty (:-)) solution. It does the job!!

    I’ve just modified
    const eles = document.querySelectorAll(".katex-eq");

    to

    const eles = document.querySelectorAll(".katexresponse");

    and used the katexresponse as class for the div in the Learndash quiz anwers

    Otherwise all the already present katex get rendered twice, 3 times or more.

    Thank you again for your help!

    Plugin Author Thomas Churchman

    (@beskhue)

    @dobldsoft You are right.

    In the current development version — not yet officially released, available for download here https://wordpress.org/plugins/katex/advanced/ — I’ve added a function to make this easier. You can simply call katexRender to render all as yet unrendered KaTeX.

    This changes the code snippet to:

    add_action( 'wp_print_footer_scripts', function() {
      if ( is_singular( 'sfwd-quiz' ) ) {
        ?>
        <script>
          (function($) {
            jQuery('.wpProQuiz_content').on('learndash-quiz-answer-response-contentchanged', function(e) {
              katexRender();
            });
    
            jQuery('.wpProQuiz_content').on('learndash-quiz-init', function(e) {
              katexRender();
            });
          })( jQuery );
        </script>
        <?php
      }
    }, 999);
    
    Collins Mbaka

    (@collinsmbaka)

    @beskhue Using the Not yet released version with the new code snippet! It still does not render learndash quiz answers. Do I need to use div and a class? How would I do that? or any suggestion on how to get it to render learndash quiz answers?

    Also, I still need to change this

    
    add_action('loop_end', 'katex_resources_enqueue');
    

    to

    
    add_action('wp_footer', 'katex_resources_enqueue');
    

    For it to work with learndash, else I will be getting the ‘katex is not defined’ error

    Thank you so much for your time.

Viewing 6 replies - 1 through 6 (of 6 total)
  • You must be logged in to reply to this topic.