So, I’ve created my first plugin. As per the title, this plugin adds spoiler tags to Flatpress that you can use in posts and static pages. It was made with help from the “BBCode Plugin Tips” on the wiki, and requires the BBCode plugin by Hydra & NoWhereMan that comes as standard with Flatpress.
I found a post on the old Flatpress archive forum asking for this all the way back in 2012, but no one ever answered or took up the challenge. I decided to change that, and you can download my plugin by clicking HERE.
With this post, I’ll teach you how to use my Flatpress Spoiler Tags Plugin.
Below is a standard spoiler tag. You can use it by simply wrapping your content in [spoiler][/spoiler] tags. The spoiler has a default text of “Spoiler”, as shown below:
Spolier
This Content is HIDDEN!
You can define the text of the clickable spoiler field by defining the attribute like [spoiler=YourText] on the opening of the tag. This can be seen below with the word “Spoiler1”:
Spoiler1
This Content is HIDDEN!
Sadly, BBCode doesn’t allow spaces in attributes and will stop parsing after the first word. Luckily, we can use a workaround to add a space to our spoiler attribute using an “ ” between words. This is shown below with the words “Spoiler 2”:
Spoiler 2
This Content is also HIDDEN!
You can style the spoiler very easily by editing the spoiler.css file found in the plugin’s /res folder. The code uses HTML5’s “<details>” and “<summary>” elements, making it very easy to create hidden content on websites.
Sadly, these elements currently don’t work for users of Internet Explorer, but according to user “Finesse” on THIS post on a StackOverflow question on this issue, adding the following polyfill inside the “<body>” of your blog will fix this:
<script src="//cdn.jsdelivr.net/npm/details-polyfill@1/index.min.js" async></script>
You can generally find the “<body>” tag in your theme’s header.tpl file.
That’s it, I hope you enjoy using the plugin!
Credit of course goes to Hydra & NoWhereMan for their BBCode plugin that comes as standard with Flatpress, the “BBCode Plugin Tips” on the wiki, and of course “Finesse” from StackOverflow for the Internet Explorer fix.