Cite-Tag for blockquotes

I want to have a cite underneath my blockquote, that has a certain style.

"Blockquotes are an essential part of a fancy website."
                                                – Cite

The markup should look like this:

<blockquote><p>Blockquotes are an essential part of a fancy website."</p>
<cite>Cite</cite></blockquote>

But the WYSIWYG-Editor does not offer me the possibility to define a cite for the blockquote. And I can’t force my users to write the HTML by hand.

Is there a way to make the WYSIWYG-Editor generate the required markup?

1 Answer
1

The TinyMCE Custom Styles Codex Page should get you through this.

There are code snippets on that page, but, as an overview, the process requires two steps:

  1. Add the TinyMCE “styleselect” element to the first or second row of icons.
  2. Add one or more elements to that styleselect menu.

If this were me, I would consider also removing the blockquote button from TinyMCE and then adding blockquote as an option in the styleselect along with cite. Doing it that way means your editors can find the correct markup for an entire blockquote in one place.

And I hope this goes without saying, but make sure to implement a custom editor-style.css file so that the blockquote and cite styles match the theme output.

Leave a Comment