Grid Format

Course formats ::: format_grid
Maintained by Gareth J BarnardGareth J Barnard
A modular and visual course format. Hides all topics and creates a grid of icons (one for each topic) with short titles. Clicking on an icon brings up the content from the corresponding topic.
Latest release:
7439 sites
155 fans
Current versions available: 20

A modular and visual course format. Hides all topics and creates a grid of icons (one for each topic) with short titles. Clicking on an icon brings up the content from the corresponding topic in a "lightbox" style display.


The format comes with NO support.  Please see the 'Support' section in '' file that comes with the format.  This is because the format is complex and I regret that I don't have the time / resources to freely assist with questions pertaining to specific enhancements / changes / knowledge improvement.

I will investigate genuine bugs and issue fixes in a timescale set by myself.  When reporting issues you MUST clearly state the full version and release of both Moodle and the Grid format format as contained within their 'version.php' files - if not it takes me longer to figure out, often resulting in me asking for the details anyway and slowing the process of solving your problem down.  It really helps to upload and describe in detail the issue you are having on the 'Course formats' forum.

Screen cast:

More to follow as new icons have been added....

Privacy API support starts with V3.3.0.5 for M3.3 and V3.4.0.4 for M3.4 where the API has been implemented in the minor release of Moodle.


Screenshot #0
Screenshot #1
Screenshot #2
Screenshot #3


Gareth J Barnard
Gareth J Barnard (Lead maintainer): Maintainer
Please login to view contributors details and/or to contact them

Comments RSS


  • Wed, Sep 20, 2017, 9:33 PM
    Hi Gareth,

    Thanks! You are right - the problem was on our end. It's corrected now. Thanks for all your help with these great plugins!

  • Tue, Nov 14, 2017, 12:29 AM
    Just FYI - in case anyone is having similar problems. Hope this helps...
    I'm on Moodle 3.1.9 and using the Moodle 3.1 GridFormat plugin

    Moodle loses Grid Format plugin after every update

    update moodle (eg 3.1.7 to 3.1.8, and happened also 3.1.8 to 3.1.9)

    The plugin 'GridFormat' becomes inactive/removed and all courses revert to default format (eg Weekly topic)

    One resolution that has worked for me every time this happened is to reinstall the plugin manually / from zip file.

    When upgrading Moodle, Gridformat does not show/warn in the "List for Missing files" (ie when Moodle highlights any potential problems/database plugins which could not update subsequent to the update), so I was not aware of the problem until I viewed the courses.

  • Gareth J Barnard
    Tue, Nov 14, 2017, 1:15 AM
    Hi Seaghan,

    Thank you for your post but it is misleading. This is not to do with the course format (or probably Moodle core) but all to do with your upgrade procedure removing the Grid format files. I update via 'Git' all the time and have no issues, i.e. this sort of thing:
  • Me
    Sun, Nov 19, 2017, 5:46 PM
    Hi Gareth, regarding the issue of stopping youtube videos when switching sections or closing the grid view, i wrote a fix for it if you're interested (its not the best approach but its the best solution i could come up with since "stopVideo()" does not did not work for me.
    I added this code as a new function in the "module.js" file, and called it in the "grid_toggle" and "change_selected_section" functions.

    var iframes = document.getElementsByClassName("yt_frame"); // Should be added to all youtube iframes on the site.
    for (var i = iframes.length - 1; i >= 0; i--) {
    var currentSrc = iframes[i].src;
    currentSrc = currentSrc.replace('&autoplay=1','&autoplay=0'); // So the videos wouldn't start playing again.
    iframes[i].src = currentSrc; // "Stopping" the videos.

    Hope this is useful for you.
  • Gareth J Barnard
    Mon, Nov 20, 2017, 12:17 AM
    Thanks Ben,

    Interesting solution. Ok....

    Should it work on page load instead to prevent iterating every time a section is navigated to. As clearly even after it has done it's job for the whole page then the 'replace' will be called on every yt_frame class per click of the grid_toggle / navigation.


    var currentSrc = iframes[i].src;
    currentSrc = currentSrc.replace('&autoplay=1','&autoplay=0'); // So the videos wouldn't start playing again.
    iframes[i].src = currentSrc; // "Stopping" the videos.

    be simplified to:

    iframes[i].src.replace('&autoplay=1','&autoplay=0'); // So the videos wouldn't start playing again.


    Why did stopVideo() not work for you? What was the error message please?

  • Me
    Tue, Nov 21, 2017, 4:46 PM
    Hi gareth
    The code can indeed be simplified to:
    iframes[i].src = iframes[i].src.replace('&autoplay=1','&autoplay=0');

    as for the error message i got it was:
    "TypeError: iframes[i].stopVideo is not a function"
    And i get it even if i add the "enablejsapi=1" parameter to the src
  • Thu, Dec 21, 2017, 7:23 PM
    We are using Moodle 3.3.1 with the Lambda theme and use grid format . We have run into an issue like - Clicking on an icon brings up the content from the corresponding topic in a "lightbox" style display and it works till 7 topic, but if we add more topics/sections, while clicking it shows empty light box and the content is available only at the bottom of a course page.
  • Gareth J Barnard
    Sat, Dec 23, 2017, 10:16 PM
    Hi Irakli,

    The Lambda theme is a commercial one therefore I cannot test to confirm any issue. If the issue happens in the Clean or one of my themes I'll look and if its a bug will attempt a fix.

  • Me
    Sun, Dec 24, 2017, 4:59 PM
    As i understand the latest update added a feature that will hide hidden section from the grid view. I installed the latest version on my Moodle (3.2.1) and i made sure i check 'yes' in the 'defaultgreyouthidden' but:
    1. The positioning got messed up a bit (pushed to the right)
    2. Hidden section still appears
    i provided an image
  • Gareth J Barnard
    Sun, Dec 24, 2017, 9:29 PM
    This is a semi-automated reply. I'm sorry but I'm currently out of the office at the moment, but will return sometime in the future. In the case of an emergency, please don't panic but keep calm and carry on. At no point try and fix the issue with the CSS: html { display:none !important; }.
  • Gareth J Barnard
    Tue, Jan 2, 2018, 9:18 PM
    Hi Ben,

    With 1 - check the course settings as there is a setting for grid box alignment.
    With 2 - are you viewing the course as an editing teacher etc? Test as a student.

  • Wed, Jan 24, 2018, 3:41 AM

    We have done some testing with different screenreaders (NVDA and JAWS) and are unable to have the screenreader work with the Grid format. Are there any plans to make the Grid format ADA friendly with an update in the future?

    Thanks, Rob
  • Gareth J Barnard
    Wed, Jan 24, 2018, 4:23 AM
    Dear Rob,

    Please forgive the rant I am about to type. Ok, firstly what version of the Grid format are you using? Secondly I'm only maintaining for M3.2+. Thirdly, what is ADA please?

    Fourthly I have spent literally days and days over many years attempting to make the Grid format accessible. And every now and then somebody asks the very question you've just asked but provides no evidence of any specific problem that is actually occurring. Only once has someone actually bothered to point out a specific issue and work with me to resolve it, hence the current M3.2+ versions. I cannot get a copy of JAWS because its commercial and there is no 'developer' version. I'm fed up, really fed up with this same comment happening over and over and over again and yet no supplied evidence of any failure, so if you have it with steps on how to replicate then please do share it with me and I'll stop fumbling around in a dark shed attempting to solve a problem I'm told that exists but cannot see.

    So 'plans' = yes in fact the 'plan' has been running for years. I have added keyboard control and spent many hours reading the ARIA specifications and undertaking best judgement in terms of code changes.

    So please do explain to me in detail the interpretation of the words 'unable to have the screenreader work'. In what way does it not work? Everyone says it does not 'work' but does not say what. I may as well think that the format does not work because it does not turn on the central heating when its cold for all that I'm aware of its 'faults' in this regard.

    I'm so fed up with this now that I may just quit maintaining this format all together.


  • Wed, Jan 24, 2018, 5:34 AM

    I understand your frustration. We are using Grid format on Moodle 3.2. ADA stands for "Americans with Disabilities Act."

    When we try to use a screen reader with the grid format, the screen reader stays on the Moodle course homepage and does not read or recognize the content that is displayed on the "lightbox" style display. It seems like the screen reader does know that the lightbox page exists. We typically test with NVDA because it is a free downloadable tool.

    Thanks for your time.

  • Wed, Jan 24, 2018, 11:52 PM

    A slight correction to what Rob said (we work together and I'm the Moodle server admin here): we're actually using Moodle 3.3.3+ in our production environment, as well as Moodle 3.4+ in our staging environment, and on the master branch for Grid. The issue persists in both environments.

    I do a fair bit of coding as well, so I understand your frustration with a "it doesn't work" type comment with no information and zero steps to reproduce. So if there's anything we can do to assist with this, just ask. We'll do what we can.

Please login to post comments