Skip to content

A Block plugin for Moodle 3.8+ to display categories with images in a tile layout.

Notifications You must be signed in to change notification settings

frumbert/moodle-block_category_tiles

 
 

Folders and files

NameName
Last commit message
Last commit date

Latest commit

 

History

18 Commits
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 

Repository files navigation

Category Tiles Block

This block plugin will display categories as tiles in a similar way to dashboard course tiles. If the description field of the category contains an image tag, it will use the first one encountered as the image for that category (internal or external). If no image is found a dynamic image will be generated for that category.

Category Tiles block shown in Boost theme - Moodle 3.8.3

The block can be placed on the dashboard or in the course category pages or the site homepage (or all of these).

Contents will conform to the shape and size of the block

Admins get to see all categories but hidden categories will be noted.

Options

You can change the block title, and choose whether the category list is filtered.

Settings screen of block

A filtered list will only list categories that contain courses that the user is already enrolled in or can enrol themselves in. Filtering doesn't apply to admins. In the image below, the learner is enrolled in a course under the sketching category, and a course under the colours category has self-enrolment enrolment method enabled.

Example of a filtered tile list shown to a learner

Styling

The styling uses the same block and classname structure as dashboard course tiles. If you're feeling adventurous you can modify the mustache templates and come up with your own layout.

Since the default category renderer will display images and description at the top of the category list, you might not like the doubling up of images you might see

Category image being shown in standard category page

You could get creative in your themes stylesheet and have something like

#page-course-index-category .categorypicker + .generalbox.info img:first-of-type {
	display: none;
}

in order to hide the first encountered image, or you can edit the html of the image tag and include the 'hidden' attribute which most modern browsers will recognise.

<p>
    <img src="https://my.moodle.site/pluginfile.php/3/coursecat/description/orange.jpg"
    	alt="" role="presentation" hidden>
</p>

Licence

http://www.gnu.org/copyleft/gpl.html GNU GPL v3 or later

About

A Block plugin for Moodle 3.8+ to display categories with images in a tile layout.

Topics

Resources

Stars

Watchers

Forks

Packages

No packages published

Languages

  • PHP 77.0%
  • HTML 18.2%
  • JavaScript 4.8%