Rich Text Editor for Azure DevOps Wiki PRO (WYSIWYG)

This article will take 3 minutes to read. Print this page.  Improve this page

Introduction

Azure DevOps WikiPRO extends the standard Azure DevOps Wiki experience by providing a rich text editor that enables users to create, edit, and format documentation in a familiar word style experience, without requiring extensive Markdown knowledge. The rich text editor simplifies content authoring through an intuitive toolbar, allowing teams to create professional documentation faster while maintaining compatibility with Azure DevOps Wiki pages.

Benefits of Rich Text Editing

The rich text editor helps users:

  • Create content using a familiar word processor-style interface.
  • Format text without manually writing Markdown syntax.
  • Insert or modify tables, images, links, and code blocks easily.
  • Improve documentation consistency across teams.
  • Reduce onboarding time for users unfamiliar with Markdown.

Accessing the Rich Text Editor

To edit a Wiki page using the rich text editor:

  1. Navigate to the desired Wiki page.
  2. Select Edit.
  3. Choose Rich Text Editor mode (if not already enabled).
  4. Begin editing content using the toolbar options.

Changes are automatically converted into Wiki-compatible formatting when the page is saved.

Creating Tables

Tables help organize structured information. Just click on Insert table. Tables can contain other elements like images and styled text.

Modifying Tables

If you click on the … menus to the left of each row, you will get the row menu, where you can:

  • insert new rows above or below the current row
  • delete the current row

If you click on the … menus above each column, you will get the column menu, where you can:

  • Select alignment (left, center or right aligned) for the current column.
  • insert new columns before or after the current column.
  • delete the current column.

Formatting Text

The toolbar provides common formatting options including:

Formatting Option Description
Bold Emphasizes important text
Italic Adds emphasis or citations
Underline Highlights content
Strikethrough Marks deprecated information
Headings Creates document structure
Lists Creates ordered and unordered lists
Blockquotes Highlights notes or references

Example

Before

Plain text content.

After

  • Bold text
  • Italic text
  • Strikethrough text

Working with Headings

Use headings to organize content and improve navigation.

Recommended structure:

# Heading 1 (Page Title)

## Heading 2 (Section)

### Heading 3 (Subsection)

Best practices:

  • Use only one Heading 1 per page.
  • Maintain a logical hierarchy.
  • Avoid skipping heading levels.

Creating Lists

Unordered Lists

  • Feature A
  • Feature B
  • Feature C

Ordered Lists

  1. Open the Wiki page.
  2. Select Edit.
  3. Update the content.
  4. Save changes.

Best practice:

  • Use descriptive link text instead of raw URLs whenever possible.

Adding Images

To insert an image:

  1. Place the cursor where the image should appear.
  2. Select Insert Image from the toolbar.
  3. Upload a new image or select an existing attachment.
  4. Configure alignment and size options if available.
  5. Save the page.

Recommendations:

  • Use optimized image sizes.
  • Include descriptive alt text.
  • Avoid excessively large screenshots.

Working with Code Blocks

Code blocks preserve formatting and improve readability for technical content.

Example:

Was this page helpful Yes/ No
On this page