[Resolved] Slick Slider in GP Hooks

Home Forums Support Slick Slider in GP Hooks

Viewing 6 posts - 1 through 6 (of 6 total)
  • Author
    Posts
  • #498428
    Margot

    I’m looking to incorporate slick slider into my theme. I followed the instructions and put the css and js codes in .wp_header using GP Hooks. Here is what I entered:

    <link rel="stylesheet" type="text/css" href="css/slick.css"/>
    <link rel="stylesheet" type="text/css" href="css/slick-theme.css"/>
    <script type="text/javascript" src="http://code.jquery.com/jquery-1.11.0.min.js"></script>
    <script type="text/javascript" src="http://code.jquery.com/jquery-migrate-1.2.1.min.js"></script>
    <script type="text/javascript" src="js/slick.min.js"></script>
    
    <script>
    $(document).ready(function(){
      $('.your-class').slick({
        setting-name: setting-value
      });
    });
    </script>

    I used the exact same example and code as they use in their demo but the slider doesn’t seem to be loading up and functioning though. I’ve read that people sometimes have issues incorporating this slider in WordPress themes so not sure if I should be using GP Hooks or enqueuing the scripts in the functions.php file.

    GP Premium 1.5.6
    #498612
    Tom
    Lead Developer
    Lead Developer

    Have you considered using this plugin?: https://wordpress.org/plugins/slick-slider/

    If you’re not interested in that, you’ll need to:

    1. Use the full URL in your references:

    css/slick.css -> yoururl.com/css/slick.css
    css/slick-theme.css -> yoururl.com/css/slick-theme.css

    You should be able to read the file by putting yoururl.com/css/slick-theme.css into your address bar.

    2. Replace this in your jQuery:

    $(document)

    With this:

    jQuery(document)

    #498765
    Margot

    My apologies, I just realized that I forgot to mention that I actually did use the full url on all the header css and js links on my website. I didn’t want to post the full link here so I shortened it but it is indeed pointing in the right direction. I verified each one of them individually as well just to double check.

    I also made the jQuery replacement you mentioned but it’s still not functioning for me.

    ps. Thanks for the suggestion. I would prefer to manually use the slick slider than get the plugin because I’m planning on integrating it with Advanced Custom Fields and more responsive options so doing it without a plugin would give me a bit more control overall.

    #498990
    Tom
    Lead Developer
    Lead Developer

    You still have this in your code: setting-name: setting-value

    That needs to be removed or replaced with actual setting names and values.

    #505218
    Margot

    That did it! Thank you again!!

    #505360
    Tom
    Lead Developer
    Lead Developer
Viewing 6 posts - 1 through 6 (of 6 total)
  • You must be logged in to reply to this topic.