Cum să adăugați un temporizator de întrebări pentru test în LearnDash

Fiecare sistem bun de management al învățării oferă o opțiune de a adăuga un cronometru la un test/test. Și LearnDash nu este diferit.

Dacă accesați setările LearnDash Quiz din panoul de administrare, ar trebui să observați o opțiune de a adăuga o „Limit de timp” la nivelul testului.

Cronometrele sunt o modalitate excelentă pentru examinator/instructor/profesor de a controla testul propriu-zis.

• Provoacă fiecare elev, jucându-se cu psihicul său,
• studenții pur și simplu nu au timp să trișeze,
• și adaugă un nivel de competiție și între ei

Dar un cronometru de test funcționează bine atunci când toate întrebările sunt ponderate în mod egal sau sunt de același tip. Ca un test de matematică, de exemplu. Dar ce se întâmplă dacă câteva întrebări de matematică sunt doar o parte a testului și doar acele întrebări specifice trebuie cronometrate.

Ei bine, în acest caz, veți avea nevoie de un cronometru pentru fiecare întrebare, în loc de un cronometru pentru chestionare.

Acum, LearnDash nu oferă un temporizator pentru fiecare întrebare.

Tu stii asta.

Și de aceea ești aici, nu?!

Așadar, pentru acele scenarii în care trebuie să adăugați întrebări cronometrate, vă voi explica exact cum puteți adăuga o limită de timp pentru fiecare întrebare test în LearnDash.

Iată ce vom încerca să realizăm:

1. Vom adăuga un câmp opțional pentru fiecare întrebare, unde puteți specifica o limită de timp pentru fiecare întrebare test.
2. Limita de timp va fi apoi afișată pe front-end pentru întrebarea test, iar butonul „Următorul” întrebare va fi ascuns.
3. Dacă studentul epuizează timpul, următoarea întrebare va fi afișată automat.

Acum, trebuie să vă avertizez; aveți nevoie de o cantitate suficientă de cunoștințe de dezvoltare PHP și JavaScript pentru a implementa această soluție. Dacă nu, trebuie să contactați un dezvoltator LearnDash , care vă poate ajuta aici.

Bine. Sa trecem la treaba.

Pasul #1: Adăugați o setare de limită de timp pentru întrebări

Trebuie să începeți prin a adăuga o setare simplă, pentru fiecare test. Desigur, nu este atât de simplu pe cât pare.

Dacă sunteți un dezvoltator care a mai lucrat la chestionare LearnDash, veți ști că nu există cârlige cu care puteți lucra. Nu există un cârlig pe care să îl puteți folosi pentru a adăuga un câmp la setările întrebărilor testului.

Dar nu-ți face griji. Nu vom personaliza nucleul aici. Ceea ce vom face, este să folosim ceva magie JavaScript.

Folosind JavaScript, vom plasa un câmp deasupra butonului „Salvare” de pe pagina de setări a întrebării. Motivul utilizării butonului „Salvare” ca referință pentru câmp, este că butonul „Salvare” este prezent pe fiecare pagină de setări a întrebărilor chestionarului.

Vom folosi ID-ul butonului „Salvare” ca referință, pentru a adăuga câmpul temporizatorului de întrebări.

Partea de mai jos a codului JavaScript afișează un câmp „Limit de timp pentru întrebări” deasupra butonului „Salvare”.

 $ save_button = jQuery( "#saveQuestion" );
$ save_button_div = $ save_button.closest( "div" );

$ content = '<div class="postbox">
<h3 class="hndle">' + 'Limit de timp pentru întrebări (în secunde)' + '</h3>
<div class="inside">
<input type="number" min="0" class="small-text" value="' + input_content + '" name="qtn_time_limit">
</div>
</div>' ;
$ save_button_div .before ( $ continut);

Aici, input_content este valoarea câmpului „Limit de timp pentru întrebări”. În mod implicit, valoarea trebuie să fie setată la 0. De fiecare dată când dvs. (sau un utilizator) setați această valoare, aceasta trebuie să fie actualizată și salvată în baza de date (tratată prin PHP). Și, în mod similar, trebuie să fie citit din baza de date și afișat utilizatorului atunci când utilizatorul vede acest câmp.

Acest cod JavaScript când este pus în coadă va afișa câmpul după cum urmează:

Pasul 2: Adăugați o limită de timp pentru întrebarea de test LearnDash

Odată ce valoarea câmpului a fost salvată pentru o întrebare, cronometrul trebuie să fie afișat atunci când se încearcă întrebarea test. Acest lucru se poate face folosind pașii de mai jos:

• Obțineți valoarea temporizatorului
• Porniți cronometrul
• Verificați periodic dacă timpul limită a fost atins
• Declanșați butonul de întrebare următoare

Codul pentru același lucru este ca mai jos:

 jQuery( '[name="startQuiz"],[name="next"]' ) .click ( funcția (){
jQuery( '.wpProQuiz_listItem' ) .each ( funcția (){
dacă (jQuery(aceasta). este (':vizibil')){
$ current_question_id = jQuery(this). găsiți (" .wpProQuiz_questionList ");
$ current_question_id = $ current_question_id .attr ( "data-question_id" );
if (wdmAjaxData.post_meta[ $ current_question_id] ! == nedefinit ){
counter_value = wdmAjaxData.post_meta[ $ current_question_id];
}
else {
contra_valoare = 0 ;
}
var wdm_globalElements = {
           următorul: jQuery(this). găsiți ("[name='next']"),
           wdm_timelimit: jQuery(this). găsiți (' .wpProQuiz_question_time_limit '),
current_counter: counter_value
};
wdm_globalElements. următorul .hide ();
var wdm_timelimit = ( funcția () {
           var _counter = wdm_globalElements.current_counter;
           var _intervalId = 0 ;
           var instance = {};
           exemplu . stop = function () {
           dacă (_contor) {
               fereastra . clearInterval (_intervalId);
               wdm_globalElements.wdm_timelimit .css ( „afișare” , „niciun” );
           }
         };
         exemplu . start = function () {
         dacă ( ! _contor){
wdm_globalElements. următorul .show ();
întoarcere ;
         }
         var x = _counter * 1000 ;
         var $ timeText = wdm_globalElements.wdm_timelimit. find (' span ') .text (parseTime(_counter));
         var $ timeDiv = wdm_globalElements.wdm_timelimit. găsiți (' .wpProQuiz_question_progress ');
         wdm_globalElements.wdm_timelimit .css ( "afișare" , "" );
         var beforeTime = + data noua ();
         _intervalId = fereastra . setInterval ( funcția () {
                 var diff = ( + new Date() - beforeTime);
                 var elapsedTime = x - diff;
                 dacă (diferență >= 500 ) {
                    $ timeText .text (parseTime( Math . ceil (elapsedTime / 1000 )));
                 }
                 $ timeDiv .css ( 'lățime' , (elapsedTime / x * 100 ) + '%' );
                 if (elapsedTime <= 0 ) {
                    instanță .stop ();
                    wdm_globalElements. următorul .trigger ( „click” );
                 }
          }, 16 );
        };
        returnare instanță;
        })();
wdm_timelimit. începe ();
}
});
}

Codul de mai sus ascunde butonul de întrebare „Următorul” în timp ce temporizatorul rulează, apoi dă clic pe el odată ce limita de timp este atinsă.

https://wisdmlabs.com/learndash-quiz-customization/?utm_source=blog&utm_medium=post&utm_campaign=quiz_cusomization_timer&utm_content=Dropshipping Și rezultatul pentru același lucru ar trebui să fie ca mai jos:

Un cronometru pentru întrebări pentru fiecare test funcționează atunci când doriți să atribuiți o pondere unei anumite întrebări în comparație cu alte întrebări din test. Acest cod poate fi util atunci când doriți să adăugați o astfel de funcționalitate la LearnDash.

Dacă încerci asta și ai întrebări pentru mine, trage-te!

Imagini de freepik