From 3171b34d04c54e7c9743d3727a4f38dfdecceaa9 Mon Sep 17 00:00:00 2001 From: Bhuvaneshwari-SF4208 Date: Mon, 22 Sep 2025 09:05:12 +0530 Subject: [PATCH 1/7] 983303: Updated accessibility.md, data-binding.md, editor-modes.md, enter-key.md --- blazor/rich-text-editor/accessibility.md | 41 ++++++++++++------------ blazor/rich-text-editor/data-binding.md | 20 ++++++------ blazor/rich-text-editor/editor-modes.md | 24 +++++++++----- blazor/rich-text-editor/enter-key.md | 16 ++++----- 4 files changed, 54 insertions(+), 47 deletions(-) diff --git a/blazor/rich-text-editor/accessibility.md b/blazor/rich-text-editor/accessibility.md index aa602ac022..ad7b7d600d 100644 --- a/blazor/rich-text-editor/accessibility.md +++ b/blazor/rich-text-editor/accessibility.md @@ -1,17 +1,17 @@ --- layout: post -title: Accessibility in Blazor RichTextEditor Component | Syncfusion -description: Checkout and learn here all about accessibility in Syncfusion Blazor RichTextEditor component and more. +title: Blazor Rich Text Editor Accessibility | Syncfusion +description: Learn about the accessibility features in the Syncfusion Blazor Rich Text Editor component and more. platform: Blazor control: RichTextEditor documentation: ug --- -# Accessibility in Blazor Rich Text Editor Component +# Blazor Rich Text Editor Accessibility -The [Blazor Rich Text Editor](https://www.syncfusion.com/blazor-components/blazor-wysiwyg-rich-text-editor) component has been designed, keeping in mind the [WAI-ARIA](https://www.w3.org/WAI/ARIA/apg/patterns/) specifications, and applies the WAI-ARIA roles, states, and properties. This component is characterized by complete ARIA accessibility support that makes it easy for people who use assistive technologies (AT) or those who completely rely on keyboard navigation. +The [Blazor Rich Text Editor](https://www.syncfusion.com/blazor-components/blazor-wysiwyg-rich-text-editor) is designed in compliance with [WAI-ARIA](https://www.w3.org/WAI/ARIA/apg/patterns/) specifications, applying the appropriate roles, states, and properties. This ensures that the component is accessible to users who rely on assistive technologies (AT) or keyboard navigation. -The Blazor Rich Text Editor component followed the accessibility guidelines and standards, including [ADA](https://www.ada.gov/), [Section 508](https://www.section508.gov/), [WCAG 2.2](https://www.w3.org/TR/WCAG22/) standards, and [WCAG roles](https://www.w3.org/TR/wai-aria/#roles) that are commonly used to evaluate accessibility. +The Blazor Rich Text Editor follows established accessibility guidelines, including [ADA](https://www.ada.gov/), [Section 508](https://www.section508.gov/), [WCAG 2.2](https://www.w3.org/TR/WCAG22/) standards, and [WCAG roles](https://www.w3.org/TR/wai-aria/#roles) that are commonly used to evaluate accessibility. The accessibility compliance for the Blazor Rich Text Editor component is outlined below. @@ -32,7 +32,7 @@ The accessibility compliance for the Blazor Rich Text Editor component is outlin margin: 0.5em 0; } -
Yes - All features of the component meet the requirement.
+
Yes - All features of a component meet the requirement.
Intermediate - Some features of the component do not meet the requirement.
@@ -40,24 +40,24 @@ The accessibility compliance for the Blazor Rich Text Editor component is outlin ## WAI-ARIA attributes -* The toolbar of Blazor Rich Text Editor, assigned the role of `Toolbar` and has the following list of [WAI-ARIA](https://www.w3.org/WAI/ARIA/apg/patterns/) attribute. +The toolbar of the Blazor Rich Text Editor is assigned the `toolbar` role and supports the following [WAI-ARIA](https://www.w3.org/WAI/ARIA/apg/patterns/) attributes: | **Property** | **Functionalities** | | --- | --- | | role="toolbar" | This attribute added to the ToolBar element describes the actual role of the element. | -| aria-orientation | Indicates the ToolBar orientation. Default value is `horizontal`. | -| aria-haspopup | Indicates the popup mode of the Toolbar. Default value is false. When popup mode is enabled, attribute value has to be changed to `true`. | | -| aria-disabled | Indicates the disabled state of the ToolBar. | +| aria-orientation | Indicates the toolbar's orientation. The default value is `horizontal`. | +| aria-haspopup | Indicates if the toolbar has a popup. When popup mode is enabled, this value is set to `true`. The default is `false`. | +| aria-disabled | Indicates the disabled state of the toolbar. | | aria-owns | Identifies an element to define a visual, functional, or contextual parent/child relationship between DOM elements when the DOM hierarchy cannot represent the relationship. In the Rich Text Editor, the attribute contains the ID of the Rich Text Editor to indicate the popup as a child element. | -For further details of Toolbar ARIA attributes, refer the [`accessibility of Toolbar`](../../toolbar/accessibility) documentation. +For more details on toolbar WAI-ARIA attributes, refer to the [accessibility of Toolbar](https://blazor.syncfusion.com/documentation/toolbar/accessibility) documentation. -The Blazor Rich Text Editor element is assigned the role of `application`. +The Blazor Rich Text Editor element is assigned the `application` role. | **Property** | **Functionalities** | | --- | --- | | role="application" | This attribute added to the Rich Text Editor element describes the actual role of the element. | -| aria-disabled | Indicates the disabled state of the ToolBar. | +| aria-disabled | Indicates the disabled state of the toolbar. | {% tabs %} {% highlight cshtml %} @@ -71,21 +71,21 @@ The Blazor Rich Text Editor element is assigned the role of `application`. ## Keyboard interaction -The Blazor Rich Text Editor component followed the [keyboard interaction](https://www.w3.org/WAI/ARIA/apg/patterns/alert/#keyboardinteraction) guideline, making it easy for people who use assistive technologies (AT) and those who completely rely on keyboard navigation. The following keyboard shortcuts are supported by the Rich Text Editor component.  +The Blazor Rich Text Editor component follows [keyboard interaction](https://www.w3.org/WAI/ARIA/apg/patterns/alert/#keyboardinteraction) guidelines, making it easy for people who use assistive technologies (AT) or rely solely on keyboard navigation. The component supports a variety of keyboard shortcuts for common actions. -For more details on keyboard navigation, refer to the [Keyboard support](https://blazor.syncfusion.com/documentation/rich-text-editor/keyboard-support) documentation. +For a complete list of keyboard shortcuts, refer to the [Keyboard Support](https://blazor.syncfusion.com/documentation/rich-text-editor/keyboard-support) documentation. ## Ensuring accessibility -The Blazor Rich Text Editor component's accessibility levels are ensured through an [axe-core](https://www.npmjs.com/package/axe-core) software tool during automated testing. +The Blazor Rich Text Editor component's accessibility is validated using the [axe-core](https://www.npmjs.com/package/axe-core) software tool during automated testing. -The accessibility compliance of the Rich Text Editor component is shown in the following sample. Open the [sample](https://blazor.syncfusion.com/accessibility/rich-text-editor) in a new window to evaluate the accessibility of the Rich Text Editor component with accessibility tools. +The accessibility compliance of the Rich Text Editor component is demonstrated in the following sample. You can open the [sample](https://blazor.syncfusion.com/accessibility/rich-text-editor) in a new window to evaluate the component with accessibility tools. ### Custom key configuration -Customize the key configuration for the keyboard interaction of the Rich Text Editor using the [KeyConfigure](https://help.syncfusion.com/cr/blazor/Syncfusion.Blazor.RichTextEditor.SfRichTextEditor.html#Syncfusion_Blazor_RichTextEditor_SfRichTextEditor_KeyConfigure) property. +You can customize the key configurations for keyboard interactions in the Rich Text Editor using the [KeyConfigure](https://help.syncfusion.com/cr/blazor/Syncfusion.Blazor.RichTextEditor.SfRichTextEditor.html#Syncfusion_Blazor_RichTextEditor_SfRichTextEditor_KeyConfigure) property. -In the following code block, customize the bold and italic, toolbar actions with **ctrl+1**, **ctrl+2** respectively. +In the following example, the bold and italic actions are customized to use **Ctrl+1** and **Ctrl+2**, respectively. {% tabs %} {% highlight cshtml %} @@ -95,8 +95,7 @@ In the following code block, customize the bold and italic, toolbar actions with {% endhighlight %} {% endtabs %} - -N> You can refer to our [Blazor Rich Text Editor](https://www.syncfusion.com/blazor-components/blazor-wysiwyg-rich-text-editor) feature tour page for its groundbreaking feature representations. You can also explore our [Blazor Rich Text Editor](https://blazor.syncfusion.com/demos/rich-text-editor/overview?theme=bootstrap5) example to knows how to render and configure the rich text editor tools. +N> You can explore the [Blazor Rich Text Editor feature tour page](https://www.syncfusion.com/blazor-components/blazor-wysiwyg-rich-text-editor) to see its capabilities. You can also refer to the [Blazor Rich Text Editor demo](https://blazor.syncfusion.com/demos/rich-text-editor/overview?theme=bootstrap5) to learn how to render and configure the component and its tools. ## See also diff --git a/blazor/rich-text-editor/data-binding.md b/blazor/rich-text-editor/data-binding.md index e054c0eb5d..c735d80fb8 100644 --- a/blazor/rich-text-editor/data-binding.md +++ b/blazor/rich-text-editor/data-binding.md @@ -1,7 +1,7 @@ --- layout: post title: Data Binding in Blazor RichTextEditor | Syncfusion -description: Checkout and learn here all about data binding in Syncfusion Blazor RichTextEditor component and more. +description: Learn how to implement data binding in the Syncfusion Blazor Rich Text Editor component and more. platform: Blazor control: RichTextEditor documentation: ug @@ -9,7 +9,7 @@ documentation: ug # Value Binding in Blazor RichTextEditor -You can bind the [Value](https://help.syncfusion.com/cr/blazor/Syncfusion.Blazor.RichTextEditor.SfRichTextEditor.html#Syncfusion_Blazor_RichTextEditor_SfRichTextEditor_Value) to the editor component, by using the `@bind-Value` attribute and it supports string type. If component value has been changed, it will affect all the places where you bind the variable for the **bind-Value** attribute. +The Blazor Rich Text Editor supports two-way data binding to its [Value](https://help.syncfusion.com/cr/blazor/Syncfusion.Blazor.RichTextEditor.SfRichTextEditor.html#Syncfusion_Blazor_RichTextEditor_SfRichTextEditor_Value) property using the `@bind-Value` attribute. The `Value` property accepts a `string` type. When the editor's content is modified, the bound variable is automatically updated. Likewise, any changes to the variable will be reflected in the editor's content. {% tabs %} {% highlight razor %} @@ -19,13 +19,15 @@ You can bind the [Value](https://help.syncfusion.com/cr/blazor/Syncfusion.Blazor {% endhighlight %} {% endtabs %} -## Auto save +## Auto-save -The Rich Text Editor saves its content automatically when you focus out the editor, and you can save its content automatically at regular intervals based on the [SaveInterval](https://help.syncfusion.com/cr/blazor/Syncfusion.Blazor.RichTextEditor.SfRichTextEditor.html#Syncfusion_Blazor_RichTextEditor_SfRichTextEditor_SaveInterval) and [AutoSaveOnIdle](https://help.syncfusion.com/cr/blazor/Syncfusion.Blazor.RichTextEditor.SfRichTextEditor.html#Syncfusion_Blazor_RichTextEditor_SfRichTextEditor_AutoSaveOnIdle) properties while editing. +The Rich Text Editor can automatically save its content based on the configuration of the [SaveInterval](https://help.syncfusion.com/cr/blazor/Syncfusion.Blazor.RichTextEditor.SfRichTextEditor.html#Syncfusion_Blazor_RichTextEditor_SfRichTextEditor_SaveInterval) and [AutoSaveOnIdle](https://help.syncfusion.com/cr/blazor/Syncfusion.Blazor.RichTextEditor.SfRichTextEditor.html#Syncfusion_Blazor_RichTextEditor_SfRichTextEditor_AutoSaveOnIdle) properties. By default, the content is saved when the editor loses focus. -* If `AutoSaveOnIdle` is set to true, the content is saved if the editor is idle for the number of milliseconds specified in the `SaveInterval` property. +* When `AutoSaveOnIdle` is `true`, the content is saved if the editor remains idle for the duration specified in the `SaveInterval` property (in milliseconds). -* If `AutoSaveOnIdle` is set to false, the editor saves the content at the regular interval of milliseconds specified in the `SaveInterval` property. +* When `AutoSaveOnIdle` is `false`, the content is saved at the regular interval defined by the `SaveInterval` property. + +The following example demonstrates how to use the `ValueChange` event to get a notification when the content is saved. {% tabs %} {% highlight razor %} @@ -53,9 +55,7 @@ The Rich Text Editor saves its content automatically when you focus out the edit ## Get editor content -You can get the RichTextEditor's edited content by using the [ValueChange](https://help.syncfusion.com/cr/blazor/Syncfusion.Blazor.RichTextEditor.RichTextEditorEvents.html#Syncfusion_Blazor_RichTextEditor_RichTextEditorEvents_ValueChange) event. - -When the user changes the content, the `ValueChange` event is invoked on every [SaveInterval](https://help.syncfusion.com/cr/blazor/Syncfusion.Blazor.RichTextEditor.SfRichTextEditor.html#Syncfusion_Blazor_RichTextEditor_SfRichTextEditor_SaveInterval) time or when the editor loses focus. +You can retrieve the editor's content using the [ValueChange](https://help.syncfusion.com/cr/blazor/Syncfusion.Blazor.RichTextEditor.RichTextEditorEvents.html#Syncfusion_Blazor_RichTextEditor_RichTextEditorEvents_ValueChange) event. This event is triggered either when the editor loses focus or at the specified [SaveInterval](https://help.syncfusion.com/cr/blazor/Syncfusion.Blazor.RichTextEditor.SfRichTextEditor.html#Syncfusion_Blazor_RichTextEditor_SfRichTextEditor_SaveInterval), allowing you to capture the latest content. {% tabs %} {% highlight razor %} @@ -65,4 +65,4 @@ When the user changes the content, the `ValueChange` event is invoked on every [ {% endhighlight %} {% endtabs %} -N> You can refer to our [Blazor Rich Text Editor](https://www.syncfusion.com/blazor-components/blazor-rich-text-editor) feature tour page for its groundbreaking feature representations. You can also explore our [Blazor Rich Text Editor](https://blazor.syncfusion.com/demos/rich-text-editor/overview?theme=bootstrap5) example to know how to render and configure the rich text editor tools. \ No newline at end of file +N> To explore the Rich Text Editor's features, visit the [feature tour page](https://www.syncfusion.com/blazor-components/blazor-rich-text-editor). You can also refer to the [Blazor Rich Text Editor demo](https://blazor.syncfusion.com/demos/rich-text-editor/overview?theme=bootstrap5) to learn how to render and configure the component and its tools. \ No newline at end of file diff --git a/blazor/rich-text-editor/editor-modes.md b/blazor/rich-text-editor/editor-modes.md index 70da963e63..ad9a7c9600 100644 --- a/blazor/rich-text-editor/editor-modes.md +++ b/blazor/rich-text-editor/editor-modes.md @@ -1,22 +1,24 @@ --- layout: post -title: Editor Modes in Blazor RichTextEditor Component | Syncfusion +title: Editor Modes in Blazor Rich Text Editor | Syncfusion description: Checkout and learn here all about Editor Modes in Syncfusion Blazor RichTextEditor component and more. platform: Blazor control: RichTextEditor documentation: ug --- -# Editor Modes in Blazor RichTextEditor Component +# Editor Modes in Blazor Rich Text Editor -The [Blazor Rich Text Editor](https://www.syncfusion.com/blazor-components/blazor-wysiwyg-rich-text-editor) component is used to create and edit the content and return valid HTML markup or markdown (MD) of the content. It supports the following two editing formations: +The [Blazor Rich Text Editor](https://www.syncfusion.com/blazor-components/blazor-wysiwyg-rich-text-editor) component allows users to create and edit content, returning valid HTML markup or Markdown (MD). It supports two editing modes: * HTML Editor * Markdown Editor ## HTML editor -Rich Text Editor is a [WYSIWYG Editor](https://www.syncfusion.com/blazor-components/blazor-wysiwyg-rich-text-editor) component for formatting the word content as HTML. The HTML editing mode is the default mode in Rich Text Editor to format the content through the available toolbar items to return the valid HTML markup. Set the `EditorMode` property to `HTML`. +The Rich Text Editor is a [WYSIWYG Editor](https://www.syncfusion.com/blazor-components/blazor-wysiwyg-rich-text-editor) that enables users to format content as HTML. This is the default editing mode, allowing content formatting through toolbar options and returning valid HTML markup. + +To enable HTML mode, set the `EditorMode` property to `HTML`. ```cshtml @@ -41,10 +43,16 @@ Rich Text Editor is a [WYSIWYG Editor](https://www.syncfusion.com/blazor-compone ## Markdown editor -Set the `EditorMode` property to `Markdown` to create or edit the content and apply formatting to view markdown formatted content. The third-party library such as `Marked` or any other library is used to convert markdown into HTML content. +To enable Markdown editing, set the `EditorMode` property to `Markdown`. This mode allows users to create and format content using Markdown syntax. A third-party library such as `Marked` is used to convert Markdown into HTML. + +**Supported Tags:** + +- Headings: `h1`, `h2`, `h3`, `h4`, `h5`, `h6` +- Block elements: `blockquote`, `pre`, `p`, `OL`, `UL` + +**Supported Selection Tags:** -* The Supported Tags are `h6`,`h5`,`h4`,`h3`,`h2`,`h1`,`blockquote`,`pre`,`p`,`OL`,`UL`. -* The Supported Selection Tags are `Bold`, `Italic`, `StrikeThrough`, `InlineCode`, `SubScript`, `SuperScript`, `UpperCase` and `LowerCase`. +- `Bold`, `Italic`, `StrikeThrough`, `InlineCode`, `SubScript`, `SuperScript`, `UpperCase`, `LowerCase` ```cshtml @@ -70,7 +78,7 @@ Set the `EditorMode` property to `Markdown` to create or edit the content and ap For further details on Markdown editing, refer to the [Markdown](./markdown) section. -N> You can also explore our [Blazor Rich Text Editor](https://blazor.syncfusion.com/demos/rich-text-editor/overview?theme=bootstrap5) example to know how to render and configure the rich text editor tools. +N> You can also explore our [Blazor Rich Text Editor](https://blazor.syncfusion.com/demos/rich-text-editor/overview?theme=bootstrap5) demo to learn how to render and configure the editor tools. ## See also diff --git a/blazor/rich-text-editor/enter-key.md b/blazor/rich-text-editor/enter-key.md index baebefaa59..47067a073c 100644 --- a/blazor/rich-text-editor/enter-key.md +++ b/blazor/rich-text-editor/enter-key.md @@ -1,6 +1,6 @@ --- layout: post -title: Enter key customization in RichTextEditor | Syncfusion +title: Enter key customization in Rich Text Editor | Syncfusion description: Checkout and learn here all about the enter key and shift + enter key customization feature in RichTextEditor and more. platform: Blazor control: RichTextEditor @@ -9,13 +9,13 @@ documentation: ug # Enter and Shift-Enter Key Configuration -The Rich Text Editor allows to customize the tag that is inserted when pressing the Enter key and Shift + Enter key in the Rich Text Editor. +The Rich Text Editor allows to customize the tag that is inserted when pressing the Enter key and Shift + Enter key in the in the editor. ## Enter key customization -By default, the `

` tag is created while pressing the Enter key. The Enter key can be customized by using the [EnterKey](https://help.syncfusion.com/cr/blazor/Syncfusion.Blazor.RichTextEditor.SfRichTextEditor.html#Syncfusion_Blazor_RichTextEditor_SfRichTextEditor_EnterKey) property. The [possible tags](https://help.syncfusion.com/cr/blazor/Syncfusion.Blazor.RichTextEditor.EnterKeyTag.html) that can be used to customize the Enter key are `

`, `

`, and `
`. +By default, pressing the Enter key inserts a `

` tag. The Enter key behavior can be customized using the [EnterKey]T(https://help.syncfusion.com/cr/blazor/Syncfusion.Blazor.RichTextEditor.SfRichTextEditor.html#Syncfusion_Blazor_RichTextEditor_SfRichTextEditor_EnterKey) property. The [possible tags](https://help.syncfusion.com/cr/blazor/Syncfusion.Blazor.RichTextEditor.EnterKeyTag.html) are `

`, `

`, and `
`. -When the Enter key is customized with any of the above possible values, pressing the Enter key in the editor will create a new tag that is configured. +When configured, pressing the Enter key inserts the specified tag. N> The **pre** tag will be inserted when code format is applied. If the editor content is inside the **pre** tag, the enter key press will creates `
` tag. Need to press enter key twice to come out of the **pre** tag. @@ -27,15 +27,15 @@ N> The **pre** tag will be inserted when code format is applied. If the editor c {% endhighlight %} {% endtabs %} -![Blazor RichTextEditor enter key confuguration](./images/blazor-richtexteditor-enter-key.png) +![Blazor Rich Text Editor Enter key configuration](./images/blazor-richtexteditor-enter-key.png) N> [View Sample](https://blazor.syncfusion.com/demos/rich-text-editor/enterkeyconfiguration) ## Shift-Enter key customization -By default, the `
` tag is created while pressing the Shift + Enter key. The Shift + Enter key can be customized by using the [ShiftEnterKey](https://help.syncfusion.com/cr/blazor/Syncfusion.Blazor.RichTextEditor.SfRichTextEditor.html#Syncfusion_Blazor_RichTextEditor_SfRichTextEditor_ShiftEnterKey) property. The [possible tags](https://help.syncfusion.com/cr/blazor/Syncfusion.Blazor.RichTextEditor.ShiftEnterKeyTag.html) that can be used to customize the Shift + Enter key are `
`, `

`, and `

`. +By default, pressing Shift + Enter inserts a `
` tag. This behavior can be customized using the [ShiftEnterKey](https://help.syncfusion.com/cr/blazor/Syncfusion.Blazor.RichTextEditor.SfRichTextEditor.html#Syncfusion_Blazor_RichTextEditor_SfRichTextEditor_ShiftEnterKey) property. The [possible tags](https://help.syncfusion.com/cr/blazor/Syncfusion.Blazor.RichTextEditor.ShiftEnterKeyTag.html) are `
`, `

`, and `

`. -When the Shift + Enter key is customized with any of the above possible values, pressing the Shift + Enter key in the editor will create a new tag that is configured. +When configured, pressing Shift + Enter inserts the specified tag. {% tabs %} {% highlight cshtml %} @@ -46,4 +46,4 @@ When the Shift + Enter key is customized with any of the a {% endtabs %} -![Blazor RichTextEditor shift + enter key confuguration](./images/blazor-richtexteditor-shift-enter-key.png) +![Blazor Rich Text Editor Shift+Enter key configuration](./images/blazor-richtexteditor-shift-enter-key.png) \ No newline at end of file From 3afe7642b5026d26fd86e03c2c4f5e3667fe3ff5 Mon Sep 17 00:00:00 2001 From: Bhuvaneshwari-SF4208 <150326492+Bhuvaneshwari-SF4208@users.noreply.github.com> Date: Mon, 22 Sep 2025 09:39:46 +0530 Subject: [PATCH 2/7] Update editor-modes.md --- blazor/rich-text-editor/editor-modes.md | 6 +++--- 1 file changed, 3 insertions(+), 3 deletions(-) diff --git a/blazor/rich-text-editor/editor-modes.md b/blazor/rich-text-editor/editor-modes.md index ad9a7c9600..dba7078bb7 100644 --- a/blazor/rich-text-editor/editor-modes.md +++ b/blazor/rich-text-editor/editor-modes.md @@ -18,7 +18,7 @@ The [Blazor Rich Text Editor](https://www.syncfusion.com/blazor-components/blazo The Rich Text Editor is a [WYSIWYG Editor](https://www.syncfusion.com/blazor-components/blazor-wysiwyg-rich-text-editor) that enables users to format content as HTML. This is the default editing mode, allowing content formatting through toolbar options and returning valid HTML markup. -To enable HTML mode, set the `EditorMode` property to `HTML`. +To enable HTML mode, set the [EditorMode](https://help.syncfusion.com/cr/blazor/Syncfusion.Blazor.RichTextEditor.EditorMode.html) property to `HTML`. ```cshtml @@ -43,7 +43,7 @@ To enable HTML mode, set the `EditorMode` property to `HTML`. ## Markdown editor -To enable Markdown editing, set the `EditorMode` property to `Markdown`. This mode allows users to create and format content using Markdown syntax. A third-party library such as `Marked` is used to convert Markdown into HTML. +To enable Markdown editing, set the [EditorMode](https://help.syncfusion.com/cr/blazor/Syncfusion.Blazor.RichTextEditor.EditorMode.html#Syncfusion_Blazor_RichTextEditor_EditorMode_Markdown) property to `Markdown`. This mode allows users to create and format content using Markdown syntax. A third-party library such as `Marked` is used to convert Markdown into HTML. **Supported Tags:** @@ -82,4 +82,4 @@ N> You can also explore our [Blazor Rich Text Editor](https://blazor.syncfusion. ## See also -* [How to render the iframe](./iframe) \ No newline at end of file +* [How to render the iframe](./iframe) From 43962fd6e448548950ac604a34d741aaf0a69eba Mon Sep 17 00:00:00 2001 From: Bhuvaneshwari-SF4208 <150326492+Bhuvaneshwari-SF4208@users.noreply.github.com> Date: Tue, 30 Sep 2025 09:22:50 +0530 Subject: [PATCH 3/7] Update editor-modes.md --- blazor/rich-text-editor/editor-modes.md | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/blazor/rich-text-editor/editor-modes.md b/blazor/rich-text-editor/editor-modes.md index dba7078bb7..f945ab3998 100644 --- a/blazor/rich-text-editor/editor-modes.md +++ b/blazor/rich-text-editor/editor-modes.md @@ -1,13 +1,13 @@ --- layout: post -title: Editor Modes in Blazor Rich Text Editor | Syncfusion +title: Editor Modes in Blazor Rich Text Editor Component | Syncfusion description: Checkout and learn here all about Editor Modes in Syncfusion Blazor RichTextEditor component and more. platform: Blazor control: RichTextEditor documentation: ug --- -# Editor Modes in Blazor Rich Text Editor +# Editor Modes in Syncfusion Blazor Rich Text Editor The [Blazor Rich Text Editor](https://www.syncfusion.com/blazor-components/blazor-wysiwyg-rich-text-editor) component allows users to create and edit content, returning valid HTML markup or Markdown (MD). It supports two editing modes: From 1c4685e337d1fb1f12bdf82a008d874049d9e458 Mon Sep 17 00:00:00 2001 From: Bhuvaneshwari-SF4208 <150326492+Bhuvaneshwari-SF4208@users.noreply.github.com> Date: Tue, 30 Sep 2025 09:48:09 +0530 Subject: [PATCH 4/7] Update data-binding.md --- blazor/rich-text-editor/data-binding.md | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/blazor/rich-text-editor/data-binding.md b/blazor/rich-text-editor/data-binding.md index c735d80fb8..df370e1886 100644 --- a/blazor/rich-text-editor/data-binding.md +++ b/blazor/rich-text-editor/data-binding.md @@ -1,7 +1,7 @@ --- layout: post title: Data Binding in Blazor RichTextEditor | Syncfusion -description: Learn how to implement data binding in the Syncfusion Blazor Rich Text Editor component and more. +description: Learn how to implement data binding in Syncfusion Blazor Rich Text Editor component and more. platform: Blazor control: RichTextEditor documentation: ug @@ -65,4 +65,4 @@ You can retrieve the editor's content using the [ValueChange](https://help.syncf {% endhighlight %} {% endtabs %} -N> To explore the Rich Text Editor's features, visit the [feature tour page](https://www.syncfusion.com/blazor-components/blazor-rich-text-editor). You can also refer to the [Blazor Rich Text Editor demo](https://blazor.syncfusion.com/demos/rich-text-editor/overview?theme=bootstrap5) to learn how to render and configure the component and its tools. \ No newline at end of file +N> To explore the Rich Text Editor's features, visit the [feature tour page](https://www.syncfusion.com/blazor-components/blazor-rich-text-editor). You can also refer to the [Blazor Rich Text Editor demo](https://blazor.syncfusion.com/demos/rich-text-editor/overview?theme=bootstrap5) to learn how to render and configure the component and its tools. From 19e8724e4d3eaa33e351a7506951abaeada09ec9 Mon Sep 17 00:00:00 2001 From: Bhuvaneshwari-SF4208 <150326492+Bhuvaneshwari-SF4208@users.noreply.github.com> Date: Tue, 30 Sep 2025 09:49:52 +0530 Subject: [PATCH 5/7] Update accessibility.md --- blazor/rich-text-editor/accessibility.md | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/blazor/rich-text-editor/accessibility.md b/blazor/rich-text-editor/accessibility.md index ad7b7d600d..8ca6614d9c 100644 --- a/blazor/rich-text-editor/accessibility.md +++ b/blazor/rich-text-editor/accessibility.md @@ -79,7 +79,7 @@ For a complete list of keyboard shortcuts, refer to the [Keyboard Support](https The Blazor Rich Text Editor component's accessibility is validated using the [axe-core](https://www.npmjs.com/package/axe-core) software tool during automated testing. -The accessibility compliance of the Rich Text Editor component is demonstrated in the following sample. You can open the [sample](https://blazor.syncfusion.com/accessibility/rich-text-editor) in a new window to evaluate the component with accessibility tools. +The accessibility compliance of the Rich Text Editor component is demonstrated in the following sample. Open the [sample](https://blazor.syncfusion.com/accessibility/rich-text-editor) in a new window to evaluate the component with accessibility tools. ### Custom key configuration @@ -99,4 +99,4 @@ N> You can explore the [Blazor Rich Text Editor feature tour page](https://www.s ## See also -* [Accessibility in Syncfusion® Blazor components](../common/accessibility) \ No newline at end of file +* [Accessibility in Syncfusion® Blazor components](../common/accessibility) From b56262470d7d4bf3d63ab073b8032abc32042a43 Mon Sep 17 00:00:00 2001 From: Bhuvaneshwari-SF4208 <150326492+Bhuvaneshwari-SF4208@users.noreply.github.com> Date: Tue, 30 Sep 2025 10:56:19 +0530 Subject: [PATCH 6/7] Update accessibility.md --- blazor/rich-text-editor/accessibility.md | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/blazor/rich-text-editor/accessibility.md b/blazor/rich-text-editor/accessibility.md index 8ca6614d9c..9822b33d0c 100644 --- a/blazor/rich-text-editor/accessibility.md +++ b/blazor/rich-text-editor/accessibility.md @@ -77,7 +77,7 @@ For a complete list of keyboard shortcuts, refer to the [Keyboard Support](https ## Ensuring accessibility -The Blazor Rich Text Editor component's accessibility is validated using the [axe-core](https://www.npmjs.com/package/axe-core) software tool during automated testing. +The Blazor Rich Text Editor component's accessibility is validated using the [axe-core](https://www.npmjs.com/package/axe-core/) software tool during automated testing. The accessibility compliance of the Rich Text Editor component is demonstrated in the following sample. Open the [sample](https://blazor.syncfusion.com/accessibility/rich-text-editor) in a new window to evaluate the component with accessibility tools. From 0622596b42ff2cc552307ad690aadbed8744990c Mon Sep 17 00:00:00 2001 From: Bhuvaneshwari-SF4208 <150326492+Bhuvaneshwari-SF4208@users.noreply.github.com> Date: Tue, 30 Sep 2025 10:58:43 +0530 Subject: [PATCH 7/7] Update data-binding.md --- blazor/rich-text-editor/data-binding.md | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/blazor/rich-text-editor/data-binding.md b/blazor/rich-text-editor/data-binding.md index df370e1886..5f46fa9253 100644 --- a/blazor/rich-text-editor/data-binding.md +++ b/blazor/rich-text-editor/data-binding.md @@ -1,7 +1,7 @@ --- layout: post title: Data Binding in Blazor RichTextEditor | Syncfusion -description: Learn how to implement data binding in Syncfusion Blazor Rich Text Editor component and more. +description: Checkout and learn here all about data binding in Syncfusion Blazor Rich Text Editor component and more. platform: Blazor control: RichTextEditor documentation: ug