Editing XeditorNG Documents

To edit an XeditorNG document, proceed as follows:

1. Navigate in the desired document. A preview of the document is displayed in the content area.
2. Click the “Edit” (document is editable) or “Read” (document is read-only) action.

If you have opened the document in edit mode, make the desired changes to the content. The editing interface with the menu and button bar at the top is available for this purpose. The XeditorNG button bar follows a classic layout and provides the usual functions for text formatting and structuring.

Button Bar

• Headings
  Use the “H1”, “H2” and “H3” buttons to define the hierarchical levels of headings.
• Paragraph formatting
  Use the “Paragraph” button to switch between different paragraph formats or insert new paragraphs.
• Text formatting
  Use the “Bold”, “Italic”, and “Underline” buttons to emphasize.
• Advanced formatting
  • The “Subscript” and “Superscript” buttons can be used for displaying formulas or footnotes.
  • The “Strikethrough” and “Monospace” (fixed-width font, e.g., for code) buttons provide additional formatting options.
• Lists
  Create bullet points or numbered lists.
• Sections
  Use the “Convert to section” button to transform text passages into structured sections.
• Notes
  Use the “Quote”, “Information”, “Warning”, and “Error” buttons to insert special note boxes that visually highlight content.
• Code
  Use the “Convert to codeblock” button for code examples.
• Tables
  Use the “Insert table” button to present data in a structured format.

Menu Bar

Above the button bar, you will find the menu bar with four menus.

• Edit
  The “Undo” and “Redo” features allow you to quickly revert or restore changes in the editor.
  • “Undo” reverses the last editing action.
  • “Redo” restores the action that was undone.
  • With “Find and Replace”, you can search for text or words in the document and replace them individually or all at once. For example, find all occurrences of “TODO” and replace them with “DONE” (case-sensitivity included).
• View
  The “View” menu provides access to advanced display options that help optimize how the editor content and workspace appear.
  • Fullscreen
    Switches the editor to full-screen mode to minimize distractions and maximize text space. Click once to enter full-screen, click again to return to normal view.
  • Toggle Whitespaces
    Visually displays invisible characters such as spaces, tabs, and line breaks (e.g., as dots or arrows). When activated, whitespaces are highlighted – useful for formatting and debugging layouts.
  • Highlight Unsupported Elements
    Marks HTML elements or tags not fully supported by XeditorNG (e.g., custom tags or deprecated attributes). When active, problematic elements are visually highlighted or outlined – ideal for validation before saving.
• Insert
  The “Insert” menu provides menu entries for inserting common elements into the editor content.
  • Table
    Creates an editable table with a configurable number of rows and columns. A dialog lets you choose the size (e.g., 3x3) — the table is inserted at the cursor position and can be edited afterward (add/remove rows).
  • Link
    Inserts a clickable hyperlink or edits an existing one. Mark a text and enter the link (URL, e-mail).
  • Special Characters
    Offers a selection of special symbols (e.g., ©, ™, €, accents, mathematical symbols).
  • Insert Elements
    Adds advanced objects such as images, videos, code snippets, or horizontal lines.
    • Section
      Inserts a <section> block – ideal for thematic sections or containers.
    • P
      Inserts a simple <p> paragraph – the default for flowing text.
    • Box
      Inserts a <div> or callout box – for highlighted content with styling.
    • Codeblock
      Inserts a <pre><code> block – for syntax-highlighted code snippets.
    • H1–H6
      Inserts headings (<h1> to <h6>) – hierarchical structure with descending importance.
• Help
  The “Help” menu opens the help tools and settings, including accessibility options for barrier-free usage.
  • Accessibility
    Enables support for screen readers, keyboard navigation, and visual aids (e.g., focus indicators, ARIA labels for all elements).

Comments

You can add comments directly in the editor. Click the comment icon on the right margin of the page to create a comment. Each comment shows the author’s name, the date, and supports threaded replies.

• Other collaborators can respond to comments or accept them by clicking the checkmark in the top-right corner of the comment.
• The three dots next to the checkmark open additional options, including opening the comment archive or managing responses.

Attribute Panel

The attribute panel is available on the right-hand side of the editor. When activated, it displays all attributes related to the selected element in the document. You can modify these attributes directly through this panel. This feature enables structured inspection and editing of metadata and XML properties without switching to code view.

Note: Attributes are small pieces of additional information attached to an element in an XML document. They describe specific properties of that element — for example, a paragraph might have an attribute that defines its style or language (style="italic", lang="en"). Think of attributes as “labels” that provide extra meaning to parts of your text.

Raw Editor

1. Advanced users can open the underlying XML file in the “Raw Editor”. This view displays the document’s raw XML source and allows direct modification of its structure and tags. The “Raw Editor” is valuable for examining or fixing XML-level errors and validating content integrity.