Skip to main content
Answer

CSS to hide completion status box in ILT player

  • March 13, 2024
  • 2 replies
  • 76 views

Forum|alt.badge.img

Can anyone share any CSS wizardry to hide the Completion Status box in the ILT player? It’s irrelevant in my situation.

 

 

Best answer by nick.tosto

Another nice feature of the new course player is that each course player page now has a unique class you can use to target specific courses. For instance, if you had a single course where the progress bar was irrelevant but you wanted to keep it for all other courses, you could add the following to Brian’s code snippet:

.lrn-course-player-XX .lrn-widget-session-completion-status-open {
display: none;
}

In the code above you would need to replace XX with the course’s ID. The ID can be seen in the URL in the course player. In this example: ntosto.docebosaas.com/learn/courses/42/open-enrollmentl/lessons, 42 is the course ID so I would use .lrn-course-player-42 in my snippet.

This would hide the completion status box only on this specific course.

2 replies

Bfarkas
Hero III
Forum|alt.badge.img+6
  • Hero III
  • March 17, 2024

Looks pretty straight forward for this one thanks to the considerations in the setup of the new course player.

This should do it for you:

.lrn-widget-session-completion-status-open {
display: none;
}

 


Forum|alt.badge.img+3
  • Docebian
  • Answer
  • March 22, 2024

Another nice feature of the new course player is that each course player page now has a unique class you can use to target specific courses. For instance, if you had a single course where the progress bar was irrelevant but you wanted to keep it for all other courses, you could add the following to Brian’s code snippet:

.lrn-course-player-XX .lrn-widget-session-completion-status-open {
display: none;
}

In the code above you would need to replace XX with the course’s ID. The ID can be seen in the URL in the course player. In this example: ntosto.docebosaas.com/learn/courses/42/open-enrollmentl/lessons, 42 is the course ID so I would use .lrn-course-player-42 in my snippet.

This would hide the completion status box only on this specific course.