If i use jQuery(document).ready(function(){ ... my code}) = undifined function

Question

I'm trying to use owl carousel in a wordpress ACF custom block.

owl carousel works if I don't put jQuery(document).ready in my script. But if I have jQuery(document).ready, the console tells me "jQuery (...). OwlCarousel is not a function".

Then i don't know if there is link beetwen both but i have thumbnail gallery to click for launch slider on specific image and that code :

jQuery('.single_image_gallery').click(function(){
    mySlide = parseInt(jQuery(this).attr('data-slide'));
    jQuery(mySlider).trigger("to.owl.carousel", [mySlide, 1,true])  
})

not working at all.

i know there is problem with jQuery migrate for wp 5.5 but I tried with the plugin "Enable jQuery Migrate Helper" and the result is the same....

Answer 1

Try doing this.. Sometimes plugins can interfere with jQuery

jQuery(function($) {
// then use it like this
 $('.single_image_gallery').click(function(){
   mySlide = parseInt($(this).attr('data-slide'));
   $(mySlider).trigger("to.owl.carousel", [mySlide, 1,true])  
 });  
});

This way you import $ locally and it should prevent it from interfering with other global scripts or plugins