Tiles format

Course formats ::: format_tiles
Maintained by David 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.
Latest release:
11100 sites
253 fans
Current versions available: 3
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


Moodle 3.9: If you are running Moodle 3.9, it is essential that you use the Moodle 3.9 (or higher) version of the Tiles plugin.  The Moodle 3.7 version is incompatible (following a change to Moodle core) and will cause you problems.  You can see which version of 'Tiles' you are running under Site administration > Plugins > Plugins overview > Course Formats > Tiles Format.


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


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

Comments RSS


  • Tue, Mar 26, 2019, 7:26 PM
    Hi Miguel the animations are not compatible with internet Explorer. In the next release ( which I will upload here within a week or so) I will have the plugin detect if IE is being used, and switch to "no animation" mode for that user if it is.

    if you need a workaround with the existing release, users can turn off navigation themselves using the "Animated navigation off" control, or a site admin can disable animation for everyone under Site Admin > Plugins > Course formats > Tiles format (set these 4 controls to no/none: "Use javascript navigation from Tiles main page", "Use JS navigation for single section page", "Modal modules", "Modal resources")

    Thanks to you and Nicolas for the feedback!
  • Wed, Mar 27, 2019, 9:54 PM
    Hi guys
    1. I have a problem.
    How do I insert a URL (HTML) in modal format?
    2. Another problem, when I put a page to show activity as completed when conditions are satisfied> The student should visualize this activity to complete it, not change by modal navigation between sessions or blocks, I need to click close to change the activity status.
    Thank you
  • Wed, Mar 27, 2019, 11:44 PM
    When we leave editing mode enabled, leave all sessions on a single page expanded, this way it is easier to duplicate and drag an activity or any feature for the other sessions.
    Thank you
  • Thu, Mar 28, 2019, 8:54 PM
    David Watson,

    The extended sessions probe can be seen in the plugin wiki. We solved this problem, thank you very much.

    But I believe that after you've changed "Ensure that completion checkboxes respond correctly to auto complete events" the questionnaires are also being marked as completed just by clicking on the questionnaires and tasks, but the correct thing is that they get a score to have the activities completed.
    Can you help us?
    Thank you
  • Sun, Mar 31, 2019, 7:44 AM
    Hi David! I love this plugin!
    Will the addition of pictures to Topic and Activity/Resources tiles ever be possible with this plugin?

  • Sun, Mar 31, 2019, 10:40 AM

    Finally I can write in the forum. To resume my comments,

    I just love your Tiles race format. I have a small problem however regarding the resource layout. I do not want to use under tiles. In order to facilitate the structure and the sequence to follow for the students I use a lot the movement of resources to the right or to the left. It creates a sort of hierarchy between activities and resources. However, your theme does not support this option. Here is a video illustrating the problem:

    Also I do not understand why it is not possible to open a URL resource (such as a Youtube video) directly inside a pop-up window without having to make two clicks to fit in and also leave the heart of course. It would be an interesting improvement.

    Sincerely for almost a year I have experienced a ton of course format. Your is the most adapted and evolved I've ever experienced. Thank you.
  • Sun, Mar 31, 2019, 6:57 PM
    Hi addressing the last few questions:

    - Completion checkboxes - these are improved in version 3.3.6. Thanks to Bruno Henrique Cury for his help testing this behind the scenes.

    - Using photos on tiles - Kasper I added an FAQ about this. Maybe one day we could do it, if I get some more time, but no immediate plans. Grid format does offer this.

    - URL activity intermediate screen (too many clicks) - I hope to remove the intermediate screen in version 3.3.6, so this should be improved very soon.

    - Indenting activities in non-subtiles mode - Sébastien thanks for reporting this and for your kind comments. I have made some changes and indenting should be supported in version 3.3.6.

    - Embedding other websites in modal windows - I added an FAQ about this (please see the new "FAQs" button above). My latest thinking is that we could allow URL activities to launch as modal windows if the URL activity is set to "Display: Embed". I will come back to this once version 3.3.6 is done, but no change in this release.

    - Leaving sections expanded in editing mode - from version 3.3.6, the plugin will remember the last section you had expanded and, if you had all sections expanded, it will keep it that way for the session.

    I hope we can get version 3.3.6 released later this week, but more testing is required first.
  • Tue, Apr 2, 2019, 5:20 PM
    The code now showing at the source control URL (link at the top) is the code I intend to release as 3.3.6. I will be offline for a few days now, so am planning to upload the code to moodle.org at the weekend. If you test it before then and have any feedback, please let me know. Thanks.
  • Mon, Apr 8, 2019, 7:21 AM
    Amazing Course format option. Thank you very much for all the hard work!
  • Wed, Apr 17, 2019, 6:31 PM
    Just a quick note to say thank you for developing and continuing to develop this plugin. The recent addition of the javascript workaround for Internet Explorer is most appreciated!
  • Mon, May 20, 2019, 10:03 PM
    Hi David,

    Thank you for creating this beautiful course format. I am testing it at the moment and hope to be able to roll it out.
    A challenge for me though is how the sections are all collapsed when Editing mode is turned on. Generally teachers expect to be able to see where everything is when editing is on, and to be able to easily move content around from one section to another.

    Currently, to move File X from Section A to be the 2nd resource Section C:
    - I turn editing on
    - I need to already know which section File X is located in - otherwise I need to navigate around to the different tiles
    - I need to expand out Section A
    - I can now see File X and can drag it down to Section C.
    - I can see that File X is in section C. However, I can't see the other files in Section C
    - I need to expand out Section C because I need to re-position File X to be the 2nd file in Section C.

    It is for this reason I am nervous to roll it out! I need for a course format to be user friendly for the teachers and admins as well as the students.

    If all sections were expanded by default.
    - I turn editing on
    - I can see straight away where File X is located.
    - I can drag it down to Section C and simultaneously place it in position 2

    Thank you
  • Tue, May 21, 2019, 3:07 AM
    Hi Catherine

    Thanks for the kind comments. Some good news:
    - There is a "reveal all sections" button in the bottom right hand corner of the screen when editing mode is on. I accept that this is fairly well hidden!
    - For the next release (later this week I hope) the button will be moving to the top right of the screen and will be much more visible.
    - Once you click the button, it will remember to keep the sections expanded until you collapse them or log out.

    Longer term, I have plans to improve this further - I'd like to handle it in a similar way to the student screens, where content for additional sections can be loaded quickly without a full page reload being required. Full page reloads can take a long time if the course has a lot of content. I have some code for this already but it needs a little more work.
  • 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.
  • 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.
  • 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.
Please login to post comments