I have read the documentation of ckeditor regarding the React Context , but I couldn't find how to make a Placeholder on the CKEditor.
This is the link to the react ckeditor react ckeditor
This is the sample code :
<CKEditor
onInit={editor => {
// Insert the toolbar before the editable area.
editor.ui.view.editable.element.parentElement.insertBefore(
editor.ui.view.toolbar.element,
editor.ui.view.editable.element);}}
name={this.state.body}
onChange={this.handleEditorChange}
editor={DecoupledEditor}
data={this.state.body}
/>
It was reworked in CKEditor 4.3 and is now available as an inline widget. When the Placeholder plugin is enabled, the button is automatically added to the toolbar. Once clicked, it opens the Placeholder Properties dialog window that lets you add the placeholder text.
A placeholder is used to reserve space for content that soon will appear in a layout. Placeholders can include PlaceholderParagraph , PlaceholderHeader , and PlaceholderImage to let you format the loaders to emulate the content being loaded. Simulate loading.
The easiest way to use CKEditor 5 in your React application is by choosing one of the rich text editor builds. Additionally, it is also possible to integrate CKEditor 5 built from source into your application. You can also use a customized editor built by using CKEditor 5 online builder in any React application.
<CKEditor
config={{placeholder: "Placeholder text..."}}
...
/>
Works for me
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With