Skip Navigation

[Resolved] Masonry Grid in Content Template Not Working

This support ticket is created 4 years, 12 months ago. There's a good chance that you are reading advice that it now obsolete.

This is the technical support forum for Toolset - a suite of plugins for developing WordPress sites without writing PHP.

Everyone can read this forum, but only Toolset clients can post in it. Toolset support works 6 days per week, 19 hours per day.

This topic contains 2 replies, has 2 voices.

Last updated by dallasS 4 years, 12 months ago.

Author
Posts
#1511705

I am trying to: Create a photo gallery in a Masonry grid following this: https://toolset.com/documentation/user-guides/custom-content/create-image-galleries-using-toolset-and-custom-fields/

Link to a page where the issue can be seen: hidden link

I expected to see: The photos arranged in a Masonry grid format.

Instead, I got: The photos arranged in no grid at all.

I'm using the Views shortcode method (not Blocks), or more specifically, I'm using the code provided in a content template of my custom post type as per the example. The photos are showing on the page, but they are not arranged in a Masonry grid. The theme is already loading Bootstrap 3. I've also tried using that content template with the example code in a view and using the view shortcode on a page, but that returns basically the same results. I'm sure the View portion is working as it is querying the db and displaying the images, however, the images are not in any sort of grid layout and no changes to the code specified on the user guide page above seems to make any difference.

I am getting no errors in the console and the default class of "tb-repeating-field--grid" works as expected, and "tb-repeating-field--flexbox" produces a similar output, however "tb-repeating-field--masonry" produces just a vertical display of images in no grid or masonry format (see demo page). When I look in developer tools, it appears that the class "tb-repeating-field--masonry-brick" is not being applied to any images. Adding the class around the foreach shortcode doesn't apply it to each item, but instead wraps all the items.

#1511751

Modified CT accordingly to use Masonry JS library.

#1543257

any chance you could share some details? i'm having the same results trying to make this work with a view and custom taxonomy...
not sure what to fix.
maybe i'm barking up the wrong tree? would rather avoid wasting a bunch more hours trying to make it work if it CANNOT work this way.