CKEditor Ecosystem Documentation
Search
Home/CKEditor 5/API
Interface

TextTransformationConfig (typing)

@ckeditor/ckeditor5-typing/src/typingconfig

interface
See source

The configuration of the text transformation feature.

ClassicEditor
	.create( editorElement, {
		typing: {
			transformations: ... // Text transformation feature options.
		}
	} )
	.then( ... )
	.catch( ... );

By default, the feature comes pre-configured (via config.typing.transformations.include) with the following groups of transformations:

  • Typography (group name: typography)
    • ellipsis: transforms ... to …
    • enDash: transforms -- to –
    • emDash: transforms --- to —
  • Quotations (group name: quotes)
    • quotesPrimary: transforms "Foo bar" to “Foo bar”
    • quotesSecondary: transforms 'Foo bar' to ‘Foo bar’
  • Symbols (group name: symbols)
    • trademark: transforms (tm) to ™
    • registeredTrademark: transforms (r) to ®
    • copyright: transforms (c) to ©
  • Mathematical (group name: mathematical)
    • oneHalf: transforms 1/2 to: ½
    • oneThird: transforms 1/3 to: ⅓
    • twoThirds: transforms 2/3 to: ⅔
    • oneForth: transforms 1/4 to: ¼
    • threeQuarters: transforms 3/4 to: ¾
    • lessThanOrEqual: transforms <= to: ≤
    • greaterThanOrEqual: transforms >= to: ≥
    • notEqual: transforms != to: ≠
    • arrowLeft: transforms <- to: ←
    • arrowRight: transforms -> to: →
  • Misc:
    • quotesPrimaryEnGb: transforms 'Foo bar' to ‘Foo bar’
    • quotesSecondaryEnGb: transforms "Foo bar" to “Foo bar”
    • quotesPrimaryPl: transforms "Foo bar" to „Foo bar”
    • quotesSecondaryPl: transforms 'Foo bar' to ‚Foo bar’

In order to load additional transformations, use the transformations.extra option.

In order to narrow down the list of transformations, use the transformations.remove option.

In order to completely override the supported transformations, use the transformations.include option.

Examples:

const transformationsConfig = {
	include: [
		// Use only the 'quotes' and 'typography' groups.
		'quotes',
		'typography',

		// Plus, some custom transformation.
		{ from: 'CKE', to: 'CKEditor' }
	]
};

const transformationsConfig = {
	// Remove the 'ellipsis' transformation loaded by the 'typography' group.
	remove: [ 'ellipsis' ]
}

Filtering

Properties