Bootstrap and Moodle – Gradebook tweak!

Bootstrap themes have been available for Moodle for a while now, and a small issue was there that I had not seen before  – until a lecturer wondered why they could not see grades in the gradebook that should have been there.

As it is that time of year that many are dealing with end of semester grades, I thought I should pass along the solution for you if you have not known about it.

** Please note that this may not effect your site depending on the version of Moodle and if you are using a Bootstrap theme.

The issue is this:

When a teacher hides a grade from students it got a class=’hidden’ applied. Themes before bootstrap ignored it as they did not have a style for it. However bootstrap base, and therefore themes like Clean etc did have a style of it namely:


So instead of showing grey-ed out, or showing normally,  the hidden grades vanished on the interface for the teacher as in the screenshots below.

Grade Entry before being hidden - teacher can see

Grade Entry before being hidden – teacher can see the student grade for Assignment 1


Grade Entry hidden - teacher cannot see

Grade Entry hidden – teacher cannot see the grade and table a bit messed up.


Grade Entry hidden with CSS fix - teacher can see it again

Grade Entry hidden with CSS fix – teacher can see it again and table looks okay.

This was fixed last september 2014 in Moodle releases through the tracker entry  –  by applying a different style ‘dimmed_text’ to the different places that currently had the style of ‘hidden’.

So remember you may or may not have an issue depending on your version.

As these were a set of core changes and if you are on a version pre-Sept 2014, you would need to applying those changes to your own core install or upgrade to a newer version to do the class change/

However if you want to have your teachers see the grades in the grader report that they have set to hidden from students and you are using a bootstrap theme – you can just add the following CSS as either custom CSS if your theme allows it, or adding it to the theme css.

.path-grade .hidden {
color: #999;

It is easy to check if your current theme has the issue:

  1. Create a test course
  2. Create an assignment
  3. Add some test users
  4. Give them grades
  5. Go to the gradebook and turn editing on
  6. Hide the grade for the activity in the gradebook
  7. Turn editing off

If you as a teacher/admin can view the grades for the users in the grader report when the Editing is turned off, then you have no issue to solve

If you cannot, then you should be able to easily apply the fix in the custom CSS part of your theme.


This entry was posted in Moodle and tagged , . Bookmark the permalink.