lightSlider is not a function, wordpress

0 Views

I’m trying to add lightslider(http://sachinchoolur.github.io/lightslider/index.html) in WordPress but I got error 

Uncaught TypeError: jQuery(...).lightSlider is not a function(anonymous function) @ (index):99m.Callbacks.j @ jquery.js?ver=1.11.2:2m.Callbacks.k.fireWith @ jquery.js?ver=1.11.2:2m.extend.ready @ jquery.js?ver=1.11.2:2J @ jquery.js?ver=1.11.2:2

I’m trying with the simplest example from their website

Read More

HTML 

<ul id="lightSlider">
  <li>
      <h3>First Slide</h3>
      <p>Lorem ipsum Cupidatat quis pariatur anim.</p>
  </li>
  <li>
      <h3>Second Slide</h3>
      <p>Lorem ipsum Excepteur amet adipisicing fugiat velit nisi.</p>
  </li>
  <li>
      <h3>Third Slide</h3>
      <p>Lorem ipsum Excepteur amet adipisicing fugiat velit nisi.</p>
  </li>

</ul>

JavaScript 

<script type="text/javascript">
//Also tried to add noConflict() function
//jQuery.noConflict();
jQuery(document).ready(function() {
jQuery("#lightSlider").lightSlider(); 

});
</script>

Can somebody help me?
Thank you!

Post Views: 0

Related posts

4 comments

  1. I resolved problem. The problem exist because somehow jQuery were loaded after lightSlider.js . I don’t know how this happened, I just put jQuery to load first in wp_enqueue_script(), before anything else (before css, too) and lightslider.js at the end.

    I hope this answer will help someone more. Thank you for help.

  2. I had the same problem but I have fixed it.
    Just copy the entire code of lightslider.js and past it into:

    $(document).ready(function(){
   //code of lightslider 

});

  3. You should put dependency array('jquery') to load jQuery first.

    Example:

      wp_register_script( 'lightslider-js', get_stylesheet_directory_uri() . '/js/vendor/lightSlider/js/lightslider.min.js', array('jquery'), NULL, true );

Comments are closed.