# Slick Image Gallery

**URL:** https://meta.discourse.org/t/slick-image-gallery/81952
**Category:** Theme component
**Tags:** broken
**Created:** [6월 29, 2018, 6:15오전 UTC](https://meta.discourse.org/t/slick-image-gallery/81952 "2018-06-29T06:15:00Z")
**Posts on this page:** 7
**Page:** 4

<div class="post-metadata">

### Author: ![FizzGiGG](https://avatars.discourse-cdn.com/v4/letter/f/d26b3c/32.png) [@FizzGiGG](https://meta.discourse.org/u/FizzGiGG)
#### Post date: [5월 16, 2024, 3:51오후 UTC](https://meta.discourse.org/t/slick-image-gallery/81952/63 "2024-05-16T15:51:28Z")

</div>

네, 제 답변은 무시되었고 @Hifihedgehog의 답변도 무시되었습니다.

해제를 하고, 다른 누구도 이 구성 요소를 사용하지 말라고 권고합니다.

---

<div class="post-metadata">

### Author: ![Arkshine](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/arkshine/32/298682_2.png) [@Arkshine](https://meta.discourse.org/u/Arkshine)
#### Post date: [5월 16, 2024, 5:19오후 UTC](https://meta.discourse.org/t/slick-image-gallery/81952/64 "2024-05-16T17:19:45Z")

</div>

최신 Discourse를 사용하는 프로덕션 테스트 서버에서는 해당 컴포넌트가 정상적으로 작동합니다. 🤔

어떤 오류가 발생하는지 확인해 보려면 브라우저 콘솔을 확인해 주세요. (우클릭 → 검사 → 콘솔 탭)

> [@Hifihedgehog](#):
>
> 이것도 [Tiles Image Gallery - theme-component - Discourse Meta](https://meta.discourse.org/t/tiles-image-gallery/81950/145)처럼 비추천(deprecated)된 건가요?

반드시 비추천된 것은 아니지만, 해당 컴포넌트는 jQuery에 의존하고 있으며 코어의 현대화 작업으로 인해 jQuery 의존성이 제거되는 추세입니다.

코어에서 제공하는 이미지 그리드(image grid) 사용을 권장합니다:

> [@게시글에 이미지 그리드 기능 추가](https://meta.discourse.org/t/introducing-image-grids-in-posts/268664):
>
> If you have many images in a Discourse post, you can now have them automatically arranged into a nice grid. All you need to do is wrap them in [grid] ... [/grid] tags, and the images will be neatly arranged. This is a core feature as of [this commit](https://github.com/discourse/discourse/commit/f89b5680cb4cc28003133e0095393b78d4b87460), enabled on all Discourse instances. Here’s an example in action:

> [@FizzGiGG](#):
>
> 음, 제 답변이 무시되었고 @Hifihedgehog의 답변도 무시된 것 같습니다.

그 점은 죄송합니다! 말씀이 맞습니다. 그 변경 사항은 환영할 만한 일이죠. 👍  
방금 위에 링크드한 이미지 그리드 기능을 사용해 보셨나요? 좋은 대안이 될 수 있을 것 같습니다.

---

<div class="post-metadata">

### Author: ![FizzGiGG](https://avatars.discourse-cdn.com/v4/letter/f/d26b3c/32.png) [@FizzGiGG](https://meta.discourse.org/u/FizzGiGG)
#### Post date: [5월 16, 2024, 6:36오후 UTC](https://meta.discourse.org/t/slick-image-gallery/81952/65 "2024-05-16T18:36:17Z")

</div>

네, 그리드를 사용하기로 했습니다. 어차피 Slick 갤러리는 잘 안 됐거든요. 사진이 5장 이상이면 제대로 동작하지 않았습니다.  
지금은 제거해 놓은 상태라, 더 이상 테스트하지 않을 겁니다.

---

<div class="post-metadata">

### Author: ![Hifihedgehog](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/hifihedgehog/32/140207_2.png) [@Hifihedgehog](https://meta.discourse.org/u/Hifihedgehog)
#### Post date: [5월 21, 2024, 11:56오전 UTC](https://meta.discourse.org/t/slick-image-gallery/81952/66 "2024-05-21T11:56:48Z")

</div>

> [@Arkshine](#):
>
> 코어에서 사용 가능한 이미지 그리드를 사용하도록 권장합니다:

Ember 5 이전 갤러리를 그리드로 전환하는 작업을 진행 중인데, 이것이 _전혀_ 실행 가능한 해결책이 아니라는 것을 빠르게 깨닫고 있습니다—끝까지. 문서(“그리드의 항목들은 열 높이가 서로 최대한 가깝도록 배치되므로, 이미지의 순서가 항상 유지되지 않습니다”)에 따르면, 그리드는 이미지 순서를 _유지하지_ 않습니다. 이는 때때로 이미지 형식으로 업로드하는 긴 슬라이드 덱의 경우 특히 치명적인 문제입니다. 대안이 있거나, 이제 순서가 있는 갤러리를 사용하지 말고 이미지를 단순히 일반 텍스트처럼, 형식 없는 이미지 벽 한 줄로 붙여넣는 것이 의도된 방식인가요? Ember 5 배포가 얼마나 무질서하게 처리되었는지 때문에 저는 정말로 만족스럽지 않습니다. 조금도 아닙니다.

---

<div class="post-metadata">

### Author: ![Arkshine](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/arkshine/32/298682_2.png) [@Arkshine](https://meta.discourse.org/u/Arkshine)
#### Post date: [5월 24, 2024, 9:09오후 UTC](https://meta.discourse.org/t/slick-image-gallery/81952/67 "2024-05-24T21:09:14Z")

</div>

> [@Hifihedgehog](#):
>
> 대안이 있거나, 이제 정렬된 갤러리를 사용하지 말고 이미지를 단순히 단일 평범한, 이미지 벽처럼, 포맷되지 않은 컬럼으로 붙여넣으라는 건가요?

모든 사용자의 필요에 맞지 않을 수 있다는 점을 이해합니다.  
컴포저의 링크 순서와 이미지가 시각적으로 동일한 순서가 아닐 수 있다는 말씀이 맞습니다. 그러나 라이트박스를 열면 순서는 일치합니다.

이전에는 다른 라이브러리(jQuery에 의존하지 않는)를 사용하도록 컴포넌트를 수정해 본 기억이 납니다. 언젠가 PR을 보내볼지도 모릅니다. 👍

---

<div class="post-metadata">

### Author: ![mentalstring](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/mentalstring/32/168934_2.png) [@mentalstring](https://meta.discourse.org/u/mentalstring)
#### Post date: [6월 6, 2024, 10:20오전 UTC](https://meta.discourse.org/t/slick-image-gallery/81952/68 "2024-06-06T10:20:28Z")

</div>

> [@Hifihedgehog](#):
>
> ![image](https://global.discourse-cdn.com/meta/original/4X/3/9/5/395eea3a83d3eeb8e898f3627b72ae39e026338b.png)

저도 같은 현상이며 전혀 작동하지 않는 것 같습니다.

> **콘솔 오류**
>
> ```plaintext
> client-error-handler.js:125 [THEME 31 'Slick - Gallery Component'] TypeError: i.children(...).not(...).slick is not a function
> at i.decorateCooked.id (theme-field-86-common-html-script-2.js:36:94)
> at a.<anonymous> (plugin-api.js:365:37)
> at a.<anonymous> (plugin-api.js:174:19)
> at m (index.js:200:1)
> at a.trigger (evented.js:27:1)
> at e.didInsertElement (discourse-banner.js:52:20)
> at e.r [as didInsertElement] (index.js:361:1)
> at e._trigger (core_view.js:55:1)
> at e.r (index.js:361:1)
> at e._trigger (ember-events.js:147:28)
> at e.r (index.js:361:1)
> at ze.didCreate (index.js:2102:1)
> at jt.commit (runtime.js:3965:1)
> at Mt.commit (runtime.js:4062:1)
> at Nt (runtime.js:4082:1)
> at gr._renderRoots (index.js:4916:1)
> at gr._renderRootsTransaction (index.js:4960:1)
> at gr._renderRoot (index.js:4905:1)
> at gr._appendDefinition (index.js:4830:1)
> at gr.appendOutletView (index.js:4820:1)
> at invoke (backburner.js.js:282:1)
> at h.flush (backburner.js.js:197:1)
> at p.flush (backburner.js.js:358:1)
> at B._end (backburner.js.js:798:1)
> at B._boundAutorunEnd (backburner.js.js:523:1)
> 
> ```

때로는 꽤 유용할 수 있는 Discourse용 다른 이미지 슬라이드쇼/캐러셀이 현재 없으니 아쉬운 상황입니다.

누군가 이 주제에 #broken 태그를 추가해 주실 수 있을까요?

---

<div class="post-metadata">

### Author: ![awesomerobot](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/awesomerobot/32/142900_2.png) [@awesomerobot](https://meta.discourse.org/u/awesomerobot)
#### Post date: [7월 23, 2026, 5:41오후 UTC](https://meta.discourse.org/t/slick-image-gallery/81952/69 "2026-07-23T17:41:14Z")

</div>



[이전 페이지](https://meta.discourse.org/t/slick-image-gallery/81952.md?page=3)
