Grid display is not working

Hello!
Thanks for the feedback!

As I see it, the problem with loading the script Masonry. My plugin uses Masonry, included in the WordPress. On your website is installed Rocket Loader – “a general-purpose asynchronous JavaScript loader coupled with a lightweight virtual browser which can safely run any JavaScript code after window.onload”.

Most likely, Rocket Loader is causing the problem, turn it off – and the plugin will work correctly.

Hey, thanks for answer, I’ve disabled the Rocket Loader but it seems that the issue is still the same. I can’t figure out what could cause Masonry to break.

Perhaps another plugin includes Masonry and they conflict with each other. I’ll add the ability to disable Masonry in the plugin settings in the next release to avoid such conflicts.

I’ve disabled all the plugins/turned off the Cloudflare and tested everything on my local copy too. It still is the same. I’ve also tried testing it on another theme and the result is still the same. This is really puzzling, I can’t really figure our what could getting it to malfunction.

Look at source code of your home page. In head section you can see this code:

<script>
jQuery(document).ready(function($) {
    var $container = $('#grid-container');

    // initialize
    $container.masonry({
        gutter: 10,
        itemSelector: '.lptw-grid-element'
    });
});
</script>

It’s incorrect, this code loaded at the end of page in file lptw-recent-posts.js and the file load after Masonry initialization. Try to remove this code from head section, I think it’s a solution of your problem.

Removed it everything is still the same :/ I thought the jQuery wasn’t functioning so I called it from the head section. I don’t know what else could be breaking jQuery.

I’m not sure but I think what this problem may caused when standard WordPress jQuery instance is replaced by CDN instance, in your example it’s look that:
I’m not sure, but I think that this problem can be caused when the standard WordPress jQuery instance is replaced by the CDN-loaded instance, in your case it looks like this: <script type='text/javascript' src='https://ajax.googleapis.com/ajax/libs/jquery/1/jquery.min.js'></script>
Do you insert this code in your header.php manually or it’s inserted by another plugin?

I’m calling it via snippets plugin in this case, In most cases I do it via functions.php. I’ve removed the snippet but I don’t see any difference.

OK, I see that Masonry and jQuery is working correctly. I think the problem caused by some CSS or JS, may be problems with Bootstrap, but I’m not sure. Try to switch off other CSS one by one.
Do you use public or custom WP theme? Can you give me a link to theme download, I try to check compatibility this theme and my plugin.

I’m using Enlightenment theme from WP repository https://www.ads-software.com/themes/enlightenment/.

Hi,

I love the plugin.

Problem is the images are left and I can not get the images to be centered on the page. I would like 4 images in the top row centers on the page. I have tried everything.

Thanks!

S.

https://www.sharontalksjobs

Hello, scooke4!
Thanks for the feedback!
Please give a correct link to your website.

Hey NikS2,

it seems you’ve figured it out!

Since I’m using the same theme and am struggling with the same problem, would you care to share the solution?

Many thanks!

I’ve just updated the plugin to the latest version.

Ah, great! So I’ll re-install the plugin and try again.