view : List (Html.Attribute msg) -> List (Html msg) -> Html msg
Renders a CKEditor instance
view
[ config defaultConfig
, onCKEditorChange CKEditorChanged
]
[ text "Initial text" ]
config : Config -> Html.Attribute msg
Add the specified configuration to the editor. This will reload the component
view
[ config (defaultConfig |> withLanguage "fr") ]
[]
editor : String -> Html.Attribute msg
Sets the registered editor build to use
See ckeditor5-webcomponent for more information
content : String -> Html.Attribute msg
Sets the content of the editor
See ckeditor5-webcomponent for more information
targetId : String -> Html.Attribute msg
Sets the id of the element the editor will render for. (Itself by default)
See ckeditor5-webcomponent for more information
onChange : (String -> msg) -> Html.Attribute msg
Event fired when the CKEditor content changed. This event will not necessarily fire on every single input action.
type Msg
= CKEditorChanged String
view
[ onChange CKEditorChanged ]
[]
isContentEmpty : String -> Basics.Bool
Check if the content you received from the editor is empty.
Such a check can be necessary because when you empty the editor the final data
still contains <p> </p>
.
This function checks if the trimmed content is empty or is equal to <p> </p>
trimContent : String -> String
Trim the content, removing white spaces at the beginning and the end of the data. If the data is considered as empty (see isContentEmpty) this function will return an empty string
Configuration of CKEditor
defaultConfig : Config
Default CKEditor config
withCustom : String -> Json.Encode.Value -> Config -> Config
Set any other configuration
defaultConfig
|> withCustom "mediaEmbed" mediaEmbedEncoder
The name must be a valid configuration property name
withLanguage : String -> Config -> Config
Set the language to use in the configuration
defaultConfig
|> withLanguage "fr"
See reference for more information
withPlugins : List String -> Config -> Config
Set the plugins to use in the configuration
defaultConfig
|> withPlugins [ "Bold", "Italic" ]
See reference for more information
withPluginsRemoved : List String -> Config -> Config
Set the plugins that should not be loaded in the configuration
defaultConfig
|> withPluginsRemoved [ "Bold", "Italic" ]
See reference for more information
withToolbar : List String -> Config -> Config
Set the toolbar to use in the configuration
defaultConfig
|> withToolbar [ "bold", "italic" ]
See reference for more information