StyleConfig (style)

@ckeditor/ckeditor5-style/src/style

ClassicEditor
	.create( {
		style: ... // Style feature config.
	} )
	.then( ... )
	.catch( ... );

Properties

• definitions : Array.<StyleDefinition>module:style/style~StyleConfig#definitions

  See source

  The available style definitions.

  Style definitions are displayed in the 'style' UI dropdown and get applied by the style command to the content of the document.

  In the 'style' UI dropdown, definitions are automatically grouped into two categories based on the of the element property:

  • Block styles: Can be applied to entire block elements only (e.g. headings, paragraphs, divs).
  • Text styles: Can by applied to any text in any element in the document.

  An example configuration:

  [
  	// Definitions of block styles.
  	{
  		name: 'Red heading',
  		element: 'h2',
  		classes: [ 'red-heading' ]
  	},
  	{
  		name: 'Vibrant code',
  		element: 'pre',
  		classes: [ 'vibrant-code' ]
  	},
  
  	// Definitions of text (inline) styles.
  	{
  		name: 'Marker',
  		element: 'span',
  		classes: [ 'marker' ]
  	},
  	// ...
  ]
  

  Note: Configuring style definitions will automatically configure the General HTML Support feature. You do not need to repeat the configuration in GeneralHtmlSupportConfig.