Text Editing in Sitecore

RTE WYSIWYG Editor

The WYSIWYG (What You See is What You Get) text editor used globally across multiple Sitecore components.


Accessing the Editor

The global Rich Text Editor can be found in multiple Sitecore components and is accessed from the modal window used for editing content by clicking the Show Editor link.

 


Editor Interface

The Rich Text Editor includes many familiar text formatting tools as well as helpful information such as the active HTML tag, word count, and character count.

Editing Buttons

The rich text editing tools are grouped into related groups of buttons:

 

Text Formatting

  • Bold

  • Italic

  • Underline

  • Strikethrough

 

Paragraph Formatting

  • Bulleted List (Unordered List)

  • Ordered List

  • Indent

  • Outdent

 

Links

  • Insert Link

  • Hyperlink Manager

  • Remove Link

 

Special Characters

  • Subscript

  • Superscript


Paragraph Styles

Common styles have been made accessible through the Paragraph Styles dropdown. Simply place your cursor into the paragraph you want to format and select a style from the dropdown to apply it.

  • Paragraph - The default “normal” text style. Wraps text in a P tag.

  • Heading 3 - Intended for headlines. Wraps text in an H3 tag.

  • Heading 4 - Intended for headlines. Wraps text in an H4 tag.

  • Blockquote: Default - Intended to make direct quotes stand out on the page.

  • Blockquote: Alert - Intended to make time sensitive information stand out on the page.

  • Blockquote: Info - Intended to make important information stand out on the page.

Tip: These styles are non-destructive so, if you have selected the wrong one by accident, just select a different style or use the Undo button.


Apply CSS Class

Custom Cascading Style Sheet (CSS) classes to help format your text.

 

 

  • Clear Class - Removes all classes and returns the text back to normal.

  • Button Style: 01 - Only works on links. Styles a link as a solid button.

  • Button Style: 02 - Only works on links. Styles a link as an outlined button.

  • Bulleted List: Float - Only works on bulleted lists. Floats half of a bulleted list in a second column.

  • Highlight Text - Adds a highlight color behind selected text.


HTML Tag Inspector

An HTML tag inspector is provided in the bottom left of the editor. Dynamically changing based on the location of your cursor, this tool displays all HTML tags in use on the text. (If no text is selected, no tags will be displayed.)

This is an interactive tool that not only does this give you relevant information but allows you to select a tag or remove it.

  • Clicking on an element (displayed in black text) will select all the text controlled by that HTML tag.

  • Clicking on RemoveElement (displayed in red text) will remove HTML tags one-by-one.


Was this helpful? We welcome feedback for this Sitecore documentation: Take the User Survey