My Custom Editor Button Isn't Working.

[Zanime]

SOLVED

 

Seems you cannot use the HTML Paragraph tag (inline).

 

So in short I wanted to create a SPOILER tag that could be used for single words or sentences inline with the current text. However, the button doesn't do what I want it to (change the color of the font with a background color of the same).

HTML CODE

<p class="HFSpoiler">
{content}
</p>

CSS

/*Hide Spoiler Tag */
.hfSpoiler {
  color: rgb(255,255,255);
  background-color: #fff;
  padding: 1px 1px 1px 1px;
}

BUTTON SETTING

 

Now pressing the button after HIGHLIGHTING  your text and pressing it just puts the text in a:

<p>Testing</p>

Ignoring the CLASS that was assigned to that button option style.

Any thoughts?

[opentype]

It might be because you are selecting an “Inline” replacement, yet your code wants to use a paragraph, which is a “Block” element. 

For an inline change, you would want to use something like <span class="HFSpoiler"> {content} </span>

[Zanime]

9 minutes ago, opentype said:

It might be because you are selecting an “Inline” replacement, yet your code wants to use a paragraph, which is a “Block” element. 

For an inline change, you would want to use something like <span class="HFSpoiler"> {content} </span>

Yes, I figured that out and fixed it already.