Skip Navigation

[Resolved] Masonary grid layout for view height collaping with ajax

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 7 replies, has 2 voices.

Last updated by Minesh 5 months, 2 weeks ago.

Assigned support staff: Minesh.

Screenshot_2021-02-09 Our Work – Core6 Environmental.png
Screenshot_2021-02-09 Our Work – Core6 Environmental.jpg

I am trying to:
Setup a View with a taxonomy search filter using the built in Masonary output(css grid). Need to have the view update AJAX on change of filter.

What happens:
When you select a filter the results update but the height of the elements container collapses into nothing. I HAVE tested this on 2021 theme and no plugin installed and I get the same result!

Two images attached, one shows the filter updated using full page refresh(looks correct) . The other shows the ajax updated results and the collapsed height bug.



Languages: English (English )

Timezone: Asia/Kolkata (GMT+05:30)

Hello. Thank you for contacting the Toolset support.

I would like to know first how exactly you configured the masonary grid.

Can you please share problem URL where you added your view and I can see the issue and admin access details.

*** Please make a FULL BACKUP of your database and website.***
I would also eventually need to request temporary access (WP-Admin) to your site. Preferably to a test site where the problem has been replicated if possible in order to be of better help and check if some configurations might need to be changed.

I have set the next reply to private which means only you and I have access to it.

Screenshot_2021-02-10 Edit Page ‹ Core6 Environmental — WordPress.png
Screenshot_2021-02-10 Edit Page ‹ Core6 Environmental — WordPress(1).png

I literally used the block editor went to ADD new view, with Masonry layout. and added search filters of a taxonomy. It should be VERY easy to replicate the issue as I don't really have any other plugins and I tested with my theme and 2021 theme. changing the view to AJAX update on filter change causes the broken layout after filter. I am working locally, but happy to send you a full copy of my build if you can not replicate this, however I would appreciate you trying to replicate this as it is fairly easy to test.

I'm attaching a few more screens of my view settings.(the ones that matter) everything else is default! there is NO custom js or css for my view at all.


see newer reply...

Screenshot from 2021-02-10 10-42-20.png
Screenshot from 2021-02-10 10-41-42.png

here is another interesting discovery that may help.... on these 2 screenshots. One is before the filter and you can see there is inline styles on the .tb-masonry class as well as the tb-brick class that is controlling the layout. after the ajax runs what ever script is running to apply the inline classes to the grid is NOT triggering!!



Languages: English (English )

Timezone: Asia/Kolkata (GMT+05:30)

I checked with my test site and 2021 theme, where I've added the block view with masonary grid and added taxonomy filter but I could not notice the issue, may be you have added the background image or post/page thumbnail and I do not have any image on the page.

To ensure I've identical setup as you I will require duplicator copy of your site and I'll add the view with blocks as you added and then will update you with my findings.

Can you please send me duplicator copy of your site and tell me on what page you have added your view.

I have set the next reply to private which means only you and I have access to it.


I realized I had an old version of Blocks installed, updating to version 1.4.1 fixed the issue!



Languages: English (English )

Timezone: Asia/Kolkata (GMT+05:30)

Great 🙂 - You are welcome to close this ticket.