Discourse Spoiler-Alert

إضافة
, ,
1
: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:

blur spoiler option
blur spoiler option1850×640 24.2 KB

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)

spoiler image example
spoiler image example895×781 54.1 KB

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 إعجابًا
109

تم النقل إلى النواة:

3 إعجابات
110

:information_source: تم الآن دمج Discourse Spoiler Alert مع نواة Discourse، لذلك لن تحتاج هذه الإضافة إلى التثبيت بشكل منفصل. :partying_face:

إذا كنت تستضيف بنفسك، فيجب أن ترى بعض المعلومات في لوحة التحكم الخاصة بك حول إزالتها من ملف app.yml الخاص بك.

:discourse2: هل تستضيف لدينا؟ لن يؤثر هذا التغيير عليك بأي شكل من الأشكال. :+1: يمكنك الاستمرار في الاستمتاع بهذه الإضافة وعدم القلق بشأن أي شيء.

إعجاب واحد (1)
111

لا أفهم لماذا تم تمكين هذا المكون الإضافي افتراضيًا. أليس مفيدًا فقط لمنتديات الأفلام؟

112

هناك أسباب كثيرة لإخفاء النصوص أكثر من حرق أحداث الأفلام. أكثر من نهاية النكات.

إعجابَين (2)
113

هل من الممكن إضافة ميزة لعرض محتوى الإعلان التشويقي بعد النقر على “أعجبني” في المنشور؟

114

أنت مرحب بك أكثر من اللازم لإنشاء موضوع #ميزة #تنبيه-بالحرق :wink:

إعجابَين (2)
115

:wink:, أنا في طريقي.

116

هل هناك أي طريقة لتعديل محتويات معاينة المحتوى المخفي؟ التنفيذ الحالي يبدو جيدًا، لكنه لا يخفي ما يكفي من المحتوى الذي يتم إخفاؤه.

إليك مثال من موضوع قمت بإنشائه، حيث يمكن للمستخدمين تحميل لقطات الشاشة الخاصة بهم. إذا كانت لقطة الشاشة عبارة عن محتوى مخفي، فيجب تمييزها على هذا النحو. كما ترى، فإن التنفيذ الحالي لا يعمل حقًا في سياق وضع علامة المحتوى المخفي على لقطات الشاشة للحظات حرجة في الألعاب أو الأفلام، وما إلى ذلك.

أي شخص على دراية باللعبة التي شاركتها سيعرف على الفور ما هي.

صورة من لوحة المناقشة الخاصة بي أدناه.

image
image1650×1450 74.6 KB

هل هناك طريقة لتعديل هذا؟

تعديل: لقد لفت انتباهي أيضًا أنه إذا نقر أي مستخدم على سجل التعديلات لمنشور يحتوي على محتوى مخفي، فإن سجل التعديلات لن يقوم بوضع علامة المحتوى المخفي على المحتويات.

117

ما الذي تخطط لجعله يبدو عليه؟ أكثر ضبابية؟ لون مختلف للضباب؟

إعجاب واحد (1)
118

لو كان بإمكاني، إما أن أجعله أسود تمامًا، أو أجعله أكثر ضبابية.

119

هذا هو 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);
      }
    }
  }
}
4 إعجابات