Essential grid not loading properly

Support
#1

Hi guys. I am using essential grid throughout my page, and I suspect that something with the plugin is not right. Symptoms:

  1. Both at the frontpage and other pages some of the plugins are present in the backend, but not displaying on the frontend.
  2. The site loads slowly, when the essential grid plugin is activated. Deactivating the essential grid leads to significant lower loading time.
  3. The link / button at the lower frontpage is not responding (I know this is a different topic, but when I deactivate essential grid, it works).
  4. The second & third essential grid on the frontpage does not display at all at the frontend.
  5. In the backend, when installing the first essential grid that displays on the top, the backend page behaves strangely and I cannot edit the sections properly any longer. To make changes I will have to first delete this top grid, do the changes, and reinstall.

I will send login credentials separately. Thanks.

#2

Hey there,

There are scripts conflicts in your site.

Please check for the following:

  1. Ensure everything is up to date according to our version compatibility list at https://theme.co/apex/forum/t/troubleshooting-version-compatibility/195. Please follow the best practices when updating your theme and plugins. See https://theme.co/apex/forum/t/setup-updating-your-themes-and-plugins/62 for more details.

  2. Clear all caches including browser cache then deactivate your caching plugins and other optimization plugins.

  3. If you’re using a CDN, please clear the CDN’s cache and disable optimization services.

  4. Test for a plugin conflict. You can do this by deactivating all third party plugins, and seeing if the problem remains. If it’s fixed, you’ll know a plugin caused the problem, and you can narrow down which one by reactivating them one at a time.

  5. Remove custom CSS, Javascript and templates.

If those doesn’t help, please keep all third party plugins deactivated and customizations removed.

Thanks.

#3

Hi.

  1. Everything was and is up to date
  2. Caches was and is cleared. Cache plugin deactivated together with other plugins.
  3. Cloudflare cache purged and cloudflare set on hold.
  4. Plugin conflict conducted - tested one by one…
  5. CSS and Javascript removed.

So, two comments:

i)
I filed the code below (copied from theme.co support) in one of my essential grids under the designated API/Javascript under the essential grid settings of the specific plugin.

(function() {
 // change the number "3000" to however many seconds should pass before the Grid's page changes
 var interval = 3000, timer, mouseOn;
 jQuery('.esg-grid').on('mouseenter', function() {
 mouseOn = true;
 clearInterval(timer);
 }).on('mouseleave', mouseOut);
 function mouseOut() {
 mouseOn = false
 timer = setInterval(changeGrid, interval); 
 }
 function changeGrid() {
 jQuery('.esg-right').trigger('click');
 }
 var gridLoaded = setInterval(function() {
 if(jQuery('.esg-grid').is(':visible')) {
 clearInterval(gridLoaded);
 if(!mouseOn) mouseOut();
 }
 }, 500);
})();

Removing the above code solved part of the problem: The backend no longer behaves strangely.

ii)
The frontend issue remains. Having done as you requested both before I filed my question, and again after having received your ticket, I am positive that the problem is not other plugins, but the essential grid plugin itself.

So …

a) I don’t believe it myself, but to be sure: Any restrictions with regards to several essential grids on the same page?

b) How to solve the frontend problem, i.e. that some of the essential grid content does not display?

c) Since the above code was ‘harmful’- which code would be the right one to insert in order to achieve the function of automatic sliding (autoplay) in the plugin?

Thanks.

#4

Hi There,

a.) No, there’s no restriction on the number of grids you can display on a page. As long as your site memory can handle the content.

b.) The error on the frontend is because of the following code on your customizer:

    jQuery("body").css("background-position","50% " + (jQuery(this).scrollTop() / 2) + "px");
});```
Update to this:
```jQuery(window).scroll(function () {
    jQuery("body").css("background-position","50% " + (jQuery(this).scrollTop() / 2) + "px");
});```
There's a typo/syntax error. I did update this `jQjQuery` to this: `jQuery`. A syntax error might stop other jquery function from working. Try that and let us know how this goes.
#5

Hi. Thanks. Unfortunately, that didn’t do it. See attached. Next? Thanks.

#6

Hi there,

Sliders, grid, and so on, are plugins dependent to visible element (element with dimension). Your columns where the grid is placed has fade in animation which started as the hidden element (element with no dimension), hence, the grid won’t render. The reason you’re given that code before.

I like to turn off the fade in effect of your column, but it won’t save. This http://nblund.com/cornerstone-endpoint return 404 upon saving, which means, an internal security is blocking. A lot of issues I think, I recommend cloning your site to a staging outside your current host and test it again. And we’ll test it there too.

Thanks!

#7

Hi guys. As far as I can see the column fade effect IS turned off now. Not sure I understand the ramifications of the 404 you mentioned. For what it is worth, it seems like the essential grid problem occurs, when I apply grids relating to my blog / posts. Can you recommend a particular solution for testing outside current host (I have no such option at this point)? Thanks.

#8

Hi There,

I can see that fade in animation was already remove on the column settings where Essential Grid was added, yet still no content shows. There’s no more error. I did check the essential grid and notice that even on the preview there’s no content displayed. See this: https://screencast-o-matic.com/watch/cbjunelSd8 Now, the issue might not be coming from the content builder but on essential grid settings. See this documentation here. Under Source Tab > Category Relation: You have chosen AND. There might be no post that fall under that filter. Try to choose OR. For more clarification on how that specific settings work, see this detailed explanation.

Regarding the 404 error, sometimes this stop the builder from working as expected like not saving your update on the page. Please try testing for a plugin conflict. You can do this by deactivating all third party plugins, and seeing if the problem remains. If it’s fixed, you’ll know a plugin caused the problem, and you can narrow down which one by reactivating them one at a time. You also have caching plugin, make sure to clear cache before checking again.

If you don’t have other hosting account somewhere where you can test, let’s check first if the issue is an effect of the plugin. Let us know how this goes.

#9

I really really appreciate your help :slight_smile:

So, under Source Tab > Category Relation I have changed AND to OR. No change (not even on the preview). Then deselected all categories and selected all of them again. Then the grid turned up on the preview - still not on the front end, however.

I have tested for plugin conflict many times without finding the root cause. Do you still want me to try again?

And yes, I do not have another hosting account.

Look forward to hearing from you again. Thanks.

#10

Hi There,

Did you save essential grid when you change Category Relation to OR? I can see it is still AND. See this: https://screencast-o-matic.com/watch/cbjUXOIcbG. Make sure to save it and since you do have caching, try to clear cache. Then let us know after that.

#11

My mistake. Now it seems to work just fine. Thanks so much, Lely.

#12

You’re always welcome!

Glad this is now sorted out.

Cheers.