[Resolved] Problem with GeneratePress & Masonry collapsing over content

[Mathieu]

Hi Tom,

It is a problem I had at various point while building my child theme (like here : https://generatepress.com/forums/topic/add-text-to-the-homepage-in-a-blog/)

There is masonry that is going over the content to various degrees. I fixed some by adding empty paragaphs but it’s not super clean. I tried clear: both, clear: left, clear:right, various padding, margin and br.

There’s nothing that really fixed it properly and permanently.

Here’s an example, on mobile : https://chefcuisto.com/cuisine/fast-food/ and a screenshot if you don’t see it : https://prnt.sc/ra1lml

Kindest regards,

[Leo]

Hi there,

Any chance you can disable all plugins except GP Premium to eliminate conflicts from other plugins first?

Please remove your custom CSS fix while we are debugging as well.

Let me know 🙂

[Mathieu]

Hi Leo,

Unfortunately, I can’t disable every plugins on the live website but I did manage to reproduce it on a trimmed down version (http://nouveauchef.quebecblogue.com/category/type-de-recette/).

When I disable the lazyloading of the image (by Autoptimize), it is going away.

However, Masonry is repainting itself succesfully with the lazyloaded images everywhere else. It’s like there’s no triggering of masonry on the “taxonomy-description” class even if it is the main content element.

I can fix it easily myself by adding a class to the image that will be excluded from the lazyloading but it does seem to me that it is also something that should work.

I’ll wait for your take on that.

Kindest regards.

[Leo]

Can you make sure to use our suggested setting for Autopimize here?
https://generatepress.com/fastest-wordpress-theme/

Let me know 🙂

[Mathieu]

It’s not an issue with autoptimize settings. I have a lazyloaded image (from autoptimize) in the taxonomy-description area but that doesn’t trigger a masonry repaint like it does elsewhere.

[Tom]

Hi there,

Does this PHP fix it?:

add_action( 'wp', function() {
    remove_action( 'generate_archive_title', 'generate_archive_title' );
    add_action( 'generate_before_main_content', 'generate_archive_title', 1 );
} );

[Mathieu]

Nope. Same thing.

[Tom]

Is that code still active here?: http://nouveauchef.quebecblogue.com/category/type-de-recette/

If not, can you re-add it?

[Mathieu]

It wasn’t, now it is back. But the first line, remove_action doesn’t work as it is outputting the block twice.

I’ve commented line 33 of generatepress/archive.php for the time being.

//do_action('generate_archive_title');

[Tom]

Can you try the updated code?: https://generatepress.com/forums/topic/problem-with-generatepress-masonry-collapsing-over-content/#post-1183790

[Mathieu]

Yes, it does solve the masonry problem. It does add some padding and push it to the right tho.

Also, work better wrapped in

if (is_archive()) { }

Otherwise it adds “Archive” to every page.

Thanks

[Tom]

You can fix the margin with this:

.page-header {
    margin: 0;
}

This looks like something we can improve in the plugin itself. I’ll see what I can do 🙂

[Mathieu]

Thanks a lot again Tom 🙂 It was a small glitch but I am glad you made it works!

Have a nice day.

[Tom]

No problem! You too 🙂

[Author]

Posts