WordPress Spoiler Tags


This plugin gives the readers a chance not to accidentally read any spoiler information until they are prepared to do so. An example of what a spoiler tag is would be visible here. The tag is only legible once the user mouse’s over the content. It would be most useful for author’s who write movie reviews and would like to guard their reader’s from sensitive information such as plot twists or endings. Moreover, the colors are easily customizable using CSS.

How It Works

Once the plugin has been uploaded and activated, in any post or page, you simply can encapsulate your text with <spoiler>your text here</spoiler>. Neat, huh?


  1. Download the plugin (v0.2).
  2. Extract the Zip Archive
  3. Upload wp-spoiler.php to your /wp-content/plugins/ folder
  4. Go to your WordPress Administrative Console
  5. Under Options -> Writing, make sure “WordPress should correct invalidly nested XHTML automatically” is unchecked
  6. Under Plugins, locate the “Spoiler Tags” entry and activate it


You should add the following code to your theme’s style.css:

.spoiler {
	background: #000;
	color: #000;

.spoiler_hover {
	background: inherit;
	color: inherit;
	cursor: pointer;

You can adjust the colors and formatting to your heart’s content. Enjoy!

Proving Grounds

To prove (primarily to myself) that this plugin is robust enough to handle all types of tricky situations, I have written these two paragraphs in order hit many of the not-so common scenarios. This, for example, includes: testing a bunch of different punctuation and formatting? Yes, it does! The main challenge of this plugin has been to make sure it is compatible across the major browsers:

This is a hyperlink within a spoiler tag. This is other stuff that shouldn’t be crossed off and should be wrapped inline.

Known Issues

You cannot currently embed spoiler tags. This is a deficiency within the regular expression and I am sure if some expert wanted to look at it, they could fix it within moments. So, if you are that expert, by all means.