Masonry

Makes the jQuery Masonry plugin available to Drupal as a library.

From masonry.desandro.com:

Masonry is a dynamic grid layout plugin for jQuery. Think of it as the flip-side of CSS floats. Whereas floating arranges elements horizontally then vertically, Masonry arranges elements vertically, positioning each element in the next open spot in the grid. The result minimizes vertical gaps between elements of varying height, just like a mason fitting stones in a wall.

Sub-Modules

Masonry contains three sub-modules for integrating with fields, Views and Context.

Masonry Field Formatter

This sub-module allows you to display multi-value fields in a Masonry grid layout. It integrates with existing formatters so you don't lose existing formatter-specific options (such as Colorbox settings).

Masonry Field Formatter currently integrates with the following field types:

• Image
• Long text
• Long text and summary
• Media

Masonry Views

This sub-module provides integration with Views to allow you to display practically any content on your site in a Masonry grid layout.

Masonry Context

The Context sub-module provides a context reaction that adds the Masonry javascript to a defined container with a set of defined items.

In all sub-modules, some default styling is used to make the Masonry grids display properly out-of-the-box (namely the width and margin of items in the grid). You can (and should) override this default styling with your own CSS as appropriate.

Required Modules

• Libraries (2.x)
• Field formatter settings (Masonry Field Formatter only)
• Views (Masonry Views only)
• Context (Masonry Context only)

Installation

1. Download the jQuery Masonry plugin (jquery.masonry.min.js) to your libraries directory (should be available at /sites/.../libraries/masonry/jquery.masonry.min.js)
2. Download and enable the required modules listed above
3. Download and enable Masonry (and optionally its sub-modules)
4. Check /admin/reports/status to ensure the jQuery Masonry plugin was properly detected

Downloads