Slider


{Theme} comes with two main types of sliders. Each type can be additionally customized by data-attributes.

Simple slider

Slick slider

Slick slider

HTML markup for slider:

You can edit arrows types by adding one of the following classes to <section>:

  • ct-slick-arrow–type1
  • ct-slick-arrow–type2
  • ct-slick-arrow–type3
  • ct-slick-arrow–type4
  • ct-slick-arrow–type5
  • ct-slick-arrow–type6

There are also two types of image hover effect, which can be edited analogously, with the following classes:

  • ct-slick-thumbnailHover–type1
  • ct-slick-thumbnailHover–type2

Synch Slider

Synch slider

Synch slider

HTML markup:

You can edit synch slider arrow positions with the following classes:

  • ct-slick–synced–type1
  • ct-slick–synced–type2

Both sliders require using the following scripts: