Home Forums Trusted Pro Masonry sometimes messed up.

This topic contains 6 replies, has 2 voices, and was last updated by  Adri Oosterwijk 7 months, 2 weeks ago.

Viewing 7 posts - 1 through 7 (of 7 total)
  • Author
    Posts
  • #2996

    Adri Oosterwijk
    Participant

    Hi,

    I’m very happy with the masonry layout for archives. Especially the masonry for WooCommerce archives. However I noticed that sometimes the layout is messed up. See screenshot:

    reloading the pages fixes it. But I can’t expect a visitor to reload th page when it looks messy.

    I did some investigations and the solution should be the installation of the imagesLoaded.js file.

    Strange enough when searching the source code I did noticed that this script is already loaded.

    Hen I inspect the page I see that there are some errors.

    Any idea?

    #3002

    Andy
    Keymaster

    Thank you for letting us know about this issue.

    The theme did previously make use of imagesLoaded to only position the items after all images had loaded, but it didn’t work very well with the homepage product tabbed areas so we decided to not use it when we added masonry to the homepage tabs.

    We tested it without and didn’t see any issues but I will of course look into the issue and see if we can fix it.

    #3010

    Andy
    Keymaster

    Hi Adri,

    As a temporary fix, could you try adding this CSS and please let me know if this works for your site.

    .woocommerce ul.products li.product:before,
    .woocommerce ul.products li.product:after,
    .woocommerce-page ul.products li.product:before,
    .woocommerce-page ul.products li.product:after{
        content: "";
        display: table;
    }
    #3035

    Adri Oosterwijk
    Participant

    Hi Andy,

    I added the code to my css file and it looks like it is working. I did noticed however that the imagesLoaded script is fired. I saw this line in my html output:

    <script type="text/javascript" src="http://stockphotosite.dev/wp-includes/js/imagesloaded.min.js?ver=3.2.0"></script>

    I don’t know if it is called but still…. I thought to let you know.

    I suggest to keep the thread open for a while. I will test it further and let you know.

    Best Regards,

    Adri

    #3037

    Andy
    Keymaster

    Thanks for letting me know that the css is working for you.

    WordPress includes imagesLoaded by default when masonry is enqueued, so that is why you see it loaded in your html source.

    #3042

    Andy
    Keymaster

    Hi Adri

    Version 1.1.5 is now available with a fix for this issue.

    #3061

    Adri Oosterwijk
    Participant

    Hi Andy,
    After updating the theme (and disabling the temporary css fix) it looks ok Thank you for solving it this quick.
    I will mark this topic as solved. I will open a new one if needed.

    Have a good one!

    Cheers,

    Adri

Viewing 7 posts - 1 through 7 (of 7 total)

You must be logged in to reply to this topic.