Answers.Body: <p>Try this for data attributes:</p>
  
  <pre><code>"formattingAdd": {
      "add-animate": {
          "title": "Animate",
          "api": "module.block.format",
          "args": {
              "tag": "p",
              "attr": {
                  "data-aos": "fade-right"
              },
              "type": "toggle"
          }
      }
  }
  </code></pre>
  
  <p>This for classes:</p>
  
  <pre><code>"formattingAdd": {
      "add-note": {
          "title": "Note",
          "api": "module.block.format",
          "args": {
              "tag": "p",
              "class": "note"
          }
      }
  }
  </code></pre>
  
  <p><a href="https://imperavi.com/redactor/docs/settings/formatting/#s-formattingadd" rel="nofollow noreferrer">redactor settings formatting</a></p>
  
Answers.ContentLicense: CC BY-SA 4.0
Answers.CreationDate: 2018-11-26T17:48:31.953Z
Answers.LastActivityDate: 2018-11-26T17:59:10.423Z
Answers.LastEditDate: 2018-11-26T17:59:10.423Z
Answers.UserDisplayName: HendrikEng
Body: <p>I added a custom formattingAdd to my Standard.json file in my Redactor config. It's supposed to add the attribute <code>data-aos="fade-right"</code> to a paragraph tag. The "Animate" format option is showing up in the CP, but when I select that format the code doesn't change (it stays just a normal <code>p</code> without the <code>data-aos="fade-right</code> attribute).</p>
  
  <pre><code>{
  "buttons": ["html", "formatting", "bold", "italic", "unorderedlist", "orderedlist", "link"],
    "plugins": ["fullscreen", "video"],
    "linkNewTab": true,
    "toolbarFixed": true,
    "formatting" : ["animate", "h1", "h2", "h3", "h4", "h5", "h6", "p"],
    "formattingAdd": {
      "animate": {
        "title": "Animate",
        "args": ["p", "data-aos", "fade-right", "toggle"]
      }
    }
  }
  </code></pre>
  
  <p>I've tried this with classes as well, like this:</p>
  
  <pre><code>"formattingAdd": {
    "note": {
      "title": "Note",
      "args": ["p", "class", "note"]
    }
  }
  </code></pre>
  
  <p>but the <code>note</code> class isn't added to the <code>p</code> tags either.</p>
  
  <p>Any ideas why the attribute and class aren't showing up in the <code>p</code> tags?</p>
  
Tags: <craft3><redactor>
Title: Redactor - formattingAdd isn't changing code
ThreadText: # Redactor - formattingAdd isn't changing code
  
  (Asked by: username_0 on 2018-11-26)
  
  I added a custom formattingAdd to my Standard.json file in my Redactor config. It's supposed to add the attribute `data-aos="fade-right"` to a paragraph tag. The "Animate" format option is showing up in the CP, but when I select that format the code doesn't change (it stays just a normal `p` without the `data-aos="fade-right` attribute).
  
  ```
  {
  "buttons": ["html", "formatting", "bold", "italic", "unorderedlist", "orderedlist", "link"],
    "plugins": ["fullscreen", "video"],
    "linkNewTab": true,
    "toolbarFixed": true,
    "formatting" : ["animate", "h1", "h2", "h3", "h4", "h5", "h6", "p"],
    "formattingAdd": {
      "animate": {
        "title": "Animate",
        "args": ["p", "data-aos", "fade-right", "toggle"]
      }
    }
  }
  
  ```
  
  I've tried this with classes as well, like this:
  
  ```
  "formattingAdd": {
    "note": {
      "title": "Note",
      "args": ["p", "class", "note"]
    }
  }
  
  ```
  
  but the `note` class isn't added to the `p` tags either.
  
  Any ideas why the attribute and class aren't showing up in the `p` tags?
  
  **Tags:** craft3, redactor
  
  
  ---
  
  ## 1 answers
  
  ### Answer by username_1 on 2018-11-26. Score: 2 | Accepted answer
  
  Try this for data attributes:
  
  ```
  "formattingAdd": {
      "add-animate": {
          "title": "Animate",
          "api": "module.block.format",
          "args": {
              "tag": "p",
              "attr": {
                  "data-aos": "fade-right"
              },
              "type": "toggle"
          }
      }
  }
  
  ```
  
  This for classes:
  
  ```
  "formattingAdd": {
      "add-note": {
          "title": "Note",
          "api": "module.block.format",
          "args": {
              "tag": "p",
              "class": "note"
          }
      }
  }
  
  ```
  
  [redactor settings formatting](https://imperavi.com/redactor/docs/settings/formatting/#s-formattingadd)
  
  
  ---
  
  