Masonry Topics format

Course formats ::: format_masonry
Maintained by RenaatRenaat Debleu
This course format displays all sections like a masonry build brick wall. Every section can have a different background and is dynamically placed into a fluent style page.
Latest release:
444 sites
34 fans
Current versions available: 9

This course format displays all sections like a masonry build brick wall. Using YUI (, every section is dynamically placed into a fluent style page.  Each section can have a different background color.

Warning: The order of the topics shown depends on the screen size and can vary from screen to screen.

Tests Coverage Status



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


Renaat Debleu (Lead maintainer)
Please login to view contributors details and/or to contact them

Comments RSS

Show comments
  • Renaat
    Tue, Feb 23, 2016, 12:39 AM
    Hello Andrew,

    It is a bold statement that absolutely nothing happens. I'm sure a lot of things happen in the background, and most important a javascript error. Can you post the output of the console tab (press F12 in your browser and choose console [Chrome: Ctrl+Shift+J Firefox: Ctrl+Shift+K, Internet Explorer: Ctrl+2]), so I have some more information?

  • Carlos Andrés Martínez Anguiano
    Thu, Jun 16, 2016, 1:42 AM
    This seems like a great format to test. Do you have plans for updating for Moodle 3.1, or this plugin works with that version too?
  • Renaat
    Thu, Jun 16, 2016, 3:52 PM
    Let's say it is 95% compatible with Moodle 3.1. I have seen some small issues in different Moodle installations, (yes before a new release there is extensive testing). so I cannot release a stable version yet. One of these days I plan to post a new development version on Github to collect additional feedback.

    Moreover, the upgrade involves also a move from YUI into AMD and this takes more time than I thought.
  • Sat, Oct 8, 2016, 11:55 PM
    Is there a solution for the textfield problem? Textfields are not showing in this course format.
  • Renaat
    Mon, Oct 10, 2016, 3:58 PM
    Hello Sebastian,

    I only find textfields as part of the feedback module (mod/feedback/item/textfield/textfield_form.php). Are you having problems with the feedback module text fields in this course format? Can you send me a screenshot as I can not reproduce this error?
  • Fri, Oct 14, 2016, 6:34 AM
    Hi Renaat,

    i am sorry, i mean the label ressource. I dont know why i wrote textfield.
  • Renaat
    Fri, Oct 14, 2016, 7:33 PM
    Indeed, the label got some update so it is displayed as a block. I will update the plugin soon to fix this issue.
    THX for the report.
  • Sat, Oct 22, 2016, 12:32 AM
    Error on 3.0 Moodle version:

    Undefined property: stdClass::$format_masonry_defaultbackgroundcolor in moodle/course/format/masonry/lib.php on line 51
  • Sat, Oct 22, 2016, 12:32 AM
    Not really working for me.
  • Tue, Nov 15, 2016, 3:31 PM
    Hi Renaat,

    css for the label is working! Great Job smile

    But there is another problem in conjunction with Eduhub Theme.
    I made a screenshot () to show you the problem. The settings menu is flickering when there are links behind.
    When i comment out the following line in masonry style.css flickering stops.

    #page-course-view-masonry .sitetopic .section li.activity:hover,
    #page-course-view-masonry .course-content .section li.activity:hover {
    /* opacity:0.6;
    filter:alpha(opacity=60); */

    On every update, my changes are lost, so can you please solve this in the next version?
  • Renaat
    Thu, Nov 17, 2016, 12:06 AM
    Hi Sebastian

    Thanks for the info. I will have a look at it for the next version.

    Perhaps a solution would be to add some lines to your theme css file, after an update your changes would not be lost...
    #page-course-view-masonry .sitetopic .section li.activity:hover,
    #page-course-view-masonry .course-content .section li.activity:hover { opacity:1 !important;}
  • Wed, Jan 25, 2017, 7:28 PM
    Hello, the format presents error when performing a backup in Moodle "error / setting_invalid_ui_label". How to solve the error?
  • Renaat
    Thu, Jan 26, 2017, 3:08 AM
    Hello John,

    can you give me your Moodle and plugin version?

    In an effort to reproduce the error, I added a new scenario to the acceptance testing of the plugin:
    Given the following "courses" exist:
    | fullname | shortname | format | coursedisplay | numsections |
    | Course 1 | C1 | masonry | 0 | 4 |
    And I log in as "admin"
    And I am on site homepage
    And I follow "Course 1"
    And I backup "Course 1" course using this options:
    | Confirmation | Filename | test_backup.mbz |
    Then I should see "Restore"

    But I do not see any error:

    $ moodle-plugin-ci behat
    RUN Behat features for format_masonry
    Moodle 3.3dev (Build: 20170119), 5130953c8a103c44111a3c987cf47ed3c7a5c84b
    Php: 7.0.15, mysqli: 5.5.53-0ubuntu0.12.04.1-log, OS: Linux 3.13.0-103-generic x86_64
    Server OS "Linux", Browser: "firefox"
    Started at 26-01-2017, 02:32
    ...................................................................... 70
    4 scenarios (4 passed)
    72 steps (72 passed)
    1m21.02s (68.77Mb)
    The command "moodle-plugin-ci behat" exited with 0.
  • Tue, Jun 25, 2019, 7:37 AM
    hello developers, very good this plugin, I've been using it for a while.
    I installed version 3.5 (ie, 3.4+ (2018111801)) and when I add an image to the first section, it does not appear and the rest of the sections look bad.
    Best regards.
  • Renaat
    Mon, Jul 1, 2019, 9:11 PM
    Hello Veronica.

    There is a problem tracker to report these issues (preferably with screenshots).

1 2 3
Please login to post comments