In this example:
Ajax Load More and Salvattore JS combine to create CSS-Driven flexible grid layout, like Masonry.

Salvattore is a library agnostic JS script that will help you organize HTML elements according to the number of specified columns.

Note: Savattore is not compatible with the Search Engine Optimization add-on.

CSS

The following CSS is required by Salvattore to display Ajax Load More items in a column layout.

JavaScript

The following JavaScript should be placed inside your website JavaScript file and is used to trigger Salvattore after every almComplete callback.

Page Template

The following custom page template used for the Salvattore example.

The following shortcode was used to create the Salvattore JS example.

[ajax_load_more repeater="template_42" post_type="post, ajax_more" container_type="div" css_classes="salvattore" button_label="Load More Posts" transition_container="false" transition="fade" images_loaded="true"]

The following Repeater Template was used to create the Salvattore JS example.