0

I am trying to add a photo slider from Slick and I can't seem to get it to work.

HTML

<div class="victoria-slider">

        <div>Content1</div>
        <div>Content2</div>
        <div>Content3</div>
</div>

functions.php

function victoria_theme_script_enqueue() {

    wp_enqueue_style('customstyle', get_template_directory_uri() . '/css/victoria_theme.css', array(), '4.7.2', 'all');

    wp_enqueue_style('bootstrap', get_template_directory_uri() . '/css/bootstrap.min.css', array(), '3.3.7', 'all');

    wp_enqueue_style('slick', 'http://cdn.jsdelivr.net/jquery.slick/1.6.0/slick.css');

    wp_enqueue_style('slick-theme','http://cdn.jsdelivr.net/jquery.slick/1.6.0/slick-theme.css');



    wp_enqueue_script('jquery', get_template_directory_uri() .'/js/jquery.min.js', array(), '3.1.0', true);


    wp_enqueue_script('customjs', get_template_directory_uri() . '/js/victoria_theme.js', array(), '4.7.2', true);

    wp_enqueue_script('bootstrapjs', get_template_directory_uri() . '/js/bootstrap.min.js', array(), '3.3.7', true);
    wp_enqueue_script('slickjs', 'http://cdn.jsdelivr.net/jquery.slick/1.6.0/slick.min.js');




}


add_action(wp_enqueue_scripts, 'victoria_theme_script_enqueue');

JS

jQuery(document).ready(function($) {



            jQuery(".victoria-slider").slick({
                  dots: true,
                  infinite: true,
                  speed: 500,
                  fade: true,
                  cssEase: 'linear',
                  slidesToShow: 3,
                  slidesToScroll: 3

            });


        });

I have tried using the files and links to get it working still no sign at all. Nothing is happening at all. I just don't know what else to do. It's for every slider I tried to add to my theme.

Improve this question
3
  • Have you tried adding the script directly in your header.php for debug purpose? And if there is an error log or link to your website, please share it with us. – Jack Johansson♦ Feb 6 '17 at 9:06
  • What are the console log errors (if any)? – Jami Gibbs Feb 6 '17 at 13:32
  • There are no errors at all. I have already tried adding scripts to the header, still nothing works. – Michael Stokes Feb 6 '17 at 19:35
0

Two things to try:

  • Move the enqueue for slick.js above the enqueue for your custom script.

  • Declare Slick as a dependency for your custom script. Change the third parameter to include slickjs:

    wp_enqueue_script('customjs', get_template_directory_uri() . '/js/victoria_theme.js', array( 'slickjs' ), '4.7.2', true);
Improve this answer
3
  • It doesn't work – Michael Stokes Feb 6 '17 at 7:48
  • Hmm. Try adding JQuery as a dependency as well? – Mario Vega Feb 6 '17 at 10:19
  • That doesn't work either. – Michael Stokes Feb 6 '17 at 19:33
0

Would add this as a comment but not high enough reputation. Try removing the $ from the function($), I have had this cause unexpected issues in wordpress before

Improve this answer
1
0

I figured it out! The problem was my theme JavaScript file not loading. I changed it from true to false and now I got it working!

Improve this answer

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Not the answer you're looking for? Browse other questions tagged or ask your own question.