Course formats: Tiles format

Maintained by Picture of David WatsonDavid Watson
A course format which displays course topics as "Tiles", in a grid rather than as a list. When clicked, tile content is displayed under the tile with an animated transition. The layout adapts to different screen sizes and orientations. Within each tile, activities can also be set to display as "sub-tiles". For each tile, the teacher can pick an icon from a predefined set, or upload a background photo.
1297 sites
68 fans
Current versions available: 1
Key features
  • Tiles are used to show course topics and activities
  • Animation is used to expand tiles to reveal content
  • Icons or photos on each tile increase visual appeal
  • Modal windows (animated pop ups) to show content
  • Colours for tiles are customisable
  • Theme compatibility is broad (Boost, Clean, Essential, Moove and Adaptable).
  • Easy to switch into Tiles from other formats (e.g. Topics, Grid) without changing course content
  • User friendly (e.g. tile icons are provided and don't need to be uploaded)
  • Mobile responsive (adapts to different screen sizes and orientations)
  • Progress shown on tile with % in a circle, or as a fraction
Please favourite and support future improvements by donating!

News 21 May 2019

Version 3.7.0 has just been released as a "beta". It allows for tiles to have photo backgrounds and has various other improvements. Read more and see the demo site here or download the 3.7.0 code here

Please contact me with any issues arising from your testing.  I will carry out any bug fixes, aiming to upgrade it to a "stable" release within the next few weeks.  I have marked it as compatible with Moodle 3.7.  I'd like to thank WU Executive Academy in Vienna for sponsoring the photo tiles feature and kindly agreeing to share it with the community.

If you do not wish to test the beta version, please use the most recent stable version (3.3.6) instead for the time being.


Screenshot #0
Screenshot #1
Screenshot #2
Screenshot #3
Screenshot #4
Screenshot #5
Screenshot #6
Screenshot #7
Screenshot #8


Picture of David Watson
David Watson (Lead maintainer)
Please login to view contributors details and/or to contact them

Comments RSS

Show comments
  • Picture of C Behan
    Tue, May 21, 2019, 5:23 PM
    Thank you David - I'm delighted! That's great, and good to read about the planned developments as well.
    This format is a really great step to really giving a facelift to Moodle - it just really modernises it.
    Thanks again.
  • Picture of Ivan Vargas
    Fri, May 24, 2019, 1:47 AM
    Hello, when the tiles are few the content is very narrow, there is some way to adjust the content, to a width that is not related to the amount of tiles? Thank you.
  • Picture of Pamela Weber
    Wed, May 29, 2019, 3:55 AM
    Hi, we absolutely love this course format, but we have the following issue:
    we need to display youtube videos embedded as iframes in pages (as resource), but we don't want the pages to popup, since that interferes with the display. Strangely, when in editing mode, the page opens within the same window, whereas with editing off, the page opens in a popup.

    How can I set pages to NOT open as popup? Thank you, and thanks for this beautiful course format.
  • Picture of David Watson
    Wed, May 29, 2019, 3:22 PM
    Thanks Pamela. To answer your question:
    - pages will open in modal windows (pop ups), unless the site admin has disabled this feature site wide by unchecking "Page" under Site Administration > Plugins > Course Formats > Tiles > Modal modules > Page
    - you could also post the video as a "URL" activity and set "Display" to "embed". If you do that with plugin version 3.3.x, the video will display without a modal window. If you do that with plugin version 3.7.x (currently in "beta" but I hope to upgrade to "stable" in the next few weeks), you will see a modal window, unless the Site Administrator disables modal windows for URL activities by unchecking Site Administration > Plugins > Course Formats > Tiles > Modal resources > URL (Display: Embed)

    I hope that makes sense. If you want to send me a screen shot of the issue you have using the pop up, please use the "Contact developer" button above to message me and I will email you back.
  • Picture of Gilbert Vilalva Gilbert
    Thu, May 30, 2019, 10:55 PM
    Hi, thanks for amazing plugin!
    In adaptable theme the subblocks images no redirect for the content, just the text contains the link.
    In the boost theme this does not occur.
    Can i help me?

    Sorry for my english.
  • Picture of David Watson
    Thu, May 30, 2019, 11:24 PM
    Thanks Gilbert I will address that in the next version of the beta (in the next few days)
  • Picture of Gilbert Vilalva Gilbert
    Fri, May 31, 2019, 12:15 AM
    Thanks David, I use the beta version. The new funcionality "upload new image" in the course block is fantastic. Is possible to replicate the same funcionality in the subblocks?
  • Picture of Leslie Foster
    Fri, May 31, 2019, 9:29 PM
    If I manually mark an activity as completed, it does not show in the tile.
  • Picture of Srikant Padhi
    Fri, May 31, 2019, 10:40 PM
    The content becomes narrow when tiles are low amount. How to solve?
  • Picture of Jeremy Virgo
    Wed, Jun 19, 2019, 8:43 AM
    Hi David,
    I love your plugin!
    Can I request being able to change activity icons, like tile icons?
  • Picture of David Watson
    Wed, Jun 19, 2019, 8:11 PM
    Thanks Jeremy I will definitely consider it for a later release (and photos for sub-tiles as suggested by Gilbert). Planning to let the dust settle for a while after the most recent changes though.
  • Picture of Juli MacArthur
    Thu, Jun 20, 2019, 11:44 PM
    Hi David,

    I'm really enjoying this theme as it works very well for more visual learners. However, I've the same issue as @Srikant Padhi where the tiles have to aligned themselves across the page but with a narrow area for content - this means when the drop-down occurs any embedded content (large images or videos as a Label) is quite narrow and thus are unreadable or have a scroll bar.

    Example 1: Course which has 10 tiles, these spread themselves across the page as 7 top row and 3 bottom. This means the drop-down fills the entire page/browser window. Great!

    Example 2: Course which has 6 tiles has aligned as 4 on the top row and 2 on the second. This means the drop-down for content is narrow and does not fill the page.

    Is there a fix for this? The loading page does appear before the tiles are displayed but this leads to the above issue. When I use the demo site I get 5 tiles across with the side-nav showing which shows more content, so I'm not clear on why this does it on my site! I'musing Fordson on 3.6.


  • Picture of David Watson
    Fri, Jun 21, 2019, 2:36 AM
    Hi Juli I sent you an email asking if you could help me with some screen shots. I did improve this in one of the recent Beta releases so, if you are not on the latest, it may help to upgrade. (I also messaged Srikant with the same request.)

    The workaround for the time being would be to deactivate "Fit tiles to screen width" under Site Admin > Plugins > Course Formats > Tiles > JavaScript. It comes from an experimental feature which probably needs a little adjustment.
  • Picture of Jérôme DUBRUNQUEZ
    Mon, Jul 15, 2019, 8:11 PM
    Bonjour, j'ai installé la version beta, j'ai remarqué lorsque l'on utilise l'option photo en arrière plan l'indicateur cadenas (restriction) disparaissait ce qui est dommage.
  • Picture of Mina Mahar
    Wed, Jul 17, 2019, 3:22 AM
    Hello, is it possible to change the color of the subtiles or add images to the subtiles? I would love to change the boring gray into a more active color.
1 2 3 4 5
Please login to post comments