Answers.Body: <p>It's worth noting that as of Craft 2.5, it's now using Redactor II, so the above code examples don't work if you have upgraded. Here's a working <a href="https://craftcms.com/docs/rich-text-fields#redactor-configs" rel="nofollow noreferrer">JSON config</a> example you can build on:</p>
  
  <pre><code>{
      "buttons": ["format","bold","lists","link","file","image"],
      "plugins":["source","fullscreen"],
      "toolbarFixed": true,
      "formatting": ["p", "blockquote", "h2", "h3", "h4", "h5", "h6"],
      "formattingAdd": {
          "para-intro": {
              title: "Paragraph Intro",
              args: ["p", "class", "intro", "toggle"]
          }
      }
  
  }
  </code></pre>
  
  <p>The code above includes new format for formattingAdd, but also note that some button names have changed, ie format. Source and full screen are now plugins.</p>
  
  <p>You can read up more on the various options for formattAdd at <a href="https://imperavi.com/redactor/docs/settings/formatting/" rel="nofollow noreferrer">https://imperavi.com/redactor/docs/settings/formatting/</a></p>
  
  <p>If your Craft install existed prior to 2.5 and you used non standard Redactor configs, it's also worth reading <a href="https://craftcms.com/support/redactor-ii-configs" rel="nofollow noreferrer">https://craftcms.com/support/redactor-ii-configs</a> which covers updating your Craft Redactor configs to be compatable with Redactor II</p>
  
Answers.ContentLicense: CC BY-SA 3.0
Answers.CreationDate: 2016-08-04T21:03:56.423Z
Answers.Text: This is not entirely accurate. Based on the Redactor docs, you can only add customizations to specific elements.
  
  [formattingAdd](https://imperavi.com/redactor/docs/settings/formatting/#setting-formattingAdd) can only be applied to p, pre, blockquote, div and heading tags (H1-H6).
  
  So, in your example above, you cannot actually append those args to `<a>` elements.
Answers.UserDisplayName: Ian
Answers.ContentLicense: CC BY-SA 3.0
Answers.CreationDate: 2016-08-05T14:11:27.417Z
Answers.Text: Good catch @ian. Swear I had that working at some point but I don't use much in the way of custom Redactor configs anymore, so it's probably just my memory failing me. Answer edited
Answers.UserDisplayName: neekster
Answers.ContentLicense: CC BY-SA 3.0
Answers.CreationDate: 2016-03-23T04:50:28.430Z
Answers.LastActivityDate: 2017-10-19T01:59:03.777Z
Answers.LastEditDate: 2017-10-19T01:59:03.777Z
Answers.UserDisplayName: neekster
Answers.Body: <p>Victor answers my questions regarding the formatting tags and the fact that you need to create a Craft plugin to add Redactor plugins. </p>
  
  <p>Since there wasn't a solution for adding classes on inline elements with custom classes/styles, Nathan's plugin only supports block elements, I created a plugin that wraps the Styles Redactor plugin. You can get it here: <a href="https://github.com/aelvan/RedactorStyles-Craft">https://github.com/aelvan/RedactorStyles-Craft</a></p>
  
Answers.ContentLicense: CC BY-SA 3.0
Answers.CreationDate: 2014-10-09T09:08:07.163Z
Answers.Text: Redactor 10.0, which hopefully finds its way into the next Craft update, now has 140 new APIs including a new [inline formatting function](http://imperavi.com/redactor/docs/api/inline/). I hope this resolves the big issue with removing styles. The behavior of their updated [font-color plugin](http://imperavi.com/redactor/plugins/font-color/) look promising (on the front end side at least!).
Answers.UserDisplayName: carlcs
Answers.ContentLicense: CC BY-SA 3.0
Answers.CreationDate: 2014-10-09T09:16:19.280Z
Answers.Text: Yes, I've been looking at the 10.0 docs, and it seems these kind of things will be trivial as soon as Craft updates to it.
Answers.UserDisplayName: André Elvan
Answers.ContentLicense: CC BY-SA 3.0
Answers.CreationDate: 2014-06-18T06:59:01.417Z
Answers.LastActivityDate: 2014-06-18T06:59:01.417Z
Answers.UserDisplayName: André Elvan
Answers.Body: <p>If by styles you mean the formatting drop-down, just add them in an array:</p>
  
  <pre><code>{
      buttons: ['bold', 'italic'],
      formatting: ['p', 'blockquote', 'h2', 'h3', 'h4', 'SomeHtmlTag']
  }
  </code></pre>
  
  <p>.</p>
  
  <p>If you want to have a button which adds custom CSS-classes, take a look at: <a href="https://github.com/Natetronn/redactor-css" rel="noreferrer">Redactor CSS by Nathan Doyle</a></p>
  
  <hr>
  
  <h3>Update (July 2015)</h3>
  
  <p><a href="http://buildwithcraft.com/updates#build2615" rel="noreferrer">Craft 2.3.2615</a> (Dec 2, 2014) and above use Redactor 10, which includes the <a href="http://imperavi.com/redactor/docs/settings/formatting/#setting-formattingAdd" rel="noreferrer">formattingAdd</a> setting for adding custom styles and classes.</p>
  
  <pre class="lang-js prettyprint-override"><code>formattingAdd: [
  {
      tag: 'p',
      title: 'Red Block',
      class: 'red'
  }
  </code></pre>
  
Answers.ContentLicense: CC BY-SA 3.0
Answers.CreationDate: 2014-06-17T14:53:14.230Z
Answers.Text: What I need is to add either custom CSS classes or inline styles to content in the rich text editor (I've edited the question to clarify).
  
  I guess your answer indicates that to add redactor plugins we need to use a Craft plugin? Can anyone confirm this?
Answers.UserDisplayName: André Elvan
Answers.ContentLicense: CC BY-SA 3.0
Answers.CreationDate: 2014-06-17T15:06:00.020Z
Answers.Text: I recommend you use classes instead of inline-styling. That's cleaner and will allow you to perform changes in one place. -- If you want to add anything beyond the Redactor config, you have to use a plugin. Here is an example of the Redactor Clips plugin implemented as a Craft plugin: https://github.com/pixelandtonic/RedactorClips
Answers.UserDisplayName: Victor
Answers.ContentLicense: CC BY-SA 3.0
Answers.CreationDate: 2014-06-17T15:17:39.480Z
Answers.Text: Ok, thanks, that answers my questions. :)
Answers.UserDisplayName: André Elvan
Answers.ContentLicense: CC BY-SA 3.0
Answers.CreationDate: 2014-06-17T15:45:42.053Z
Answers.Text: If you figure out how to apply that class to the text selection instead of the whole block (paragraph), please let me know. I don't know if I should better open a new question for that as this question here is already answered?! Opinion?
Answers.UserDisplayName: carlcs
Answers.ContentLicense: CC BY-SA 3.0
Answers.CreationDate: 2014-06-17T16:25:50.467Z
Answers.Text: There was a comment over at G+ that stated that Nathan's plugin uses blockSetClass: http://imperavi.com/redactor/docs/api/#api-blockSetClass which adds a class to the wrapper element. If you want to write a plugin yourself checkout the Redactor api, otherwise ask Nathan if he has an idea.
Answers.UserDisplayName: Victor
Answers.ContentLicense: CC BY-SA 3.0
Answers.CreationDate: 2014-06-17T19:43:41.993Z
Answers.Text: @ChristianSeelbach I just created a plugin that wraps the Styles Redactor plugin, which lets you style inline elements. Haven't tested it thoroughly yet, but have a look at it and see if it works for you: https://github.com/aelvan/RedactorStyles-Craft
Answers.UserDisplayName: André Elvan
Answers.ContentLicense: CC BY-SA 3.0
Answers.CreationDate: 2014-06-17T21:42:44.133Z
Answers.Text: @aelvan you should consider to open a separate answer to this question and give your new solution the prominence it deserves!
Answers.UserDisplayName: carlcs
Answers.ContentLicense: CC BY-SA 3.0
Answers.CreationDate: 2014-06-18T06:59:44.403Z
Answers.Text: @ChristianSeelbach Ah, yeah that's maybe the SE way of doing it. Done. :)
Answers.UserDisplayName: André Elvan
Answers.ContentLicense: CC BY-SA 3.0
Answers.CreationDate: 2014-06-17T12:51:48.410Z
Answers.LastActivityDate: 2015-07-22T23:56:40.420Z
Answers.LastEditDate: 2015-07-22T23:56:40.420Z
Answers.UserDisplayName: Victor
Body: <p>I'm aware that I can customise which buttons is available in the rich text editor. But how can I add custom css styles, either as classes or as inline styles? Do I need to create a plugin for this? If so, how do I add plugins? And, can I change which options are available in the formatting drop down?</p>
  
Tags: <plugins><richtext><editor><redactor>
Title: How do I add custom styles/plugins to the rich text editor in Craft?
ThreadText: # How do I add custom styles/plugins to the rich text editor in Craft?
  
  (Asked by: username_0 on 2014-06-17)
  
  I'm aware that I can customise which buttons is available in the rich text editor. But how can I add custom css styles, either as classes or as inline styles? Do I need to create a plugin for this? If so, how do I add plugins? And, can I change which options are available in the formatting drop down?
  
  **Tags:** plugins, richtext, editor, redactor
  
  
  ---
  
  ## 3 answers
  
  ### Answer by username_4 on 2014-06-17. Score: 13 | Accepted answer
  
  If by styles you mean the formatting drop-down, just add them in an array:
  
  ```
  {
      buttons: ['bold', 'italic'],
      formatting: ['p', 'blockquote', 'h2', 'h3', 'h4', 'SomeHtmlTag']
  }
  
  ```
  
  .
  
  If you want to have a button which adds custom CSS-classes, take a look at: [Redactor CSS by Nathan Doyle](https://github.com/Natetronn/redactor-css)
  
  ---
  
  ### Update (July 2015)
  
  [Craft 2.3.2615](http://buildwithcraft.com/updates#build2615) (Dec 2, 2014) and above use Redactor 10, which includes the [formattingAdd](http://imperavi.com/redactor/docs/settings/formatting/#setting-formattingAdd) setting for adding custom styles and classes.
  
  ```js
  formattingAdd: [
  {
      tag: 'p',
      title: 'Red Block',
      class: 'red'
  }
  
  ```
  
  > **Comments:**
  > **username_0**: What I need is to add either custom CSS classes or inline styles to content in the rich text editor (I've edited the question to clarify).  I guess your answer indicates that to add redactor plugins we need to use a Craft plugin? Can anyone confirm this?  
  > **username_4**: I recommend you use classes instead of inline-styling. That's cleaner and will allow you to perform changes in one place. -- If you want to add anything beyond the Redactor config, you have to use a plugin. Here is an example of the Redactor Clips plugin implemented as a Craft plugin: https://github.com/pixelandtonic/RedactorClips  
  > **username_0**: Ok, thanks, that answers my questions. :)  
  > **username_3**: If you figure out how to apply that class to the text selection instead of the whole block (paragraph), please let me know. I don't know if I should better open a new question for that as this question here is already answered?! Opinion?  
  > **username_4**: There was a comment over at G+ that stated that Nathan's plugin uses blockSetClass: http://imperavi.com/redactor/docs/api/#api-blockSetClass which adds a class to the wrapper element. If you want to write a plugin yourself checkout the Redactor api, otherwise ask Nathan if he has an idea.  
  > **username_0**: @ChristianSeelbach I just created a plugin that wraps the Styles Redactor plugin, which lets you style inline elements. Haven't tested it thoroughly yet, but have a look at it and see if it works for you: https://github.com/aelvan/RedactorStyles-Craft  
  > **username_3**: @aelvan you should consider to open a separate answer to this question and give your new solution the prominence it deserves!  
  > **username_0**: @ChristianSeelbach Ah, yeah that's maybe the SE way of doing it. Done. :)  
  
  ---
  
  ### Answer by username_1 on 2016-03-23. Score: 9
  
  It's worth noting that as of Craft 2.5, it's now using Redactor II, so the above code examples don't work if you have upgraded. Here's a working [JSON config](https://craftcms.com/docs/rich-text-fields#redactor-configs) example you can build on:
  
  ```
  {
      "buttons": ["format","bold","lists","link","file","image"],
      "plugins":["source","fullscreen"],
      "toolbarFixed": true,
      "formatting": ["p", "blockquote", "h2", "h3", "h4", "h5", "h6"],
      "formattingAdd": {
          "para-intro": {
              title: "Paragraph Intro",
              args: ["p", "class", "intro", "toggle"]
          }
      }
  
  }
  
  ```
  
  The code above includes new format for formattingAdd, but also note that some button names have changed, ie format. Source and full screen are now plugins.
  
  You can read up more on the various options for formattAdd at <https://imperavi.com/redactor/docs/settings/formatting/>
  
  If your Craft install existed prior to 2.5 and you used non standard Redactor configs, it's also worth reading <https://craftcms.com/support/redactor-ii-configs> which covers updating your Craft Redactor configs to be compatable with Redactor II
  
  > **Comments:**
  > **username_2**: This is not entirely accurate. Based on the Redactor docs, you can only add customizations to specific elements.  [formattingAdd](https://imperavi.com/redactor/docs/settings/formatting/#setting-formattingAdd) can only be applied to p, pre, blockquote, div and heading tags (H1-H6).  So, in your example above, you cannot actually append those args to `<a>` elements.  
  > **username_1**: Good catch @ian. Swear I had that working at some point but I don't use much in the way of custom Redactor configs anymore, so it's probably just my memory failing me. Answer edited  
  
  ---
  
  ### Answer by username_0 on 2014-06-18. Score: 8
  
  username_4 answers my questions regarding the formatting tags and the fact that you need to create a Craft plugin to add Redactor plugins.
  
  Since there wasn't a solution for adding classes on inline elements with custom classes/styles, Nathan's plugin only supports block elements, I created a plugin that wraps the Styles Redactor plugin. You can get it here: <https://github.com/aelvan/RedactorStyles-Craft>
  
  > **Comments:**
  > **username_3**: Redactor 10.0, which hopefully finds its way into the next Craft update, now has 140 new APIs including a new [inline formatting function](http://imperavi.com/redactor/docs/api/inline/). I hope this resolves the big issue with removing styles. The behavior of their updated [font-color plugin](http://imperavi.com/redactor/plugins/font-color/) look promising (on the front end side at least!).  
  > **username_0**: Yes, I've been looking at the 10.0 docs, and it seems these kind of things will be trivial as soon as Craft updates to it.  
  
  ---
  
  