Support » Plugin: Slick Slider » Responsive breakpoint solution?

  • Resolved Micha Krapp

    (@mfgmicha)


    Really like your Plugin.
    But since I want to show a carousel with 8 images I need a solution for mobile sizes (because the images resize very small).

    Any tip on how to do this without writing in your init slick() function 🙂

Viewing 6 replies - 1 through 6 (of 6 total)
  • Plugin Author Philipp Bammes

    (@tyrannous)

    Hi @mfgmicha,
    the easiest way to accomplish this is to use slick’s slickSetOption method.

    Add the following lines to your JS (or enqueue a separate file which uses slick-slider-core as $deps):

    jQuery( document ).ready( function() {
    	jQuery( '.slick-slider-wrapper .slick-slider' ).slick( 'setOption', 'responsive', [
    		{
    			breakpoint: 480,
    			settings: {
    				slidesToShow: 1,
    			}
    		},
    		{
    			breakpoint: 768,
    			settings: {
    				slidesToShow: 2,
    			}
    		},
    		{
    			breakpoint: 992,
    			settings: {
    				slidesToShow: 4,
    			}
    		},
    	],
    	true
    	)
    } )

    Adjust the selector, breakpoints and settings to your specific needs.

    Thanks for the fast reply, had found the same solution myself.

    The important part is the slick-slider-core as $deps in the enqueue / register of the script, so that you run after the initial .slick()

    Plugin Author Philipp Bammes

    (@tyrannous)

    Glad you have resolved it.

    Hi,

    I still cant understand this statement

    The important part is the slick-slider-core as $deps in the enqueue

    I registered the new js file, i.e. slick-responsive.js as the file name, and pasted those lines into it. Those action’s result was beyond my expectation because the slider was not working, so I excluded responsive ability for a while until I get the proper solution.

    Could you please advise me to solve this problem?

    I found this kind of error in Developer Console.

    Screenshot

    Plugin Author Philipp Bammes

    (@tyrannous)

    Hi @mrfoo,
    please start a new support thread since this one has been marked as resolved and I don’t want to spam @mfgmicha‘s inbox.
    Thanks.

Viewing 6 replies - 1 through 6 (of 6 total)
  • The topic ‘Responsive breakpoint solution?’ is closed to new replies.