Add support for [spoiler] tags in WYSIWTG field?

I’m using a WYSIWYG field to submit reviews on my site.

I need to be able to have a [spoiler] tag system just like on Discourse: It should hide text until clicked, like this.

I can do the frontend code myself once the code is in there, but one thing I’m struggling to do is to add a button on the WYSIWYG editor that wraps selected text in the correct tags?

I am using a standard WordPress WYSISYG, e.g.:

:pray:

The filter gform_rich_text_editor_buttons can be used to alter the buttons shown there.

Thanks, but this isn’t an existing button, how can I add a brand new button with new (but very simple) functionality? It should work just like a <b> button but instead output [spoiler]

Hey Shaun,

You’d need to write your own TinyMCE v3 plugin that adds support for what you want to do. The Advanced Editor Tools plugin is a practical example of how you can load custom plugins into the standard WordPress WYSIWYG editor (which includes Gravity Forms). I also found this very old plugin that works similar to what you described (but for bbPress). Maybe you can adapt the code from both plugins to suit.

1 Like

Hi Shaun,

2 links here that I think will help:

  1. How to Create a WordPress TinyMCE Plugin
  2. Fun With Blurred Text | CSS-Tricks

Combine the two and I’m sure you’re on to a winner.

All the best.

This topic was automatically closed 30 days after the last reply. New replies are no longer allowed.