WYSIWYG editor

The WYSIWYG (what you see is what you get) editor is the primary tool for creating content in your digital workplace. Using this tool, you can create and format text, add images, embed videos, and use HTML code throughout your digital workplace. 

Sections in this article:

Where it's used

The WYSIWYG editor is a tool that everyone in your digital workplace will use at some point. The following actions require the editor:

  • Creating content on Channels within the digital workplace
  • Posting Comments and Replies
  • Editing the digital workplace's Footer
  • Populating the HTML Widget
  • Editing a Space's Header and Footer

WYSIWYG tools

The WYSIWYG editor uses either a full toolbar that contains all editing tools, or a compact toolbar that contains a subset of editing tools. You will encounter the full toolbar when creating content and the compact toolbar when replying to content or creating microblog posts. When working on long articles, the toolbar will snap to the top of the editor window as you scroll down the page. 

Not all available tools are displayed at the same time. Select the following to display a secondary toolbar with additional tools specific to that tool type:

  • More Text Options
  • More Paragraph Options
  • More Rich Text Options
  •  More Misc
Action Shortcut Compact Toolbar Usage
Bold
 Ctrl + B
✔

Bold the selected text. If no text is selected, any subsequently entered text will be bold.
Italic
 Ctrl + I
✔

Italicize the selected text. If no text is selected, any subsequently entered text will be italic.

Underline

 Ctrl + U
✔

Underline the selected text. If no text is selected, any subsequently entered text will be underlined.

Font Size

 — ✔

Change the font size of the selected text. If no text is selected, any subsequently entered text will use the selected font size.

Available font sizes range from 8px  to 48px.

Text Color

 — ✔

Change the text color of the selected text. If no text is selected, any subsequently entered text will use the selected color.

Select from up to 42 pre-configured colors (27 default and 15 custom), or enter a valid hex color code.

Select the Clear Formatting option from the color swatch to revert to the default text color (typically black).

Clear Formatting

 — ✖

Remove all text styles from the selected text. If no text is selected, all styles will be toggled off.

More Text Options

 — ✖ Select to view additional options.
Strikethrough
 Ctrl + S
✖

Cross out the selected text. If no text is selected, any subsequently entered text will have a line through it.

Subscript

 — ✖ Shrink and lower the selected text below the normal text line. If no text is selected, any subsequently entered text will be subscript.

Superscript

 — ✖ Shrink and raise the selected text below the normal text line. If no text is selected, any subsequently entered text will be superscript.

Background Color

 — ✖

Change the background color of the selected text. If no text is selected, any subsequently entered text will use the selected background color.

Select from up to 42 pre-configured colors (27 default and 15 custom), or enter a valid hex color code.

Select the Clear Formatting option from the color swatch to revert to the default background color(typically black).
Text tools

 

Action Shortcut Compact Toolbar Usage
Paragraph Format
Ctrl + P
✖

Apply a paragraph style to the selected text. If no text is selected, any subsequently entered text will use the selected style.

Paragraph styles include:

  • Normal,
  • Heading 1
  • Heading 2
  • Heading 3
  • Heading 4
  • Code
Align Left
 — ✖

Align the selected text to the left side of the editor. If no text is selected, any subsequently entered text will be left-aligned. 
Align Center
 — ✖ Align the selected text to the horizontal center of the editor. If no text is selected, any subsequently entered text will be center-aligned.
Align Right
 — ✖ Align the selected text to the left side of the editor. If no text is selected, any subsequently entered text will be left-aligned. 
Align Justify
 — ✖ Add spacing between the words of the selected text so that the edges of each line are aligned with the left and right margins. If no text is selected, any subsequently entered text will be justified. 
Ordered List
 — ✔

Create a numbered list out of the selected text. If no text is selected, any subsequently entered text will be bulleted.

Pressing enter once creates a new bullet while pressing enter twice turns off this style.

Select the dropdown menu for additional appearance options. Available options include:

  • Default
  • Lower Alpha
  • Lower Greek
  • Lower Roman
  • Upper Alpha
  • Upper Roman
Unordered List
 — ✔

Create a bulleted list out of the selected text. If no text is selected, any subsequently entered text will be bulleted.

Pressing enter once creates a new bullet while pressing enter twice turns off this style.

Select the dropdown menu for additional appearance options. Available options include:

  • Default
  • Circle
  • Disc
  • Square

Line Height / Line Spacing

 — ✖

Change the height of each line in the selected text. If no text is selected, any subsequently entered text will have the selected value.

Height options include:

  • Default
  • Single
  • 1.15
  • 1.5
  • Double
Increase Indent
 Ctrl + ] ✖ Shift the selected text 20px to the right. If no text is selected, any subsequently entered text will be indented.
Decrease Indent
 Ctrl + [ ✖ Shift the selected text 20px to the left. If no text is selected, any subsequently entered text will be less indented.
More Paragraph Options
 — ✖ Select to view additional options.
Paragraph tools

 

Action Shortcut Compact Toolbar
Usage
Insert Table
 — ✖ Insert a table into the editor. 

Insert Link

 Ctrl + K ✔

Insert a link into the editor.

Insert Image

 Ctrl + P ✔

Insert an image into the editor. 

Not available in Broadcasts.
Embed URL
 — ✖ Insert graphical links from popular content providers. Links added this way are presented in the editor as graphical cards. For more information about which providers are supported, see Providers.
Igloo_WYSIWYGEditor_InsertGiphyIconSmall.svg
GIPHY
 — ✔ Insert a gif into the editor. The provided window gives the ability to search and select appropriate gifs from GIPHY. The GIPHY function can be enabled/disabled by Workplace and Enterprise Administrators from the Global Settings page.

Not available in Broadcasts.
Insert Video
 — ✔

Insert a video into the editor.

Not available in Broadcasts.
Emoticons
 — ✔ Insert emoticons into the editor. Emoticons are grouped into the following categories: Smileys & People, Animals & Nature, Food & Drink,  Activities, Travel & Places, Objects, Symbols, and flags.

Not available in Broadcasts.
Special Characters
 — ✖ Insert special characters into the editor. Select from the provided groupings: Latin, Greek, Cyrillic, Punctuation, Currency, Arrows, Math, and Misc.
Insert Horizontal Line
 — ✖ Insert a horizontal line that spans the entire width of the WYSIWYG editor.
More Rich Text Options
 —
✖
 Select to view additional options.
Rich text tools

 

Action Shortcut Compact Toolbar Usage
Undo
Ctrl + Z
✖

Remove the most recent change made within the editor. This action can be performed multiple times.

Note: This option will only affect changes made during the current editing session.

Redo
Ctrl + Y
✖

Reapply the most recent change made within the editor. This action can be performed multiple times.

Note: This option will only affect changes made during the current editing session.
Fullscreen
—
✔
 Expand the editor to take up the entire browser window. Selecting this tool again will return the editor to its normal size.
Code View
—
✔
 View the editor's content in raw HTML. While in this view, you can only work with the HTML code of the content. To return to the normal editor view, select the Code View tool again.

More general options
—
✔
 Select to view additional options.
General tools

Actions and workflows

Common actions and workflows include:

Additional keyboard shortcuts

Shortcut Usage
Ctrl + C
Copies the selection to the clipboard.
Ctrl + X Cuts the selection from the editor to the clipboard.
Ctrl + V Pastes the clipboard content into the editor.
Ctrl + A Select all content in the editor.
Shortcuts