#MoodleTips – Add radial course progress in your #Moodle course using this CSS code

Moodle Forums are a great way of sharing information and tips with other fellow Moodle users.  Jerome Di Pietro has shared his work on Moodle forums about adding a radial course progress indicator in your Moodle course with the help of CSS and Javascript.

Radial Course Progress in Moodle course using CSS and JavaScript
Radial Course Progress in Moodle

The suggestion posted by Jerome is very useful as it doesn’t need any plugin to be installed on your Moodle site. it simply uses jQuery to count the number of Completion tickboxes. Obviously, for this code to work in your Moodle course, you need to enable the completion progress setting on under your course settings.

I had tested the code on my Moodle 2.9 development server and the code is simply amazing and worked like a charm without any changes. You can also add the simple radial course progress bar by adding an HTML block on your course page and then adding the code mentioned in this forum thread in the block content.

Do let us know if you are also amazed with the simplicity of the code and the benefits it provides without any hassle? If you also wants to share such tips and tricks, then you can send us directly through this form.

Reference: https://moodle.org/mod/forum/discuss.php?d=314373#p1319920

Jaswinder Singh

Jaswinder Singh, passionate about using Moodle in improving the Indian Education System and reaching the students in far flung areas where still education seems to be a impossible prospect of life. He is the author of the popular Moodle Book "How to use Moodle 2.7". In October 2016, Jaswinder was elected as the Moodle User's Association Committee member - the first to make it from India.

Related Articles