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:

• 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.

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).