<p>After several iterations I came up with this that works. But still puzzled as when to use [ ] or { }.</p>

<pre><code>{
    "buttons": ["html","undo","format","bold","lists","link","file"],
    "plugins": ["fullscreen","table","video"],
    "formatting": ["p"],
    "formattingAdd": {
        "heading": {
            "title": "Heading",
            "api": "module.block.format",
            "args": {
                "tag": "h2"
            }
        },
        "sub-heading": {
            "title": "Sub-Heading",
            "api": "module.block.format",
            "args": {
                "tag": "h3"
            }
        },
        "sub-sub-heading": {
            "title": "Sub-sub-Heading",
            "api": "module.block.format",
            "args": {
                "tag": "h4"
            }
        },
        "add-attr": {
            "title": "Make a link a button",
            "api": "module.block.format",
            "args": {
                "tag": "div",
                "class": "button"
            }
        }
    }   
}
</code></pre>

CC BY-SA 4.0
2018-05-09T08:19:09.360Z
2018-05-09T08:19:09.360Z
Paul Frost
<p>i have tested it with the latest Craft 3 version and it works if everything is in double quotes:</p>

<pre><code>{
    "buttons": ["format","bold","lists","link","file"],
    "plugins": ["fullscreen","table","video"],
    "formatting": ["p"],
    "formattingAdd": {
        "heading": {
            "title": "Heading",
            "args": ["h2"]
        },
        "sub-heading": {
            "title": "Sub-Heading",
            "args": ["h3"]
        },
        "sub-sub-heading": {
            "title": "Sub-sub-Heading",
            "args": ["h4"]
        },
        "add-attr": {
            "title": "Make a link a button",
            "args": ["div", { "class": "button" }]
        }
    }   
}
</code></pre>

<p>Maybe it was only a typo?</p>

CC BY-SA 4.0
2018-05-07T20:23:46.190Z
Thanks NoX, I thought I had tried every combination but as you say I must have had a typo. It is confusing though when you look at the Imperavi docs, as they have different syntax with curly brackets and an api reference.
Paul Frost
CC BY-SA 4.0
2018-05-07T20:34:55.763Z
Sorry, further testing shows that the formatting is not being applied to the html code. If I select some text and choose "Heading" nothing happens, the text stays as <p> tags. But it did stop the error on page load.
Paul Frost
CC BY-SA 4.0
2018-05-09T07:07:45.607Z
To be honest, I did not Test if everything is working. I will give it a try this evening - or did you found already a solution?
noxify
CC BY-SA 4.0
2018-05-09T08:20:04.463Z
Yes, see my answer below
Paul Frost
CC BY-SA 4.0
2018-05-07T16:55:08.703Z
2018-05-07T16:55:08.703Z
noxify
<p>I'm trying to get the same features I had in Craft 2 in Craft 3 redactor field.
This is the code I had in config/redactor/standard.json:</p>

<pre><code>{
    "buttons": ["format","bold","lists","link","file"],
    "plugins": ["fullscreen","table","video"],
    "formatting": ["p"],
    formattingAdd: {
        "heading": {
            title: 'Heading',
            args: ['h2']
        },
        "sub-heading": {
            title: 'Sub-Heading',
            args: ['h3']
        },
        "sub-sub-heading": {
            title: 'Sub-sub-Heading',
            args: ['h4']
        },
        "add-attr": {
            title: 'Make a link a button',
            args: ['div', { 'class': 'button' }]
        }
    }   
}
</code></pre>

<p>The Craft 3 changes page says:
"All strings must use double quotes rather than single quotes" and that "All object properties (the config setting names) must be wrapped in double quotes".
I've tried changing them all and I still get an error. I've looked on the <a href="https://imperavi.com/redactor/docs/settings/formatting/" rel="nofollow noreferrer">Imperavi Redactor docs pages</a>, but they don't use double quotes and their examples are not in the same format as the craft plugin uses. Some more examples would be useful.</p>

CC BY-SA 4.0
2018-05-07T16:57:26.610Z
In Craft 3, redactor config files need to be valid json. An easy way to check this is with a json validator, e.g.: https://jsonlint.com/
Marion Newlevant
<redactor><plugin-redactorstyles>
Redactor 3 config code
# Redactor 3 config code

(Asked by: username_0 on 2018-05-07)

I'm trying to get the same features I had in Craft 2 in Craft 3 redactor field.
This is the code I had in config/redactor/standard.json:
{
    "buttons": ["format","bold","lists","link","file"],
    "plugins": ["fullscreen","table","video"],
    "formatting": ["p"],
    formattingAdd: {
        "heading": {
            title: 'Heading',
            args: ['h2']
        },
        "sub-heading": {
            title: 'Sub-Heading',
            args: ['h3']
        },
        "sub-sub-heading": {
            title: 'Sub-sub-Heading',
            args: ['h4']
        },
        "add-attr": {
            title: 'Make a link a button',
            args: ['div', { 'class': 'button' }]
        }
    }   
}

The Craft 3 changes page says:
"All strings must use double quotes rather than single quotes" and that "All object properties (the config setting names) must be wrapped in double quotes".
I've tried changing them all and I still get an error. I've looked on the Imperavi Redactor docs pages, but they don't use double quotes and their examples are not in the same format as the craft plugin uses. Some more examples would be useful.

**Tags:** redactor, plugin-redactorstyles
> **Comments:**
> **username_1**: In Craft 3, redactor config files need to be valid json. An easy way to check this is with a json validator, e.g.: https://jsonlint.com/  

---

## 2 answers

### Answer by username_0 on 2018-05-09. Score: 4

After several iterations I came up with this that works. But still puzzled as when to use [ ] or { }.
{
    "buttons": ["html","undo","format","bold","lists","link","file"],
    "plugins": ["fullscreen","table","video"],
    "formatting": ["p"],
    "formattingAdd": {
        "heading": {
            "title": "Heading",
            "api": "module.block.format",
            "args": {
                "tag": "h2"
            }
        },
        "sub-heading": {
            "title": "Sub-Heading",
            "api": "module.block.format",
            "args": {
                "tag": "h3"
            }
        },
        "sub-sub-heading": {
            "title": "Sub-sub-Heading",
            "api": "module.block.format",
            "args": {
                "tag": "h4"
            }
        },
        "add-attr": {
            "title": "Make a link a button",
            "api": "module.block.format",
            "args": {
                "tag": "div",
                "class": "button"
            }
        }
    }   
}


---

### Answer by username_2 on 2018-05-07. Score: 1

i have tested it with the latest Craft 3 version and it works if everything is in double quotes:
{
    "buttons": ["format","bold","lists","link","file"],
    "plugins": ["fullscreen","table","video"],
    "formatting": ["p"],
    "formattingAdd": {
        "heading": {
            "title": "Heading",
            "args": ["h2"]
        },
        "sub-heading": {
            "title": "Sub-Heading",
            "args": ["h3"]
        },
        "sub-sub-heading": {
            "title": "Sub-sub-Heading",
            "args": ["h4"]
        },
        "add-attr": {
            "title": "Make a link a button",
            "args": ["div", { "class": "button" }]
        }
    }   
}

Maybe it was only a typo?

> **Comments:**
> **username_0**: Thanks NoX, I thought I had tried every combination but as you say I must have had a typo. It is confusing though when you look at the Imperavi docs, as they have different syntax with curly brackets and an api reference.  
> **username_0**: Sorry, further testing shows that the formatting is not being applied to the html code. If I select some text and choose "Heading" nothing happens, the text stays as <p> tags. But it did stop the error on page load.  
> **username_2**: To be honest, I did not Test if everything is working. I will give it a try this evening - or did you found already a solution?  
> **username_0**: Yes, see my answer below  

---

