Plans supporting the use of Advanced WYSIWYG editor

The 'Advanced WYSIWYG editor' combines lightweight design with powerful, rich text editing capabilities, supporting specific Markdown syntax. It offers a highly visual and intuitive experience that surpasses traditional Markdown editors, yet maintains more flexibility than the WYSIWYG editors.

NOTE

You can seamlessly switch between the Advanced WYSIWYG editor and the WYSIWYG editor when the article is in the Draft/New state. Document360 does not support this switching when the article is in the Published state.

CAUTION

The articles switched from the Markdown editor to the Advanced WYSIWYG editor cannot be reverted to the Markdown editor again.

Using Advanced WYSIWYG editor

You can use the slash commands, toolbars, and specific Markdown syntax to create and edit content in the Advanced WYSIWYG editor.

Slash commands

Type / in the editor, and a list of options appears. You can also search for the options by typing the command names. Click the desired command or press the Enter key to select the command.

NOTE

Ensure you type / at the start of a line or after a space. The options will not appear if you type it immediately after a character. You can navigate through each command and section in slash commands using the up, down, right, and left arrow keys.

You can also easily access Eddy AI right from the top of the slash menu. Additionally, the slash command options are categorized into three sections:

Markdown syntax

The Advanced WYSIWYG editor supports a wide range of Markdown syntaxes; for a detailed list, read the article on Markdown basics.

For example, if you want to add a Heading 2, type the following syntax: ## Heading of the section. The syntax will be rendered and Heading 2 will be added instantly.

NOTE

The Markdown syntax will only work when you type it in manually. It will not be rendered when you copy and paste the syntax.

To view the list of unsupported Markdown syntax, read the article on Advanced WYSIWYG editor basics.

Toolbar

The toolbar is categorized into three sections:

• Format: To change the layout or appearance of the content.

• Insert: To add elements such as images, videos, tables, and more.

• Find & replace: To search for a specific text and replace it with another text.

NOTE

By selecting the Pin () option, you can anchor the toolbar to the right side of the editor interface.

Format

1. Text styles

• Undo ( ): To reverse the last action.

• Redo ( ): To reapply the last undone action.

• Clear (  ): To remove all styling from selected text.

• Lettercase ( ): To change the letter case of the text.

2. Headings

• : To apply the H2 (Heading 2) style to the selected text.

• : To apply the H3 (Heading 3) style to the selected text.

• : To apply the H4 (Heading 4) style to the selected text.

• Paragraph ( ): To apply the standard paragraph style to the selected text.

3. Typography

• Font family: To select the typeface for the text.

  NOTE

  If you insert the content within Advanced WYSIWYG editor, the font type will be set to Verdana by default.

• Font size: To adjust the size of selected text.

4. Pallette

• Font color: To change the color of the selected text.

• Background color: To set a background color for the selected text.

5. Formatting & Lists

• Bold ( ): To bold the selected text.

• Italic ( ): To italicize the selected text.

• Underline ( ): To underline the selected text.

• Strikethrough ( ): To apply a strikethrough to the selected text.

• Inline code ( ): To add inline code to the text.

• Align left ( ): To align the text content with the left margin.

• Center ( ): To center your text content.

• Align right ( ): To align the text content with the right margin.

• Justify ( ): To distribute the text content evenly between the margins.

• Bullet list ( ): To add a list denoted with symbols for each item.

• Ordered list ( ): To add a list denoted with numbering for each item.

• Checklist ( ): To add a list denoted with checkboxes that users can mark as complete or incomplete.

6. Controls

• Increase indent ( ): To move the content farther away from the margin.

• Decrease indent ( ): To move the content closer to the margin.

• Subscript ( ): To lower the text below the baseline.

• Superscript ( ): To raise the text above the baseline.

• Line height ( ): To choose the spacing between the lines.

• Letter space ( ): To change the spacing between the letters.

• Line break ( ): To switch to the next line.

• Page break ( ): To specify where to end the current page and begin the next page while exporting content as PDF.

Insert

• Image: To insert an image.

NOTE

You can use the different tools available to format your added image. Click on the image, and the formatting tools appear as a floating menu. You can align, crop, add borders, add shadows, add captions, and more.

• Table: To insert a table.

• Video: To insert a video.

• Link: To insert a hyperlink. You can also use the "Ctrl + k" keyboard shortcut.

• Insert file: To insert a file within the article.

• Private notes: To insert private notes.

• LaTeX: To insert mathematical equations and symbols.

• Code block: To insert a block of code. Click within the code block, and you can find the following options in the contextual toolbar:

  • Language dropdown - Select the desired language

  • Copy - To copy the code block

  • Delete - To delete the code block

• Variables: To insert a variable.

• Snippets: To insert a snippet.

• Glossary: To insert a glossary term.

• Emoji: TO insert an emoji

• Callouts: To insert a callout. An info callout will be inserted when you click this option. To customize the callout, click within the callout, and you can find the following options in the contextual toolbar:

  • Callout info

  • Callout warning

  • Callout error

  • Callout success

  • Callout background color - To change the background color of the callout

  • Callout border color - To change the border color of the callout

  • Delete - To delete the callout

• Accordion: To add a container that can be expanded or collapsed to show or hide its content.

• Divider: To insert a horizontal line.

• FAQs: To insert the FAQ(s) templates.

Creating FAQs templates in Advanced WYSIWYG editor:

1. Navigate to the desired article in the Advanced WYSIWYG editor.

2. Click the Insert () icon and select FAQs from the dropdown.

   Three FAQ accordion templates will be inserted into your article.

3. In the inserted FAQs templates, you can perform the following options:

   1. Click the Settings () icon to customize the FAQ templates according to your preferences.

   2. Click the Expand/Collapse () icon to expand or collapse the FAQ accordions.

   3. Click the Delete () icon to remove the entire FAQ section.

   4. Click Add question () in between the FAQs, to insert additional custom FAQs.

NOTE

FAQs templates is different from AI FAQ generator.

For more information about AI FAQ generator, read the article.

Code view

• It allows you to view and edit the content in HTML code format.

• By switching to Code view, you can add custom HTML elements, apply inline styles, or make precise adjustments.

NOTE

• You must click the Save button to save the changes made in the code view. Ctrl/Cmd +S will not work in code view.

• Ordered and Unordered list misses out on sequential ordering.

• Nested list types are not supported in the following scenarios:

  • When the content is copied and pasted.

  • In certain content migration scenarios.

Adding an inline comment in Advanced WYSIWYG editor

1. Navigate to your desired article from the Knowledge base portal.

2. Select the desired text to add a comment, and a floating menu appears.

3. Click on the Comment icon (💬) from the floating menu.

4. Use basic formatting tools such as bold and lists, and by using @ you can mention your project team members if needed.

5. Once done, click on the Send icon.

NOTE

To turn off this mode, navigate to the Knowledge base portal, Documentation ()> Content tools > Workflow designer. Hover over the desired status and click on the Edit (✎) icon and turn off the Read only toggle.

To view all the comments in an article:

1. Navigate to the desired article.

2. Click on the Comment icon (💬) located on the right side near the publish button.

3. The Comments panel will appear. Use the dropdown at the top to filter the options, such as All comments, mentioned comments, open comments, and resolved comments.

Here, you can reply to the comments.

NOTE

Only the user who created the inline comment can edit, resolve, or delete it.

Formatting Choices for Pasting from Microsoft Word

You can choose to retain or clear formatting when pasting content from Microsoft Word, including elements like lists, tables, indentations, and fonts.

1. Click Paste with formatting to retain the content’s format from Microsoft Word.

2. Click Paste as plain text to clear the content’s format from Microsoft Word.