Discourse Spoiler-Alert

:discourse2: Summary Discourse Spoiler Alert provides the ability to hide content marked with a [spoiler] tag in posts.
:open_book: Install Guide This plugin is bundled with Discourse core. There is no need to install the plugin separately.

Enabling Spoiler Alert

This plugin is default enabled once installed but can be disabled/enabled from its settings, accessed from your admin/plugins page:

enable spoiler

Features

Once enabled it adds a ‘Blur Spoiler’ option to the :gear: menu in the composer’s formatting bar. Simply highlight the text you’d like to blur and select ‘blur spoiler’ and it will wrap the selected text in the necessary [spoiler] tags:

Examples:

Inline:

[spoiler]This is a spoiler[/spoiler] 

This is a spoiler

Multiline:

[spoiler]

I wanna be your vacuum cleaner
Breathing in your dust
I wanna be your Ford Cortina
I will never rust
If you like your coffee hot
Let me be your coffee pot
You call the shots
I wanna be yours

https://johncooperclarke.com/poems/i-wanna-be-yours

[/spoiler]

I wanna be your vacuum cleaner
Breathing in your dust
I wanna be your Ford Cortina
I will never rust
If you like your coffee hot
Let me be your coffee pot
You call the shots
I wanna be yours

https://johncooperclarke.com/poems/i-wanna-be-yours

Clicking on the blur will reveal the hidden text, and clicking again will re-blur it.

It also works for images:
(to re-blur an image that is large enough to generate a lightbox, you can click on the adjacent white space or refresh the page)

Settings

Name Description
spoiler enabled Enable the spoiler plugin. If you change this, you must rebake all posts with: “rake posts:rebake”[1]

:discourse2: Hosted by us? This plugin is available on all of our hosting tiers Spoiler Alert | Discourse - Civilized Discussion


  1. :discourse2: If you’re a hosted customer of ours, please contact team@discourse.org if you have any questions about needing to ‘rebake’ due to a setting change ↩︎

Last edited by @tobiaseigen 2025-07-16T20:45:02Z

Check documentPerform check on document:
48개의 좋아요

코어로 이동:

3개의 좋아요

:information_source: Discourse Spoiler Alert 플러그인이 이제 Discourse 코어에 포함되어 있으므로, 이 플러그인을 별도로 설치할 필요가 없습니다. :partying_face:

자체 호스팅을 사용하는 경우, 대시보드에서 app.yml에서 해당 플러그인을 제거하는 방법에 대한 정보를 확인할 수 있습니다.

:discourse2: 저희가 호스팅을 제공하는 경우? 이 변경 사항은 여러분에게 어떤 영향도 미치지 않습니다. :+1: 이 플러그인을 계속 자유롭게 사용하시면 됩니다. 신경 쓸 것 없습니다.

1개의 좋아요

이 플러그인이 기본적으로 활성화되어 있는 이유가 뭔지 모르겠어요. 영화 포럼에서만 유용한 것 아닌가요?

영화 스포일러보다 텍스트를 숨겨야 할 이유는 훨씬 많습니다. 농담의 핵심 포인트를 미리 밝히는 것보다도 그렇습니다.

2개의 좋아요

게시글의 '좋아요’를 누르면 스포일러 내용을 표시하는 기능을 추가할 수 있을까요?

원하시는 대로 Contribute > Feature spoiler-alert 토픽을 생성해 주세요 :wink:

2개의 좋아요

:wink:, 지금 가는 중이야.

스포일러 미리보기의 내용을 편집할 수 있는 방법이 있을까요? 현재 구현 방식은 깔끔하지만, 스포일러 대상이 무엇인지에 대해 충분히 추상화되어 있지 않습니다.

제가 만든 스레드의 예시를 들어볼게요. 이 스레드에서는 사용자가 스크린샷을 업로드할 수 있습니다. 스크린샷이 스포일러라면 그렇게 태그를 붙여야 합니다. 보시다시피, 현재 구현 방식은 게임이나 영화 등에서 중요한 순간을 담은 스크린샷에 스포일러 태그를 붙이는 맥락에서는 제대로 작동하지 않습니다.

제가 공유한 게임을 아는 사람은 바로 그것이 무엇인지 알 수 있을 겁니다.

아래는 제 디스코urse 보드에서 가져온 이미지입니다.

이 부분을 조정할 수 있는 방법이 있을까요?

수정: 스포일러가 포함된 게시물의 수정 이력을 사용자가 클릭하면, 수정 이력에서 콘텐츠가 스포일러 태그로 처리되지 않는다는 것도 알게 되었습니다.

어떤 느낌으로 만들 생각인가요? 더 흐리게? 블러 색상을 다르게?

1개의 좋아요

가능하다면, 완전히 검게 만들거나 더 흐릿하게 만들 거예요.

여기는 블러 부분의 기본 CSS입니다

.spoiler-blurred img {
  filter: blur(1em);
}

1em을 더 중요한 값으로 변경하세요

.spoiler-blurred img {
  filter: blur(5em);
}

마우스 커서가 이미지 위에 있을 때 더 많이 흐릿하게 보이기를 원한다면, 아래 줄을 추가하고 0.5em을 (이전 값보다 덜 중요한 값으로) 변경하세요

.spoiler-blurred {
  .discourse-no-touch & {
    &:hover, &:focus {
      img {
        filter: blur(0.5em);
      }
    }
  }
}
5개의 좋아요

이것이 별도의 버그 리포트로 가치가 있는지 확실하지 않지만, 채팅 푸시 알림을 통해 스포일러 텍스트가 다른 모든 경우와 달리 가려지지 않는다는 사실을 깨달았습니다. Chat::Message#push_notification_excerpt는 원시 마크다운을 잘라내고, 스포일러를 this is a chat notification [spoiler]and this is the spoiler[/spoiler]처럼 문자 그대로 출력합니다. 알림에 스포일러 전체가 출력된다면 스포일러 태그의 목적이 사실상 무색해지죠! :joy: 스포일러 경고의 :reduce_excerpt가 채팅 메시지의 경우 포럼 게시글과 달리 완전히 우회되는 것 같아 실수처럼 보입니다. 채팅에서는 그 외에는 정상적으로 작동합니다! 문제가 있는 것은 푸시 알림입니다.

1개의 좋아요