# Slick Image Gallery

**URL:** <https://meta.discourse.org/t/slick-image-gallery/81952>\
**Category:** Theme component\
**Tags:** broken\
**Created:** [June 29, 2018, 6:15am UTC](https://meta.discourse.org/t/slick-image-gallery/81952 "2018-06-29T06:15:00Z")\
**Posts on this page:** 1\
**Showing post:** 1

<div class="post-metadata">

**Author:** ![Johani](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/johani/32/176920_2.png) [@Johani](https://meta.discourse.org/u/Johani)\
**Post date:** [June 29, 2018, 6:15am UTC](https://meta.discourse.org/t/slick-image-gallery/81952/1 "2018-06-29T06:15:00Z")

</div>

#### Responsive Carousel Galleries

**12KB** (Gzip)  
**2 http requests** on initial load  
IE 11+ & modern browsers

[Github repository link](https://github.com/hnb-ku/Discourse-Slick-image-gallery)

`https://github.com/hnb-ku/Discourse-Slick-image-gallery`

#### Desktop

* * *

 ![Capturea1](https://global.discourse-cdn.com/meta/original/3X/c/1/c1d7739fc086c7e58ce85914e565e422b23583b8.jpg) ![Capturea](https://global.discourse-cdn.com/meta/original/3X/6/d/6d9b12d83c53f22d3aa0256dd7214e056ec59e2f.jpg)

* * *

#### Video

[https://global.discourse-cdn.com/meta/original/3X/5/6/5677f8ecc7289d427e855d47df3579a656857c69.mp4](https://global.discourse-cdn.com/meta/original/3X/5/6/5677f8ecc7289d427e855d47df3579a656857c69.mp4)

#### Mobile

* * *

 ![Capturea2](https://global.discourse-cdn.com/meta/original/3X/a/b/ab3ce97626c60609383ac3b6f390d14a551cad4a.PNG) ![Capturea4](https://global.discourse-cdn.com/meta/original/3X/f/6/f652b2a6cddc511a23b019a927411bfe72df9d95.PNG) ![Capturea3](https://global.discourse-cdn.com/meta/original/3X/1/c/1cf4baae0f4b8b40b627c2950a88ab81a0bb09b1.jpg)

Built using [Ken Wheeler](https://github.com/desandro)’s [Slick](http://kenwheeler.github.io/slick/) library - [MIT license](https://github.com/kenwheeler/slick/blob/master/LICENSE)

_“Free as in Bacon”_

* * *

#### How do I install this?

You install this component just like any other theme. Follow the instructions in the official guide:

> [@Installing a theme or theme component](https://meta.discourse.org/t/how-do-i-install-a-theme-or-theme-component/63682):
>
> bookmark This is a guide for installing and managing themes and theme components in Discourse. person_raising_hand Required user level: Administrator Installing and customizing themes can significantly improve the look and feel of your Discourse site. You can easily import and manage themes and their components through the Discourse admin panel. This guide covers: Importing new themes and theme components Adding theme components to a theme Managing automatic updates Additional resourc…

Once you’re done, simply add the component to your current theme. Done!

* * *

#### How do I use this?

This component adds a button to the composer.

 ![Untitled2](https://global.discourse-cdn.com/meta/original/3X/f/f/ffc880f90d312846b7b39dcbc8db938837b49039.jpg)

So all you have to do is:

1- Upload a bunch of images using the default Discourse upload button then highlight the code:

 ![Capturea6](https://global.discourse-cdn.com/meta/original/3X/7/f/7f3656eefd646556626dae9a2287c912eec5dedd.PNG)

2- Click the gallery button.

You will get a **static preview** of the the selected images in the preview pane:

 ![Capturea7](https://global.discourse-cdn.com/meta/original/3X/6/a/6a4d9eb73eb5ce1226fa730f249382ad8956a26b.jpg)

Done!

* * *

#### Anything else I need to know?

This component will inherit the current theme’s styles.

Here’s the theme component running on a different theme:

 ![Capturea5](https://global.discourse-cdn.com/meta/original/3X/0/f/0f83d188c71854931e89316de40d3ab1fa4c1cea.jpg)

#### Can I use both Slick and Tiles at the same time?

You bet! 😅

 ![Capture999](https://global.discourse-cdn.com/meta/original/3X/a/1/a1b14744165035f183b7473e81e094052628ac84.jpg)

This is possible by making both slick and tiles components of a theme.

Like this:

 ![Capture](https://global.discourse-cdn.com/meta/original/3X/d/6/d6b7f2957b6486135d00c0b2ff72180a9c019c40.PNG)

You can then make “my theme” in the example above the default theme or make it user-selectable and it would include both Slick and Tiles.

* * *

Bug reports / Suggestions / PRs welcome. 🍷

---

_[View the full topic](https://meta.discourse.org/t/slick-image-gallery/81952)._
