Issues with TinyMCE styles

Resolved Sefam
(@sefam)

6 years, 7 months ago
I am trying to add custom formats to tinymce’s style select in wysiwyg fields, but my settings only crash the editor.
```
'tinymce' => array(
	'style_formats' => array(
		array(
			'title' => 'Test',
			'inline' => 'p',
			'classes' => 'test1'
		),
		array(
			'title' => 'Test2',
			'inline' => 'p',
			'classes' => 'test2'
		),
	),
	'toolbar1' => "styleselect,bold,italic,underline,strikethrough,forecolor,bullist | alignleft aligncenter alignright alignjustify",
),
```
Doing this crashes tinymce, javascript giving an undefined variable error. I was wondering what was the proper way to do this, or if I’m missing something that I need to do. I’m trying to offer users different preset styles to play with.
- This topic was modified 6 years, 7 months ago by Sefam.

Viewing 3 replies - 1 through 3 (of 3 total)

Plugin Contributor Michael Beckwith
(@tw2113)

The BenchPresser

6 years, 7 months ago

For the sake of consistency, what tutorial or similar are you getting your arguments from above?

Seems like potentially issues with parameters passed in, for the style_formats section. The toolbar1 part alone worked without issue for me.
Thread Starter Sefam
(@sefam)

6 years, 7 months ago
I am basing it off of this:
https://codex.ww.wp.xz.cn/TinyMCE_Custom_Styles#Using_style_formats

https://pugpig.zendesk.com/hc/en-us/articles/200947688-Connector-Information-How-to-Add-Styles-to-the-WYSIWYG-Editor

https://www.tiny.cloud/docs-4x/configure/content-formatting/#style_formats

I believe that in CMB2, the ‘tinymce’ array passes off settings to initialize tinymce. Toolbar1 is one of those settings you can use, along with toolbar2, toolbar3 etc.

I’m simply at a loss of how the array should be, take for instance this init with style_format:
```
tinymce.init({
  selector: 'textarea',  // change this value according to your html
  toolbar: "styleselect",
  style_formats: [
    {title: 'Bold text', inline: 'b'},
    {title: 'Red text', inline: 'span', styles: {color: '#ff0000'}},
    {title: 'Red header', block: 'h1', styles: {color: '#ff0000'}},
    {title: 'Example 1', inline: 'span', classes: 'example1'},
    {title: 'Example 2', inline: 'span', classes: 'example2'},
    {title: 'Table styles'},
    {title: 'Table row 1', selector: 'tr', classes: 'tablerow1'}
  ]
});
```
I’d like to think arrays inside an array would function properly?
- This reply was modified 6 years, 7 months ago by Sefam.
Plugin Contributor Michael Beckwith
(@tw2113)

The BenchPresser

6 years, 7 months ago

From the looks of it, the two links that have PHP based setup pass the arguments through either json_encode or wp_json_encode I was able to get things working with that change to the original code you provided. So, I think once you do that, you’ll be golden.

Viewing 3 replies - 1 through 3 (of 3 total)

The topic ‘Issues with TinyMCE styles’ is closed to new replies.

Tags