|
@@ -21,7 +21,7 @@ The {@link module:font/font~Font} plugin enables the following features in the r
|
|
|
|
|
|
|
|
## Configuring the font family feature
|
|
## Configuring the font family feature
|
|
|
|
|
|
|
|
-It is possible to configure which font family options are supported by the WYSIWYG editor. Use the {@link module:font/fontfamily~FontFamilyConfig#options `fontFamily.options`} configuration option to do so.
|
|
|
|
|
|
|
+It is possible to configure which font family options are supported by the WYSIWYG editor. Use the {@link module:font/fontfamily~FontFamilyConfig#options `config.fontFamily.options`} configuration option to do so.
|
|
|
|
|
|
|
|
Use the special `'default'` keyword to use the default font family defined in the web page styles. It removes any custom font family.
|
|
Use the special `'default'` keyword to use the default font family defined in the web page styles. It removes any custom font family.
|
|
|
|
|
|
|
@@ -47,9 +47,9 @@ ClassicEditor
|
|
|
|
|
|
|
|
{@snippet features/custom-font-family-options}
|
|
{@snippet features/custom-font-family-options}
|
|
|
|
|
|
|
|
-### Prevent removing non-specified values
|
|
|
|
|
|
|
+### Accept all font names
|
|
|
|
|
|
|
|
-By default, all not specified values of `font-family` are removing during the conversion. You can disable this behaviour using `disableValueMatching` option.
|
|
|
|
|
|
|
+By default, all `font-family` values that are not specified in the `config.fontFamily.options` are stripped. You can enable support for all font names by using the {@link module:font/fontfamily~FontFamilyConfig#supportAllValues `config.fontFamily.supportAllValues`} option.
|
|
|
|
|
|
|
|
```js
|
|
```js
|
|
|
ClassicEditor
|
|
ClassicEditor
|
|
@@ -58,7 +58,7 @@ ClassicEditor
|
|
|
options: [
|
|
options: [
|
|
|
// ...
|
|
// ...
|
|
|
],
|
|
],
|
|
|
- disableValueMatching: true
|
|
|
|
|
|
|
+ supportAllValues: true
|
|
|
},
|
|
},
|
|
|
// ...
|
|
// ...
|
|
|
} )
|
|
} )
|
|
@@ -68,7 +68,7 @@ ClassicEditor
|
|
|
|
|
|
|
|
## Configuring the font size feature
|
|
## Configuring the font size feature
|
|
|
|
|
|
|
|
-It is possible to configure which font size options are supported by the WYSIWYG editor. Use the {@link module:font/fontsize~FontSizeConfig#options `fontSize.options`} configuration option to do so.
|
|
|
|
|
|
|
+It is possible to configure which font size options are supported by the WYSIWYG editor. Use the {@link module:font/fontsize~FontSizeConfig#options `config.fontSize.options`} configuration option to do so.
|
|
|
|
|
|
|
|
Use the special `'default'` keyword to use the default font size defined in the web page styles. It removes any custom font size.
|
|
Use the special `'default'` keyword to use the default font size defined in the web page styles. It removes any custom font size.
|
|
|
|
|
|
|
@@ -171,7 +171,8 @@ ClassicEditor
|
|
|
|
|
|
|
|
### Prevent removing non-specified values
|
|
### Prevent removing non-specified values
|
|
|
|
|
|
|
|
-By default, all not specified values of `font-size` are removing during the conversion. You can disable this behaviour using `disableValueMatching` option.
|
|
|
|
|
|
|
+By default, all `font-size` values that are not specified in the `config.fontSize.options` are stripped. You can enable support for all font sizes by using the {@link module:font/fontfamily~FontSizeConfig#supportAllValues `config.fontSize.supportAllValues`} option.
|
|
|
|
|
+
|
|
|
|
|
|
|
|
```js
|
|
```js
|
|
|
ClassicEditor
|
|
ClassicEditor
|
|
@@ -180,7 +181,7 @@ ClassicEditor
|
|
|
options: [
|
|
options: [
|
|
|
// ...
|
|
// ...
|
|
|
],
|
|
],
|
|
|
- disableValueMatching: true
|
|
|
|
|
|
|
+ supportAllValues: true
|
|
|
},
|
|
},
|
|
|
// ...
|
|
// ...
|
|
|
} )
|
|
} )
|
|
@@ -202,7 +203,7 @@ Check out the WYSIWYG editor below with both features customized using the edito
|
|
|
|
|
|
|
|
### Specifying available colors
|
|
### Specifying available colors
|
|
|
|
|
|
|
|
-It is possible to configure which colors are available in the color dropdown. Use the {@link module:font/fontcolor~FontColorConfig#colors `fontColor.colors`} and {@link module:font/fontbackgroundcolor~FontBackgroundColorConfig#colors `fontBackgroundColor.colors`} configuration options to do so.
|
|
|
|
|
|
|
+It is possible to configure which colors are available in the color dropdown. Use the {@link module:font/fontcolor~FontColorConfig#colors `config.fontColor.colors`} and {@link module:font/fontbackgroundcolor~FontBackgroundColorConfig#colors `config.fontBackgroundColor.colors`} configuration options to do so.
|
|
|
|
|
|
|
|
```js
|
|
```js
|
|
|
ClassicEditor
|
|
ClassicEditor
|
|
@@ -270,7 +271,7 @@ ClassicEditor
|
|
|
|
|
|
|
|
### Changing the geometry of the color grid
|
|
### Changing the geometry of the color grid
|
|
|
|
|
|
|
|
-You can configure the number of columns in the color dropdown by setting the {@link module:font/fontcolor~FontColorConfig#columns `fontColor.columns`} and {@link module:font/fontbackgroundcolor~FontBackgroundColorConfig#columns `fontBackgroundColor.columns`} configuration options.
|
|
|
|
|
|
|
+You can configure the number of columns in the color dropdown by setting the {@link module:font/fontcolor~FontColorConfig#columns `config.fontColor.columns`} and {@link module:font/fontbackgroundcolor~FontBackgroundColorConfig#columns `config.fontBackgroundColor.columns`} configuration options.
|
|
|
|
|
|
|
|
Usually, you will want to use this option when changing the number of [available colors](#specifying-available-colors).
|
|
Usually, you will want to use this option when changing the number of [available colors](#specifying-available-colors).
|
|
|
|
|
|
|
@@ -303,7 +304,7 @@ ClassicEditor
|
|
|
|
|
|
|
|
The font and font background color dropdowns contain the "Document colors" section. It lists the colors already used in the document for the users to be able to easily reuse them (for consistency purposes).
|
|
The font and font background color dropdowns contain the "Document colors" section. It lists the colors already used in the document for the users to be able to easily reuse them (for consistency purposes).
|
|
|
|
|
|
|
|
-By default, the number of displayed document colors is limited to one row, but you can adjust it (or remove the whole section) by using the {@link module:font/fontcolor~FontColorConfig#documentColors `fontColor.documentColors`} or {@link module:font/fontbackgroundcolor~FontBackgroundColorConfig#documentColors `fontBackgroundColor.documentColors`} options.
|
|
|
|
|
|
|
+By default, the number of displayed document colors is limited to one row, but you can adjust it (or remove the whole section) by using the {@link module:font/fontcolor~FontColorConfig#documentColors `config.fontColor.documentColors`} or {@link module:font/fontbackgroundcolor~FontBackgroundColorConfig#documentColors `config.fontBackgroundColor.documentColors`} options.
|
|
|
|
|
|
|
|
```js
|
|
```js
|
|
|
ClassicEditor
|
|
ClassicEditor
|
|
@@ -378,7 +379,7 @@ The {@link module:font/fontfamily~FontFamily} plugin registers the following com
|
|
|
* The `'fontFamily'` dropdown.
|
|
* The `'fontFamily'` dropdown.
|
|
|
* The {@link module:font/fontfamily/fontfamilycommand~FontFamilyCommand `'fontFamily'`} command.
|
|
* The {@link module:font/fontfamily/fontfamilycommand~FontFamilyCommand `'fontFamily'`} command.
|
|
|
|
|
|
|
|
- The number of options and their names correspond to the {@link module:font/fontfamily~FontFamilyConfig#options `fontFamily.options`} configuration option.
|
|
|
|
|
|
|
+ The number of options and their names correspond to the {@link module:font/fontfamily~FontFamilyConfig#options `config.fontFamily.options`} configuration option.
|
|
|
|
|
|
|
|
You can change the font family of the current selection by executing the command with a desired value:
|
|
You can change the font family of the current selection by executing the command with a desired value:
|
|
|
|
|
|
|
@@ -424,7 +425,7 @@ The {@link module:font/fontsize~FontSize} plugin registers the following compone
|
|
|
* The `'fontSize'` dropdown.
|
|
* The `'fontSize'` dropdown.
|
|
|
* The {@link module:font/fontsize/fontsizecommand~FontSizeCommand `'fontSize'`} command.
|
|
* The {@link module:font/fontsize/fontsizecommand~FontSizeCommand `'fontSize'`} command.
|
|
|
|
|
|
|
|
- The number of options and their names correspond to the {@link module:font/fontsize~FontSizeConfig#options `fontSize.options`} configuration option.
|
|
|
|
|
|
|
+ The number of options and their names correspond to the {@link module:font/fontsize~FontSizeConfig#options `config.fontSize.options`} configuration option.
|
|
|
|
|
|
|
|
You can change the font size of the current selection by executing the command with a desired value:
|
|
You can change the font size of the current selection by executing the command with a desired value:
|
|
|
|
|
|
|
@@ -436,7 +437,7 @@ The {@link module:font/fontsize~FontSize} plugin registers the following compone
|
|
|
editor.execute( 'fontSize', { value: 'small' } );
|
|
editor.execute( 'fontSize', { value: 'small' } );
|
|
|
```
|
|
```
|
|
|
|
|
|
|
|
- Passing an empty value will remove any `fontSize` set:
|
|
|
|
|
|
|
+ Passing an empty value will remove any `config.fontSize` set:
|
|
|
|
|
|
|
|
```js
|
|
```js
|
|
|
editor.execute( 'fontSize' );
|
|
editor.execute( 'fontSize' );
|