Globalization with JavaScript Rich Text Editor

Localization

The Rich Text Editor offers an option to localize its strings using the locale API, allowing adaptation to a specific local language. By default, the editor uses US English (en-US). Below is a table listing the keys and their corresponding values for the default language (en-US).

'en-US': {
    'richtexteditor': {
        'alignments': "Alignments",
        'justifyLeft': "Align Left",
        'justifyCenter': "Align Center",
        'justifyRight': "Align Right",
        'justifyFull': "Align Justify",
        'fontName': "Font Name",
        'fontSize': "Font Size",
        'fontColor': "Font Color",
        'backgroundColor': "Background Color",
        'bold': "Bold",
        'italic': "Italic",
        'underline': "Underline",
        'strikethrough': "Strikethrough",
        'clearFormat': "Clear Format",
        'clearAll': "Clear All",
        'cut': "Cut",
        'copy': "Copy",
        'paste': "Paste",
        'unorderedList': "Bulleted List",
        'orderedList': "Numbered List",
        'indent': "Increase Indent",
        'outdent': "Decrease Indent",
        'undo': "Undo",
        'redo': "Redo",
        'superscript': "Superscript",
        'subscript': "Subscript",
        'createLink': "Insert Link",
        'openLink': "Open Link",
        'editLink': "Edit Link",
        'removeLink': "Remove Link",
        'image': "Insert Image",
        'audio': "Insert Audio",
        'video': "Insert Video",
        'replace': "Replace",
        'numberFormatList': "Number Format List",
        'bulletFormatList': "Bullet Format List",
        'audioReplace': "Replace",
        'videoReplace': "Replace",
        'videoAlign': "Align",
        'videoDimension': "Dimension",
        'audioRemove': "Remove",
        'videoRemove': "Remove",
        'audioLayoutOption': "Layout option",
        'videoLayoutOption': "Layout option",
        'align': "Align",
        'caption': "Caption",
        'remove': "Remove",
        'insertLink': "Insert Link",
        'display': "Display",
        'altText': "Alternative Text",
        'dimension': "Change Size",
        'fullscreen': "Maximize",
        'maximize': "Maximize",
        'minimize': "Minimize",
        'lowerCase': "Lower Case",
        'upperCase': "Upper Case",
        'print': "Print",
        'formats': "Formats",
        'sourcecode': "Code View",
        'preview': "Preview",
        'viewside': "ViewSide",
        'insertCode': "Insert Code",
        'blockquote': "Blockquote",
        'linkText': "Display Text",
        'linkTooltipLabel': "Title",
        'linkWebUrl': "Web Address",
        'linkTitle': "Enter a title",
        'linkurl': "http://example.com",
        'linkOpenInNewWindow': "Open Link in New Window",
        'linkHeader': "Insert Link",
        'dialogInsert': "Insert",
        'dialogCancel': "Cancel",
        'dialogUpdate': "Update",
        'imageHeader': "Insert Image",
        'audioHeader': "Insert Audio",
        'videoHeader': "Insert Video",
        'imageLinkHeader': "You can also provide a link from the web",
        'audioLinkHeader': "You can also provide a link from the web",
        'videoLinkHeader': "Web URL",
        'embedVideoLinkHeader': "Media Embed URL",
        'mdimageLink': "Please provide a URL for your image",
        'imageUploadMessage': "Drop image here or browse to upload",
        'audioUploadMessage': "Drop an audio file or browse to upload",
        'videoUploadMessage': "Drop a video file or browse to upload",
        'imageDeviceUploadMessage': "Click here to upload",
        'audioDeviceUploadMessage': "Click here to upload",
        'videoDeviceUploadMessage': "Click here to upload",
        'imageAlternateText': "Alternate Text",
        'alternateHeader': "Alternative Text",
        'browse': "Browse",
        'imageUrl': "http://example.com/image.png",
        'audioUrl': "https://example.com/audio.mp3",
        'videoUrl': "https://example.com/video.mp4",
        'webUrl': "Web URL",
        'embedUrl': "Embed Code",
        'imageCaption': "Caption",
        'imageSizeHeader': "Image Size",
        'videoSizeHeader': "Video Size",
        'imageHeight': "Height",
        'imageWidth': "Width",
        'videoHeight': "Height",
        'videoWidth': "Width",
        'textPlaceholder': "Enter Text",
        'inserttablebtn': "Insert Table",
        'tabledialogHeader': "Insert Table",
        'tableWidth': "Width",
        'cellpadding': "Cell Padding",
        'cellspacing': "Cell Spacing",
        'columns': "Number of columns",
        'rows': "Number of rows",
        'tableRows': "Row",
        'tableColumns': "Column",
        'tableCellHorizontalAlign': "Table Cell Horizontal Align",
        'tableCellVerticalAlign': "Table Cell Vertical Align",
        'createTable': "Create Table",
        'removeTable': "Remove Table",
        'tableHeader': "Header Row",
        'tableRemove': "Delete Table",
        'tableCellBackground': "Table Cell Background",
        'tableEditProperties': "Table Edit Properties",
        'styles': "Styles",
        'insertColumnLeft': "Insert Column Left",
        'insertColumnRight': "Insert Column Right",
        'deleteColumn': "Delete Column",
        'insertRowBefore': "Insert Row Before",
        'insertRowAfter': "Insert Row After",
        'deleteRow': "Delete Row",
        'tableEditHeader': "Edit Table",
        'TableHeadingText': "Heading",
        'TableColText': "Col",
        'imageInsertLinkHeader': "Insert Link",
        'editImageHeader': "Edit Image",
        'editAudioHeader': "Edit Audio",
        'editVideoHeader': "Edit Video",
        'alignmentsDropDownLeft': "Align Left",
        'alignmentsDropDownCenter': "Align Center",
        'alignmentsDropDownRight': "Align Right",
        'alignmentsDropDownJustify': "Align Justify",
        'imageDisplayDropDownInline': "Inline",
        'imageDisplayDropDownBreak': "Break",
        'tableInsertRowDropDownBefore': "Insert row before",
        'tableInsertRowDropDownAfter': "Insert row after",
        'tableInsertRowDropDownDelete': "Delete row",
        'tableInsertColumnDropDownLeft': "Insert column left",
        'tableInsertColumnDropDownRight': "Insert column right",
        'tableInsertColumnDropDownDelete': "Delete column",
        'tableVerticalAlignDropDownTop': "Align Top",
        'tableVerticalAlignDropDownMiddle': "Align Middle",
        'tableVerticalAlignDropDownBottom': "Align Bottom",
        'tableStylesDropDownDashedBorder': "Dashed Borders",
        'tableStylesDropDownAlternateRows': "Alternate Rows",
        'pasteFormat': "Paste Format",
        'pasteFormatContent': "Choose the formatting action",
        'plainText': "Plain Text",
        'cleanFormat': "Clean",
        'keepFormat': "Keep",
        'pasteDialogOk': "OK",
        'pasteDialogCancel': "Cancel",
        'fileManager': "File Manager",
        'fileDialogHeader': "File Browser",
        'formatsDropDownParagraph': "Paragraph",
        'formatsDropDownCode': "Code",
        'formatsDropDownQuotation': "Blockquote",
        'formatsDropDownHeading1': "Heading 1",
        'formatsDropDownHeading2': "Heading 2",
        'formatsDropDownHeading3': "Heading 3",
        'formatsDropDownHeading4': "Heading 4",
        'fontNameSegoeUI': "Segoe UI",
        'fontNameArial': "Arial",
        'fontNameGeorgia': "Georgia",
        'fontNameImpact': "Impact",
        'fontNameTahoma': "Tahoma",
        'fontNameTimesNewRoman': "Times New Roman",
        'fontNameVerdana': "Verdana",
        'numberFormatListNumber': "Number",
        'numberFormatListLowerAlpha': "LowerAlpha",
        'numberFormatListUpperAlpha': "UpperAlpha",
        'numberFormatListLowerRoman': "LowerRoman",
        'numberFormatListUpperRoman': "UpperRoman",
        'numberFormatListLowerGreek': "LowerGreek",
        'bulletFormatListDisc': "Disc",
        'bulletFormatListCircle': "Circle",
        'bulletFormatListSquare': "Square",
        'numberFormatListNone': "None",
        'bulletFormatListNone':"None",
        'formatPainter': "Format Painter",
        'emojiPicker': "Emoji Picker",
        'embeddedCode': "Embedded Code",
        'pasteEmbeddedCodeHere': "Paste Embedded Code here",
        'emojiPickerTypeToFind': "Type to find",
        'emojiPickerNoResultFound': "No results found",
        'emojiPickerTrySomethingElse': "Try something else",
        'linkAriaLabel': "Open in new window",
        'unsupportedImage': "Unsupported file format",
        'mergecells': "Merge cells",
        'verticalsplit': "Vertical split",
        'horizontalsplit': "Horizontal split",
        'slashMenuItemHeadingOneText': "Heading 1",
        'slashMenuItemHeadingOneDescription': "Use this for a top level heading or title.",
        'slashMenuItemHeadingTwoText': "Heading 2",
        'slashMenuItemHeadingTwoDescription': "Use this for key sections.",
        'slashMenuItemHeadingThreeText': "Heading 3",
        'slashMenuItemHeadingThreeDescription': "Use this for sub sections and group headings.",
        'slashMenuItemHeadingFourText': "Heading 4",
        'slashMenuItemHeadingFourDescription': "Use this for the key points of the sub topics.",
        'slashMenuItemParagraphText': "Paragraph",
        'slashMenuItemParagraphDescription': "Writing with paragraphs.",
        'slashMenuItemBlockquoteText': "Blockquote",
        'slashMenuItemBlockquoteDescription': "Create a quote or citation.",
        'slashMenuItemOrderedListText': "Ordered List",
        'slashMenuItemOrderedListDescription': "Create an ordered list.",
        'slashMenuItemUnorderedListText': "Unordered List",
        'slashMenuItemUnorderedListDescription': "Create an unordered list.",
        'slashMenuItemCodeText': "CodeBlock",
        'slashMenuItemCodeDescription': "Create a preformatted code block.",
        'slashMenuItemTableText': "Table",
        'slashMenuItemTableDescription': "Insert a table.",
        'slashMenuItemLinkText': "Link",
        'slashMenuItemLinkDescription': "Insert a link.",
        'slashMenuItemImageText': "Image",
        'slashMenuItemImageDescription': "Insert an image.",
        'slashMenuItemAudioText': "Audio",
        'slashMenuItemAudioDescription': "Insert an audio.",
        'slashMenuItemVideoText': "Video",
        'slashMenuItemVideoDescription': "Insert a video.",
        'slashMenuItemEmojiText': "Emojipicker",
        'slashMenuItemEmojiDescription': "Use emojis to express ideas and emoticons.",
    }
}

To localize the editor’s strings with your own localization, copy the default language information and localize the strings in the values column. For example, to localize the editor in German (“de-DE”).

'de-DE': {
    'richtexteditor': {
        'alignments': "Ausrichtungen",
        'justifyLeft': "Linksbündig",
        'justifyCenter': "Zentriert",
        'justifyRight': "Rechts ausrichten",
        'justifyFull': "Justify ausrichten",
        'fontName': "Schriftartenname",
        'fontSize': "Schriftgrösse",
        'fontColor': "Schriftfarbe",
        'backgroundColor': "Hintergrundfarbe",
        'bold': "Fett gedruckt",
        'italic': "Kursiv",
        'underline': "Unterstreichen",
        'strikethrough': "Durchgestrichen",
        'clearFormat': "Format löschen",
        'clearAll': "Alles löschen",
        'cut': "Ausschneiden",
        'copy': "Kopieren",
        'paste': "Einfügen",
        'unorderedList': "Aufzählung",
        'orderedList': "Nummerierte Liste",
        'indent': "Einzug vergrössern",
        'outdent': "Einzug verringern",
        'undo': "Rückgängig machen",
        'redo': "Wiederholen",
        'superscript': "Hochgestellt",
        'subscript': "Tiefgestellt",
        'createLink': "Hyperlink einfügen",
        'openLink': "Verbindung öffnen",
        'editLink': "Link bearbeiten",
        'removeLink': "Link entfernen",
        'image': "Bild einfügen",
        'replace': "Ersetzen",
        'numberFormatList': "Liste der Zahlenformate",
        'bulletFormatList': "Liste der Aufzählungsformate",
        'audioReplace': "Ersetzen",
        'videoReplace': "Ersetzen",
        'videoAlign': "Ausrichten",
        'videoDimension': "Abmessungen",
        'audioRemove': "Entfernen",
        'videoRemove': "Entfernen",
        'audioLayoutOption': "Layout-Option",
        'videoLayoutOption': "Layout-Option",
        'align': "Ausrichten",
        'caption': "Bildbeschreibung",
        'remove': "Entfernen",
        'insertLink': "Link einfügen",
        'display': "Anzeige",
        'altText': "alternativer Text",
        'dimension': "Grösse ändern",
        'fullscreen': "Maximieren",
        'maximize': "Maximieren",
        'minimize': "Minimieren",
        'lowerCase': "Kleinbuchstaben",
        'upperCase': "Grossbuchstaben",
        'print': "Drucken",
        'formats': "Formate",
        'sourcecode': "Code-Ansicht",
        'preview': "Vorschau",
        'viewside': "ViewSide",
        'insertCode': "Code eingeben",
        'linkText': "Text anzeigen",
        'linkTooltipLabel': "Titel",
        'linkWebUrl': "Webadresse",
        'linkTitle': "Geben Sie einen Titel ein",
        'linkurl': "https://example.com",
        'linkOpenInNewWindow': "Link in neuem Fenster öffnen",
        'linkHeader': "Link einfügen",
        'dialogInsert': "Einfügen",
        'dialogCancel': "Abbrechen",
        'dialogUpdate': "Aktualisieren",
        'imageHeader': "Bild einfügen",
        'audioHeader': "Audio einfügen",
        'videoHeader': "Video einfügen",
        'imageLinkHeader': "Sie können auch einen Link aus dem Internet bereitstellen",
        'audioLinkHeader': "Sie können auch einen Link aus dem Internet bereitstellen",
        'videoLinkHeader': "Web-URL",
        'embedVideoLinkHeader': "Medieneinbettungs-URL",
        'mdimageLink': "Bitte geben Sie eine URL für Ihr Bild an",
        'imageUploadMessage': "Legen Sie das Bild hier ab oder durchsuchen Sie es, um es hochzuladen",
        'audioUploadMessage': "Legen Sie eine Audiodatei ab oder navigieren Sie zum Hochladen",
        'videoUploadMessage': "Legen Sie eine Videodatei ab oder navigieren Sie zum Hochladen",
        'imageDeviceUploadMessage': "Klicken Sie hier zum Hochladen",
        'audioDeviceUploadMessage': "Klicken Sie hier, um es hochzuladen",
        'videoDeviceUploadMessage': "Klicken Sie hier, um es hochzuladen",
        'imageAlternateText': "Alternativer Text",
        'alternateHeader': "alternativer Text",
        'browse': "Durchsuche",
        'imageUrl': "https://example.com/image.png",
        'audioUrl': "https://example.com/audio.mp3",
        'videoUrl': "https://example.com/video.mp4",
        'webUrl': "Web-URL",
        'embedUrl': "Code einbetten",
        'imageCaption': "Untertitel",
        'imageSizeHeader': "Bildgrösse",
        'imageHeight': "Höhe",
        'imageWidth': "Breite",
        'videoHeight': "Höhe",
        'videoWidth': "Breite",
        'textPlaceholder': "Text eingeben",
        'inserttablebtn': "Tabelle einfügen",
        'tabledialogHeader': "Tabelle einfügen",
        'tableWidth': "Breite",
        'cellpadding': "Zellauffüllung",
        'cellspacing': "Zellenabstand",
        'columns': "Anzahl der Spalten",
        'rows': "Zeilenanzahl",
        'tableRows': "Reihe",
        'tableColumns': "Spalte",
        'tableCellHorizontalAlign': "Horizontale Ausrichtung der Tabellenzelle",
        'tableCellVerticalAlign': "Tabelle vertikal ausrichten",
        'createTable': "Tabelle erstellen",
        'removeTable': "Tabelle entfernen",
        'tableHeader': "Kopfzeile",
        'tableRemove': "Tabelle löschen",
        'tableCellBackgroun': "Tabellenzellenhintergrund",
        'tableEditProperties': "Tabelle Eigenschaften bearbeiten",
        'styles': "Stile",
        'insertColumnLeft': "Spalte links einfügen",
        'insertColumnRight': "Spalte rechts einfügen",
        'deleteColumn': "Spalte löschen",
        'insertRowBefore': "Zeile davor einfügen",
        'insertRowAfter': "Zeile danach einfügen",
        'deleteRow': "Zeile löschen",
        'tableEditHeader': "Tabelle bearbeiten",
        'TableHeadingText': "Überschrift",
        'TableColText': "Col",
        'imageInsertLinkHeader': "Link einfügen",
        'editImageHeader': "Bild bearbeiten",
        'alignmentsDropDownLeft': "Linksbündig",
        'alignmentsDropDownCenter': "Zentriert",
        'alignmentsDropDownRight': "Rechts ausrichten",
        'alignmentsDropDownJustify': "Justify ausrichten",
        'imageDisplayDropDownInline': "In der Reihe",
        'imageDisplayDropDownBreak': "Brechen",
        'audioLayoutOptionDropDownInline': "Im Einklang",
        'audioLayoutOptionDropDownBreak': "Brechen",
        'videoLayoutOptionDropDownInline': "Im Einklang",
        'videoLayoutOptionDropDownBreak': "Brechen",
        'tableInsertRowDropDownBefore': "Zeile davor einfügen",
        'tableInsertRowDropDownAfter': "Zeile danach einfügen",
        'tableInsertRowDropDownDelete': "Zeile löschen",
        'tableInsertColumnDropDownLeft': "Spalte links einfügen",
        'tableInsertColumnDropDownRight': "Spalte rechts einfügen",
        'tableInsertColumnDropDownDelete': "Spalte löschen",
        'tableVerticalAlignDropDownTop': "Oben ausrichten",
        'tableVerticalAlignDropDownMiddle': "Mitte ausrichten",
        'tableVerticalAlignDropDownBottom': "Unten ausrichten",
        'tableStylesDropDownDashedBorder': "Gestrichelte Grenzen",
        'tableStylesDropDownAlternateRows': "Alternative Zeilen",
        'pasteFormat': "Format einfügen",
        'pasteFormatContent': "Wählen Sie die Formatierungsaktion",
        'plainText': "Einfacher Text",
        'cleanFormat': "Sauber",
        'keepFormat': "Behalten",
        'pasteDialogOk': "in Ordnung",
        'pasteDialogCancel': "Stornieren",
        'fileManager': "Dateimanager",
        'fileDialogHeader': "Dateibrowser",
        'formatsDropDownParagraph': "Absatz",
        'formatsDropDownCode': "Code",
        'formatsDropDownQuotation': "Zitat",
        'formatsDropDownHeading1': "Überschrift 1",
        'formatsDropDownHeading2': "Überschrift 2",
        'formatsDropDownHeading3': "Überschrift 3",
        'formatsDropDownHeading4': "Überschrift 4",
        'fontNameSegoeUI': "SegoeUI",
        'fontNameArial': "Arial",
        'fontNameGeorgia': "Georgia",
        'fontNameImpact': "Impact",
        'fontNameTahoma': "Tahoma",
        'fontNameTimesNewRoman': "Times New Roman",
        'fontNameVerdana': "Verdana",
        'formatsOLListNumber': "Nummer",
        'formatsOLListLowerAlpha': "LowerAlpha",
        'formatsOLListUpperAlpha': "OberAlpha",
        'formatsOLListLowerRoman': "Niederroman",
        'formatsOLListUpperRoman': "Oberrömisch",
        'formatsOLListLowerGreek': "Niedergriechisch",
        'formatsULListDisc': "Rabatt",
        'formatsULListCircle': "Kreis",
        'formatsULListSquare': "Quadrat",
        'formatsOLListNone': "Keiner",
        'formatsULListNone': "Keiner",
        'formatPainter': "Format Maler",
        'emojiPicker': "Emoji-Picker",
        'embeddedCode': "Eingebetteter Code",
        'pasteEmbeddedCodeHere': "Fügen Sie hier eingebetteten Code ein",
        'emojiPickerTypeToFind': "Geben Sie „Suchen“ ein",
        'emojiPickerNoResultFound': "keine Ergebnisse gefunden",
        'emojiPickerTrySomethingElse': "Versuchen Sie etwas anderes",
        'linkAriaLabel': "In einem neuen Fenster öffnen",
        'imageLinkAriaLabel': "In einem neuen Fenster öffnen",
        'unsupportedImage': "Nicht unterstütztes Dateiformat",
        'mergecells': "Zellen verbinden",
        'verticalsplit': "Vertikale Aufteilung",
        'horizontalsplit': "Horizontale Aufteilung",
        'numberFormatListLowerAlpha': "Unteres Alpha",
        'numberFormatListUpperAlpha': "Oberes Alpha",
        'numberFormatListLowerRoman': "Niederrömisch",
        'numberFormatListUpperRoman': "Oberrömisch",
        'numberFormatListLowerGreek': "Niedergriechisch",
        'slashMenuItemHeadingOneText': "Überschrift 1",
        'slashMenuItemHeadingOneDescription': "Verwenden Sie dies für eine Überschrift oder einen Titel der obersten Ebene.",
        'slashMenuItemHeadingTwoText': "Überschrift 2",
        'slashMenuItemHeadingTwoDescription': "Verwenden Sie dies für Schlüsselabschnitte.",
        'slashMenuItemHeadingThreeText': "Überschrift 3",
        'slashMenuItemHeadingThreeDescription': "Verwenden Sie dies für Unterabschnitte und Gruppenüberschriften.",
        'slashMenuItemHeadingFourText': "Überschrift 4",
        'slashMenuItemHeadingFourDescription': "Nutzen Sie dies für die Kernaussagen der Unterthemen.",
        'slashMenuItemParagraphText': "Absatz",
        'slashMenuItemParagraphDescription': "Schreiben mit Absätzen.",
        'slashMenuItemBlockquoteText': "Blockzitat",
        'slashMenuItemBlockquoteDescription': "Erstellen Sie ein Zitat oder Zitat.",
        'slashMenuItemOrderedListText': "Geordnete Liste",
        'slashMenuItemOrderedListDescription': "Erstellen Sie eine geordnete Liste.",
        'slashMenuItemUnorderedListText': "Ungeordnete Liste",
        'slashMenuItemUnorderedListDescription': "Erstellen Sie eine ungeordnete Liste.",
        'slashMenuItemCodeText': "Codeblöcke",
        'slashMenuItemCodeDescription': "Erstellen Sie einen vorformatierten Codeblock.",
        'slashMenuItemTableText': "Tisch",
        'slashMenuItemTableDescription': "Fügen Sie eine Tabelle ein.",
        'slashMenuItemLinkText': "Link",
        'slashMenuItemLinkDescription': "Fügen Sie einen Link ein.",
        'slashMenuItemImageText': "Bild",
        'slashMenuItemImageDescription': "Fügen Sie ein Bild ein.",
        'slashMenuItemAudioText': "Audio",
        'slashMenuItemAudioDescription': "Fügen Sie ein Audio ein.",
        'slashMenuItemVideoText': "Video",
        'slashMenuItemVideoDescription': "Fügen Sie ein Video ein.",
        'slashMenuItemEmojiText': "Emojiauswieler",
        'slashMenuItemEmojiDescription': "Verwenden Sie Emojis, um Ideen und Emoticons auszudrücken.",
        }
    },

The sample below demonstrates the Rich Text Editor component rendered in German (“de-DE”) using the locale property.

Enable Right-to-Left (RTL) mode

The enableRtl property specifies the direction of the Rich Text Editor component. This property can be enabled for writing systems that require right-to-left direction, such as Arabic and Hebrew.

When RTL (right-to-left) support is enabled, the e-rtl class will be added to the root element. Customizations can be made based on this class. Use the following CSS to customize the Rich Text Editor in RTL (right-to-left) mode.

.e-richtexteditor .e-rtl {
    background-color: antiquewhite;
}

This direction does not change based on the locale property.