sensei icon indicating copy to clipboard operation
sensei copied to clipboard
verified publisher icon Automattic

Quiz progress bar doesn't display in Learning Mode

Open danjjohnson opened this issue 4 months ago • 8 comments

Steps to Reproduce

  1. Create a lesson and add a quiz block.
  2. Add at least 2 questions.
  3. Set the quiz pagination to multi-page, one question per page, and enable the progress bar
  4. View the lesson and take the quiz
Image

What I Expected

The progress bar should show at the top of the quiz

What Happened Instead

No progress bar is shown.

Note: The progress bar shows if you disable Learning Mode.

PHP / WordPress / Sensei LMS version

WP version: 6.8.2 php_version: 8.1.33 64bit Sensei LMS: version: 4.25.0 Sensei Pro: version: 1.24.3

Screenshot / Video

Image Image

Context / Source

10167527-zd-a8c

danjjohnson avatar Sep 01 '25 11:09 danjjohnson

Support References

This comment is automatically generated. Please do not edit it.

  • [ ] 10167527-zen

github-actions[bot] avatar Sep 01 '25 11:09 github-actions[bot]

Any news on this, it's a big feature that is now missing. If it will take some time to update. let me know so i can build my own progress bar.

alex-kodr avatar Sep 03 '25 16:09 alex-kodr

Hi @danjjohnson. From the screenshot, it looks like the progress bar is visible (the gray bar under Exit Course), but is likely not working when you answer a question. Does that sound right?

donnapep avatar Sep 03 '25 22:09 donnapep

@donnapep You are referring to the lesson progress bar and that works fine. @danjjohnson is referring to the quiz progress bar that is not working. The area marked in green box on the screenshot is where it 'should' appear. Also on the screenshot you can also see the settings are set to 'Show Progress Bar' in admin. I've never used this plugin before, but I'm very surprised it's been shipped with such an obvious bug.

alex-kodr avatar Sep 04 '25 07:09 alex-kodr

Correct, the issue is with the quiz progress bar, which can be enabled when the quiz is set to multi-page. It displays in the lesson editor as shown above, but not on the frontend.

danjjohnson avatar Sep 04 '25 09:09 danjjohnson

Can you confirm that the Quiz Progress block is in the Quiz template? If you could copy and paste the template here, that would be great. Just trying to gather as much info as possible.

donnapep avatar Sep 05 '25 14:09 donnapep

If you look at the attached screenshot you'll see the progress bar is part of the quiz block settings.

Image

alex-kodr avatar Sep 05 '25 14:09 alex-kodr

Here is the full block of code for that page

<!-- wp:paragraph {"placeholder":"Write lesson content...","className":"sensei-content-description"} -->
<p class="sensei-content-description"></p>
<!-- /wp:paragraph -->

<!-- wp:sensei-lms/lesson-actions -->
<div class="wp-block-sensei-lms-lesson-actions"><div class="sensei-buttons-container"><!-- wp:sensei-lms/button-view-quiz {"inContainer":true} -->
<div class="wp-block-sensei-lms-button-view-quiz is-style-default sensei-buttons-container__button-block wp-block-sensei-lms-button-view-quiz__wrapper"><div class="wp-block-sensei-lms-button-view-quiz is-style-default wp-block-sensei-button wp-block-button has-text-align-left"><button class="wp-block-button__link">Take Quiz</button></div></div>
<!-- /wp:sensei-lms/button-view-quiz -->

<!-- wp:sensei-lms/button-complete-lesson {"inContainer":true} -->
<div class="wp-block-sensei-lms-button-complete-lesson is-style-default sensei-buttons-container__button-block wp-block-sensei-lms-button-complete-lesson__wrapper"><div class="wp-block-sensei-lms-button-complete-lesson is-style-default wp-block-sensei-button wp-block-button has-text-align-left"><button class="wp-block-button__link sensei-stop-double-submission">Complete Lesson</button></div></div>
<!-- /wp:sensei-lms/button-complete-lesson -->

<!-- wp:sensei-lms/button-next-lesson {"inContainer":true} -->
<div class="wp-block-sensei-lms-button-next-lesson is-style-default sensei-buttons-container__button-block wp-block-sensei-lms-button-next-lesson__wrapper"><div class="wp-block-sensei-lms-button-next-lesson is-style-default wp-block-sensei-button wp-block-button has-text-align-left"><button class="wp-block-button__link">Next Lesson</button></div></div>
<!-- /wp:sensei-lms/button-next-lesson -->

<!-- wp:sensei-lms/button-reset-lesson {"inContainer":true} -->
<div class="wp-block-sensei-lms-button-reset-lesson is-style-outline sensei-buttons-container__button-block wp-block-sensei-lms-button-reset-lesson__wrapper"><div class="wp-block-sensei-lms-button-reset-lesson is-style-outline wp-block-sensei-button wp-block-button has-text-align-left"><button class="wp-block-button__link sensei-stop-double-submission">Reset Lesson</button></div></div>
<!-- /wp:sensei-lms/button-reset-lesson --></div></div>
<!-- /wp:sensei-lms/lesson-actions -->

<!-- wp:sensei-lms/quiz {"options":{"passRequired":false,"quizPassmark":0,"autoGrade":false,"allowRetakes":true,"showQuestions":null,"randomQuestionOrder":false,"failedIndicateIncorrect":true,"failedShowCorrectAnswers":true,"failedShowAnswerFeedback":true,"buttonTextColor":null,"buttonBackgroundColor":null,"pagination":{"paginationNumber":1,"showProgressBar":true,"progressBarRadius":1,"progressBarHeight":20,"progressBarColor":null,"progressBarBackground":null}},"isPostTemplate":true} -->
<!-- wp:sensei-lms/quiz-question {"id":37,"title":"What is the capital of Spain","answer":{"answers":[{"label":"Madrid","correct":true},{"label":"Barcelona","correct":false},{"label":"Malaga","correct":false},{"label":"Valencia","correct":false}]},"options":{"grade":1,"hideAnswerFeedback":"","answerFeedback":null,"randomOrder":false}} -->
<!-- wp:sensei-lms/question-description -->
<!-- wp:paragraph {"placeholder":"Add question description or type / to choose a block."} -->
<p>This is where a question description could go if needed.</p>
<!-- /wp:paragraph -->
<!-- /wp:sensei-lms/question-description -->

<!-- wp:sensei-lms/question-answers /-->

<!-- wp:sensei-lms/quiz-question-feedback-correct -->
<!-- wp:paragraph {"placeholder":"Show a message when the question is answered correctly. Type / to choose a block."} -->
<p></p>
<!-- /wp:paragraph -->
<!-- /wp:sensei-lms/quiz-question-feedback-correct -->

<!-- wp:sensei-lms/quiz-question-feedback-incorrect -->
<!-- wp:paragraph {"placeholder":"Show a message when the question is answered incorrectly. Type / to choose a block."} -->
<p></p>
<!-- /wp:paragraph -->
<!-- /wp:sensei-lms/quiz-question-feedback-incorrect -->
<!-- /wp:sensei-lms/quiz-question -->

<!-- wp:sensei-lms/quiz-question {"id":38,"title":"Is the sky blue","type":"boolean","answer":{"correct":true},"options":{"grade":1,"hideAnswerFeedback":"","answerFeedback":null}} -->
<!-- wp:sensei-lms/question-description -->
<!-- wp:paragraph {"placeholder":"Add question description or type / to choose a block."} -->
<p>This is where a question description could go if needed.</p>
<!-- /wp:paragraph -->
<!-- /wp:sensei-lms/question-description -->

<!-- wp:sensei-lms/question-answers /-->

<!-- wp:sensei-lms/quiz-question-feedback-correct -->
<!-- wp:paragraph {"placeholder":"Show a message when the question is answered correctly. Type / to choose a block."} -->
<p></p>
<!-- /wp:paragraph -->
<!-- /wp:sensei-lms/quiz-question-feedback-correct -->

<!-- wp:sensei-lms/quiz-question-feedback-incorrect -->
<!-- wp:paragraph {"placeholder":"Show a message when the question is answered incorrectly. Type / to choose a block."} -->
<p></p>
<!-- /wp:paragraph -->
<!-- /wp:sensei-lms/quiz-question-feedback-incorrect -->
<!-- /wp:sensei-lms/quiz-question -->

<!-- wp:sensei-lms/quiz-question {"id":39,"title":"How many season are in a year","answer":{"answers":[{"label":"1","correct":false},{"label":"2","correct":false},{"label":"3","correct":false},{"label":"4","correct":true}]},"options":{"grade":1,"hideAnswerFeedback":"","answerFeedback":null,"randomOrder":false}} -->
<!-- wp:sensei-lms/question-description -->
<!-- wp:paragraph {"placeholder":"Add question description or type / to choose a block."} -->
<p>This is where a question description could go if needed.</p>
<!-- /wp:paragraph -->
<!-- /wp:sensei-lms/question-description -->

<!-- wp:sensei-lms/question-answers {"lock":{"move":true,"remove":true}} /-->

<!-- wp:sensei-lms/quiz-question-feedback-correct -->
<!-- wp:paragraph {"placeholder":"Show a message when the question is answered correctly. Type / to choose a block."} -->
<p></p>
<!-- /wp:paragraph -->
<!-- /wp:sensei-lms/quiz-question-feedback-correct -->

<!-- wp:sensei-lms/quiz-question-feedback-incorrect -->
<!-- wp:paragraph {"placeholder":"Show a message when the question is answered incorrectly. Type / to choose a block."} -->
<p></p>
<!-- /wp:paragraph -->
<!-- /wp:sensei-lms/quiz-question-feedback-incorrect -->
<!-- /wp:sensei-lms/quiz-question -->

<!-- wp:sensei-lms/quiz-question /-->
<!-- /wp:sensei-lms/quiz -->```

alex-kodr avatar Sep 05 '25 14:09 alex-kodr