Home › Discussions › Campaign Portal Building › Wiki Spoiler Button - Campaign Portal Building Discussions on Obsidian Portal Community Forums
Wiki Spoiler Button
Does anyone know any code that will allow the creation of a spoiler button to collapse or expand blocks of text within a wiki page? Been looking for ages and still can't find a way that works yet =/
DM, Current Campaign: The Godlands: Rise of the Blood Moon Kings
DM, Previous Campaign: Avatar: Conquest of the Imperial Order - CotM: November 2011
Howdy, Stranger!
It looks like you're new here. If you want to get involved, click one of these buttons!
Comments
Have you tried the Accordion javascript insert? Something like this ...
[accordion]
[accordion-item]
[title]
Spoiler
[end-title]
[content]
The hobbit has the ring and is trying to throw it in your volcano!
[end-content]
[end-accordion-item]
[end-accordion]
Let me know if that doesn't match what you're wanting.
Obsidian Portal Developer
NOTHING TO SEE HERE PEOPLE.
GM of Rise of the Durnskald: Wrath of the Fallen Goddess - February 2016 CotM
GM of Core: The Ashes of Alcarna - April 2020 CotM
GM of Stream of Kairos
Need CSS Help? It may be covered here: Abersade's CSS Hub
Eh, this is the best I can come up with since CSS doesn't support onclick events.
https://abersade-testbed.obsidianportal.com/wikis/a-different-test
CSS looks like so:
Spoiler side code keeps getting reformatted no matter what code snippet type I choose. Oh boy, this is fun.I'll try this again shortly. Can't access the preformatted stuff when editing a comment, only when posting new, so that's a bit jarring.
It's not a button that has to be clicked, but it is a section that needs hovered over to activate. For longer or shorter text you may need to adjust the CSS max-height:300px; to something more appropriate, just remember that unless you want to change the name of the li element each time (which you could I suppose, so spoiler1, spoiler 2 in the CSS and the ul class name in the page with the spoiler) that this would apply the same max height to all of your spoilers.
GM of Rise of the Durnskald: Wrath of the Fallen Goddess - February 2016 CotM
GM of Core: The Ashes of Alcarna - April 2020 CotM
GM of Stream of Kairos
Need CSS Help? It may be covered here: Abersade's CSS Hub
<ul class="spoiler">
<li> [[File:1219492 | class=media-item-align-none | x25px | spoiler.png]]
<br />
INSERT SPOILER TEXT HERE</li><br />
<ul>
Ignore the yellow, that bit is unintentional. Thaen, I'd like to suggest that the text formatting match when creating and editing comments, since the editing side is extremely simplified.
GM of Rise of the Durnskald: Wrath of the Fallen Goddess - February 2016 CotM
GM of Core: The Ashes of Alcarna - April 2020 CotM
GM of Stream of Kairos
Need CSS Help? It may be covered here: Abersade's CSS Hub
@Abersade, yeah, I totally agree this forum software could be better in the comment editing mode. I've got "find better forum software" on the todo list, but it doesn't currently have a high priority.
Obsidian Portal Developer
Between the simplified editing (simplified to the point of stripping out all formatting opting) and the system's insistence on saving draft copies of comments forever regardless of whether or not you choose to save them or have since changed them (unless you post a new comment entirely) the system is cumbersome at best and actively discourages interaction at times. I'm glad it's on the list.
GM of Rise of the Durnskald: Wrath of the Fallen Goddess - February 2016 CotM
GM of Core: The Ashes of Alcarna - April 2020 CotM
GM of Stream of Kairos
Need CSS Help? It may be covered here: Abersade's CSS Hub
And if you put @Abersade 's code in an accordion, you sort of have a nested Accordion
Thanks for all the responses everyone wow!!! Gonna test all this then report back! :)
DM, Current Campaign: The Godlands: Rise of the Blood Moon Kings
DM, Previous Campaign: Avatar: Conquest of the Imperial Order - CotM: November 2011
@Abersade thank you for that code, I do think I need something that is click rather than hover for longer entries, but i will still hold on to that one for other potential uses.
@Thaen, that accordion method works great that totally will work. My only question is if there is a way to apply some CSS or an additional line that would make the box transparent? I have a custom background on my wiki pages and i would prefer to have this show through the accordion box. Thanks so much for your help this is great!!
DM, Current Campaign: The Godlands: Rise of the Blood Moon Kings
DM, Previous Campaign: Avatar: Conquest of the Imperial Order - CotM: November 2011
@Keryth987 "nested accordion" okay that's a cool idea haha.
DM, Current Campaign: The Godlands: Rise of the Blood Moon Kings
DM, Previous Campaign: Avatar: Conquest of the Imperial Order - CotM: November 2011
Also secondary inquiry, how are you guys putting those links of your campaigns and such to appear at the bottom of your forum comments on here?
DM, Current Campaign: The Godlands: Rise of the Blood Moon Kings
DM, Previous Campaign: Avatar: Conquest of the Imperial Order - CotM: November 2011
Never mind, found the signature option!
DM, Current Campaign: The Godlands: Rise of the Blood Moon Kings
DM, Previous Campaign: Avatar: Conquest of the Imperial Order - CotM: November 2011
Nevermind to the transparency question either found some code that works, thanks again!!!
DM, Current Campaign: The Godlands: Rise of the Blood Moon Kings
DM, Previous Campaign: Avatar: Conquest of the Imperial Order - CotM: November 2011
Glad it all helped!
Obsidian Portal Developer