"jQuery is not defined" when added right before the </body>

Technical Q&A
1

Hey everyone,

I am trying to add a simple line of jQuery to my theme. I know jQuery is included, because when I type this into the console:

console.log(jQuery().jquery);

It returns: 3.5.1. If I type any other jQuery into my console, it works as expected.

I’ve tried adding this snippet just before the tag in my theme.liquid file, to ensure it is loading in after jQuery has been referenced:

{% render 'globo.preorder.script' %}

But still I see the error - Uncaught ReferenceError: jQuery is not defined
Whether I use the $ or jQuery, the result is the same. Any ideas as to why this could be happening?

2

Hello, @tablocreative

Please add jquery between

3

Hi,

Could you please share your store URL?

4

I am working on a Preview theme, so it has not been published yet.

5

Like I mentioned, I know jQuery is already being referenced in my theme, so I didn’t want to manually include it a second time as I know that can cause issues of its own.

6

@tablocreative Please share the preview URL. Please go to website, Find Share Preview button on the bottom right side, click on it, copy the URL and send here

7

I didn’t know that was an option, thank you for pointing that out!

https://30qhnwt06c9cpwm7-51927449774.shopifypreview.com

8

@tablocreative Where the jquery is included?

9

Hi,

It seems that jQuery is loaded via this app https://apps.shopify.com/smart-tabs

I think it’s better to include another jQuery at the tag.

But if you still want to use jQuery of the app, you can try the following code

setTimeout(() => {
  // Wait jQuery loaded
  while (!jQuery) {}

  jQuery( document ).ready(function() {
    console.log('testing');
  });
}, 100);
10

I’m getting this error also and it’s preventing my filters / site search from working (very important). Is it possible you can help out please? Would mean the world

11

Hi @tablocreative ,

This is possible because your jQuery is declared defer, so it won’t work when you call at the bottom of body.

So you can change the jQuery call method or paste the code in a js file.

Or please send me the preview link, I will check it for you.

Hope it helps!