How do you spoiler an image or onebox?


(Adam Davis) #41

I really like this! Thanks!


(Kasper Peulen) #49

I don’t see why this is a reason to not implement it in core. This is just 2 tiny details that is not perfect yet.


(Marcelo Saviski) #50

I think that there should be a title="click to show spoiler content" on spoilers, It took me some time to discover why hovering the content just made it slightly less blurred but still unreadable.


(Daniela) #51

There’s some problems with tag spoiler and image on Firefox (version 39.0).
We use this version of Discourse 1.3.2, but I do not display images correctly even on this topic using Firefox (when I use Chrome, spoiler and image works perfectly).

Can someone make a check and fix this problem?

  1. On Firefox I see this:

  2. And this is what I see on Chrome:


Share your custom CSS?
(Ryan) #52

Well that’s not a valid wikipedia link. It should be Rotary dial - Wikipedia. Also I don’t believe wikipedia gets oneboxed. Here is a valid one box.

And her it is spoilered:

This is a problem.


(Jeff Atwood) #53

You can always use the official HTML 5 spoiler tag, which I always forget the name of. Expand or something like that? We polyfill it so it works on all browsers.


(mountain) #54

I have the exact same problem. Firefox shows a blank gap, Chrome shows the intended behavior, as par your screenshots.


Share your custom CSS?
(cpradio) #55

Like this?

Spoiler http://www.amazon.com/ShengShou-3x3x3-Puzzle-Cube-Black/dp/B004UTTXJG/ref=sr_1_3?s=toys-and-games&ie=UTF8&qid=1442711707&sr=1-3&keywords=rubix+cube

Done using

<details>
<summary>Spoiler</summary>
http://www.amazon.com/ShengShou-3x3x3-Puzzle-Cube-Black/dp/B004UTTXJG/ref=sr_1_3?s=toys-and-games&ie=UTF8&qid=1442711707&sr=1-3&keywords=rubix+cube
</details>

(Kane York) #56

There’s a bbcode tag for it: the discourse-details plugin. GitHub - discourse/discourse-details: https://github.com/discourse/discourse/tree/master/plugins/discourse-details

Spoiler

http://www.amazon.com/ShengShou-3x3x3-Puzzle-Cube-Black/dp/B004UTTXJG/ref=sr_1_3?s=toys-and-games&ie=UTF8&qid=1442711707&sr=1-3&keywords=rubix+cube

[details=Spoiler]

http://www.amazon.com/ShengShou-3x3x3-Puzzle-Cube-Black/dp/B004UTTXJG/ref=sr_1_3?s=toys-and-games&ie=UTF8&qid=1442711707&sr=1-3&keywords=rubix+cube

[/details]

(Jeff Atwood) #57

Yes, but the bbcode is not required as the HTML tag is polyfilled for all browsers by default.


(Kane York) #58

Really? I thought the polyfill was right here: https://github.com/discourse/discourse-details/blob/master/assets/javascripts/details.js


(Jeff Atwood) #59

It was my understanding that @zogstrip made the HTML tag work by default.


(Jacob Chapel) #60

I have submitted a fix for this.

It was an issue over on my forum as well that users complained about. Looking into it, it seemed like a simple fix and it was.


(T1) #61

Is there a way to automatically blur all images? Like have Spoiler tags be added somewhere before_commit or as Javascript event. Reason is that I want it on by default even if users dont manually add the tag. If it were wordpress or something, yeah we let the authors do this, but forum posters are not always editors.


(Alan Tan) #62

You can write a plugin that includes your custom markdown engine.

https://github.com/discourse/discourse/blob/master/app/assets/javascripts/pretty-text/engines/discourse-markdown/auto-link.js.es6

The above should give you a good idea of how it can be done.


(T1) #63

@tgxworld Thank you! Markdown is a great suggestion. One more request, I am new to how docker works with rails. How do I correctly use a private repo to add my scripts/css so as not to break future updates? Do I have to write a plugin and add it to app.yml?


(Alan Tan) #64

Have a look at


(T1) #65

Yes but my question is more towards adding my own CSS/JS not Install a plugin already out there.I will look around on how to write my own plugins for discourse. Thanks a lot.


(cpradio) #66

The answer is yes, you can create a plugin that solely registers CSS/JS files.


(Sam Saffron) #67

Note that the long term plan is for themes to solve this case: