Thanks! Please check the following:
Please read carefully! All purchases are final. Refunds will not be provided under any circumstances.

System requirements
License agreement
Refund policy
Purchase process
Pricing
Paddle
Customer support

System requirements
All the stacks sold through this website require RapidWeaver and the Stacks plugin. They will not install or work with any other publishing platforms (like Flow, Drupal, Blocs or Wordpress).

We recommend you aim towards installing the latest version of RapidWeaver that your computer is capable of running (preferably RapidWeaver 7 or greater) and Stacks 3 or later. Both are a separate purchase if you do not own them already.

Stacks4Stacks generously provides you fully-functioning free demo versions of everything sold on this website. This enables you to fully test addons before committing to a purchase. There are no time or functionality limitations applied.

If you cannot get the free demo version to work, DO NOT proceed with purchasing the stack - because the purchased stack is unlikely to work any better for you. Please request technical assistance first.

License agreement

You may use a purchased stack an unlimited number of times in personal or commercial projects and request technical support.

We permit you to install stacks onto all computers that you own. You are permitted to make private archival backup copies (e.g. iCloud, Disk Blaze, Google Drive or Dropbox).

You may not resell, redistribute or make a stack available for download, remove copyright credits, license information, or claim the stack to be your own creation. This includes free stacks, demo stacks or paid stacks, in modified or unmodified states.

The software is provided "as is" without any implied or expressed warranty of merchantability or fitness for purpose. In no event shall the authors or copyright holders be liable for any claim, damages or other liability, whether in an action of contract, tort or otherwise arising from, out of or in connection with the software or the use or other dealings in the software.

Refund policy
By purchasing from this website, you agree that your purchase will be available immediately via digital download and that you waive your statutory right of withdrawal.

All purchases are final. Refunds cannot be provided (we physically cannot un-download or remove stacks from your computer) under any circumstances.

You are reminded to make use of the free demo versions already provided on the website, to fully evaluate stacks for compatibility and suitability before making a purchase.

If you cannot get the free demo version to work, DO NOT proceed with purchasing the stack - because the purchased stack is unlikely to work any better for you. Please request technical assistance first.

Be certain that the stack you are buying is actually the one you want, and that you don't already own it or are confusing it with another stack of similar name or functionality.

Purchase process
The checkout system is provided by Paddle. An attempt is made to display prices in your local currency, with relevant taxes applied.

To complete your order, you must supply a valid email address. Your purchase receipt and download link will be sent to this address you supply. If you do not receive your purchase shortly after completing it, please carefully check your spam or junk mail folders.

Your purchases are available to re-download at anytime, via this secure order lookup page.

Pricing
Prices shown on the website include any applicable VAT or sales tax. You will be sent a full receipt by email. Charitable and bulk discounts may be available on request. Please get in touch if you have any queries about our pricing.

Paddle
Our order process is conducted by our online reseller Paddle.com. Paddle.com is the Merchant of Record for all our orders. Paddle provides all customer service inquiries relating to order processing. Paddle also provides an order lookup system, commonly referred to as your Paddle Account.

Customer support
If you have questions that relate specifically to a stack, you should make contact via the contact page.

General questions can be asked on the RapidWeaver Community Forums.
Expand
In the past, the Masonry stack has been successfully used for the following tasks:
  • A grid of thumbnail images with links that reveal larger photographs when clicked.
  • Simple web stores combining images, written content and 'buy now' buttons created with PayPal or Mal's E-commerce or Stripe.
  • A video gallery, by combining Masonry with popular video stacks like Player, VideoPlayer, VimStack and uTube.
  • Tables of forthcoming calendar events, including maps and downloadable .ics files generated with AddEvent.
  • Creation of a TOC (table of contents) providing section headings, summary text and links.
  • Presentation of client testimonials and reviews from past customers.

Individual bricks can be set as links to other webpages or configured to launch lightbox stacks. Another bonus feature is the ability to make bricks time-sensitive and have them hidden or shown when a certain time has passed - particularly useful for building a calendar of events.

Novice RapidWeaver users should face no intimidation or difficulty constructing layouts with Masonry. We provide only the most essential settings to get the job done! A drag-and-drop user interface makes setup easy. Likewise expert RapidWeaver users will be thankful for the provision of many class selector names in the source code for Masonry; thereby permitting further extension of the stack styling with custom CSS code.

An alternative to Masonry is our ProGallery stack that merges both a masonry grid layout with an image or video gallery.

Examples

Here are two examples of the Masonry stack. Starting with the first example, here we are using the default settings (CSS column layout). This creates a simple and flexible masonry layout using pure HTML and CSS.
Image
Image
Image
Image
Image
Image
Image
Image
Image
Image
Image
Image
Image
Image
Image
Image
Image
Image
Image
Image
Image
Image
Image
Image
Image
Image
Image
Image
Image
Image
Image
Image
Image
Image
Image
Image
In this second example, we used the same collection of photographs as above, but this time presented as a Javascript layout. You can hopefully see how the Masonry Bricks are arranged slightly differently in this layout and it becomes feasible to set some Masonry Bricks wider than others.
Image
Image
Image
Image
Image
Image
Image
Image
Image
Image
Image
Image
Image
Image
Image
Image
Image
Image
Image
Image
Image
Image
Image
Image
Image
Image
Image
Image
Image
Image
Image
Image
Image
Image
Image
Image
The photographs featured in these two examples are © copyright of Adam Merrifield and Will Woodgate.

Setup

Follow these instructions for using Masonry in RapidWeaver...
  1. Once installed into Stacks and RapidWeaver, open your Stacks Library on a stacks page.
  2. Search for 'Masonry'. Drag and drop a copy of the stack into your webpage.
  3. Press the blue button to add Masonry Bricks to your Masonry.
  4. Within each Masonry Brick, add stacks of your choice (e.g. images, text, headings, video or HTML).
  5. If you want to apply links to a Masonry Brick or make the Masonry Brick time sensitive, select it in edit mode and use the settings in the side panel.
  6. To change the layout type used of styling (like spacing, borders or box shadow effects) select the main Masonry stack to change its settings.
  7. Preview the webpage to see the Masonry layout generated. Export or publish your webpage when done.

As mentioned above, Masonry supports many different content and stack types. This layout grid is not restricted to only being able to do images! Our example above uses warehoused images by means of simple HTML image tags inside HTML stacks:

<img src="https://example.com/images/tree.jpg" alt="A description about the image goes here.">

You can follow the same technique for warehoused images or use existing Image stacks if you prefer using dragged-and-dropped images instead.

Differences between the CSS Columns and Javascript grid layouts

You may have noticed in the Masonry settings that two grid layouts are offered to you. Essentially Masonry gives you two stacks in one! Here are the most noteworthy differences between the two.
 
CSS Columns
  • Faster loading, as the page opens.
  • Responds better to screen resizing and orientation changes.
  • If the content within bricks changes size (like a toggle) the layout reflows to fit.
  • Bricks are positioned top to bottom, then left to right (like newspaper columns).
  • More precise control of columns at different screen widths.
  • Significantly smaller codebase, less risk of conflicts with other stacks.
Javascript
  • Ability to set some bricks double or triple width.*
  • A subtle animation effect is applied when the page changes size or orientation.
  • Bricks are positioned left to right, then top to bottom.
  • Less suitable for complex stack types or content that changes size.
  • Better compatibility with older web browsers that lack CSS3 support.
* If using the Javascript grid layout, selecting an individual Masonry Brick allows you to change its width between normal, double or triple. Double width means the Masonry Brick spans two columns and triple means the Masonry Brick spans three columns. This setup works best where you have lots of normal sized Masonry Bricks to fill the gaps.

Both grid layouts are about the same complexity to setup, so it is well worth experimenting with both to see which one works best for you. CSS columns are simpler and more reliable; however the trade-off with this layout is that the Masonry Bricks may not render in the desired direction and all Masonry Bricks will be the same width.

Applying links to Masonry Bricks

It is common to set Masonry Bricks as links to resources or other webpages. You can apply links to content or buttons you place within each Masonry Brick. Alternatively you can select the Masonry Brick in edit mode and provide a link in its settings. Using this latter method, the link will be stretched over the whole Masonry Brick; so in effect the entire Masonry Brick becomes clickable. In edit mode, the link URL is displayed above the content. Custom attributes can be applied to the links if you prefer, like class or data attributes.

Lightbox support

Lightboxing is now provided on a BYO (bring your own) basis. Older versions of Masonry used to use the Nivo Lightbox. Some people found this too limiting or too unreliable. Lots of really good lightbox stacks already exist for RapidWeaver. So we decided to forego adding any dedicated lightbox support in the latest version of Masonry. You can now use the Masonry stack with almost any free or paid lightbox stack. This brings the benefit of greatly reducing the amount of code in your webpages and ensures the lightbox you configure for Masonry is consistent in function and appearance to lightboxes you are using elsewhere in your website.

Essentially there are two methods for lightboxing your content:

  1. Drag and drop a suitable lightbox stack into each Masonry Brick. A free lightbox stack like LiteBox would be perfect for this task.
  2. Add the lightbox stack somewhere else in the page. Where you see the setting to change the selector name of the 'trigger' enter .masonry_brick a in the box. Then your lightbox will open any link you have applied to the Masonry Bricks.

Some lightbox effects (like TopBox) have support for an extensive choice of different content types. When you are assigning links to your Masonry Bricks, it may be necessary to add additional custom attributes. Masonry supports custom attributes added to links, without any problem.