Slick Lightbox

Slick within a lightbox.

Requirements

• Slick Lightbox library:
  • Download Slick Lightbox archive from Slick lightbox
  • Extract it as is, rename slick-lightbox-master to slick-lightbox, so the asset is available at:
    /sites/../libraries/slick-lightbox/dist/slick-lightbox.min.js
    /sites/../libraries/slick-lightbox/dist/slick-lightbox.css
    Remove "/sites/.." for D8.
• D8+:
  Slick >= 2.x with Blazy >= 2.x
  D7:
  Slick 7.x-3.x with Blazy 7.x-1.x

Installation

Install the module as usual, more info can be found on:
Drupal 7
Drupal 8

Usage / Configuration

Enable this module and its dependency, core image, Blazy, and Slick modules.

Field formatters

• Visit /admin/config/people/accounts/fields, or /admin/structure/types, or any fieldable entity, click Manage display.
• Under Format, choose blazy-related formatters: Blazy, Slick Carousel for image field.
• Click the Configure icon.
• Under Media switcher, choose Image to Slick lightbox. Adjust the rest.

Blazy filter

• Visit /admin/config/content/formats/full_html, etc.
• Enable Blazy Filter.
• Under Media switcher, choose Image to Slick Lightbox.

Features

• Has no formatter, instead integrated into Media switcher option as seen at Blazy/ Slick formatters, including Blazy Views fields for File Entity and Media, and also Blazy Filter for inline images.

Slick Lightbox optionset

We only have one optionset for the Slick Lightbox globally, override it accordingly:
/admin/config/media/slick/list/slick_lightbox/edit

Limitation

Has no skins, yet. Patches or contributions are very much welcome to improve the first looks like what Colorbox has OOTB.

Good at CSS? We welcome your contributions to make this Slick Lightbox slick, even if you don't patch, contributing just a CSS attachment is very much welcome. We can provide UI options later once we have some skins.

Thanks!

Known Issue

https://git.drupalcode.org/project/slick_lightbox/tree/7.x-3.x#known-issues

There is a weird character at the beginning of slick-lightbox.css file:

.slick-lightbox{....}
Note the "" characters.
This only appears when aggregation is enabled, and causes its styling broken.
Temp solution: delete the dot before slick-lightbox with a backspace. And
put your own dot back there. It is weird as nothing in there, but it solves it.
This only happens at D7 at Linux box, not D8. Assumes NOT the library issue,
but not sure whether it is D7 aggregation issue, either.