HTML syntax editor

  • Release version: Xanadu
  • Updated August 1, 2024
  • 2 minutes to read
    • Summarize
    Summarized using AI
    This content was generated using new OpenAI-powered functionality. Results are provided on an as is basis and are not guaranteed to be accurate or complete.

    Summary of HTML syntax editor

    The HTML syntax editor in ServiceNow supports editing HTML and Jelly scripts, which define the content rendered on pages. It allows you to work with both static XHTML and dynamically generated Jelly content, and can call script includes and UI Macros. This editor enhances productivity by providing syntax coloring, indentation, line numbers, and automatic closure of braces and quotes.

    Show full answer Show less

    Key Features

    • Syntax Support: Supports both HTML and Jelly scripting with syntax highlighting and indentation for easier coding.
    • Auto-suggestions: Provides suggestions for HTML and Jelly tags to speed up coding.
    • Script Macros: Includes macros for common code shortcuts to simplify repetitive tasks.
    • Toggle Syntax Editor: Enables or disables the syntax editor view as needed.
    • Search and Replace: Offers powerful search capabilities, including support for regular expressions, with options to replace single or all occurrences.
    • Commenting: Easily comment or uncomment selected code with keyboard shortcuts.
    • Full Screen Mode: Expands the editor to full screen for more comfortable editing (not available in Internet Explorer).
    • Keyboard Shortcuts: Numerous shortcuts are available for efficient editing, searching, commenting, replacing, toggling views, and accessing help.

    Editing Tips

    • Use the Tab key to insert fixed spaces or indent code lines or blocks.
    • Press Shift+Tab to decrease indentation or remove tabs from the start of lines.
    • Click in the leading whitespace of a line to indent that line easily.

    Practical Benefits for ServiceNow Customers

    This editor enhances your ability to efficiently create and maintain HTML and Jelly scripts within the ServiceNow platform, improving code readability and reducing errors. The built-in shortcuts and advanced editing features streamline workflow, enabling faster development and easier maintenance of UI components and dynamic content.

    The HTML syntax editor provides support for editing HTML and Jelly scripts and defines what's rendered when the page is displayed. The HTML syntax editor can contain either static XHTML or dynamically generated content defined as Jelly, and can call script includes and UI Macros.

    The syntax editor has these features.
    • HTML and Jelly script support
    • HTML and Jelly syntax coloring, indentation, line numbers, and automatic creation of closing braces and quotes
    • Auto-suggestions for HTML and Jelly tags
    • Script macros for common code shortcuts
    Figure 1. HTML syntax editor
    Syntax editor for HTML and Jelly scripts.
    Table 1. HTML and Jelly editing functions
    Icon Keyboard shortcut Name Description
    Toggle syntax editor icon N/A Toggle syntax editor Disables the syntax editor. Click the Toggle syntax editor icon (Toggle syntax editor icon) again to enable the syntax editor.
    Toggle comment icon Cmd+/ Toggle comment Comments the selected code.
    Replace icon Cmd+E Replace Replaces the next occurrence of a text string in the script field.
    1. Click the Replace icon (Replace icon), then enter the string to replace, and press Enter. You can use regular expressions enclosed in slashes to define the string to replace. For example, the term /a{3}/ locates aaa.
    2. Enter the replacement string and press Enter.
    Replace all icon Cmd Replace All Replaces all occurrences of a text string in the script field.
    1. Click the Replace all icon (Replace all icon), then enter the string to replace and press Enter. You can use regular expressions enclosed in slashes to define the string to replace. For example, the term /a{3}/ locates aaa.
    2. Enter the replacement string and press Enter.
    Start searching icon Cmd+F Start Searching Highlights all occurrences of a search term in the script field and locates the first occurrence. Click the Start searching icon (Start searching icon), then enter the search term and press Enter.
    Find next icon Cmd+G Find Next Locates the next occurrence of the current search term in the script field. Click the Start searching icon (Start searching icon) to change the current search term.
    Find previous icon Cmd+Shift+G Find Previous Locates the previous occurrence of the current search term in the script field. Click the Start searching icon (Start searching icon) to change the current search term.
    Toggle full screen icon Ctrl+M Toggle Full Screen Expands the script field to use the full form view for easier editing. Click the Toggle full screen icon (Toggle full screen icon) again to return to standard form view. This feature is not available for Internet Explorer.
    Help icon Cmd+H Help Displays the keyboard shortcuts help screen.
    Save icon N/A Save Saves changes without leaving the current view. Click the Save icon (Save icon) in full screen mode to save without returning to standard form view.

    Editing tips

    • To insert a fixed space anywhere in your code, press Tab.
    • To indent a single line of code, click in the leading white space of the line and then press Tab.
    • To indent one or more lines of code, select the code and then press Tab. To decrease the indentation, press Shift+Tab.
    • To remove one tab from the start of a line of code, click in the line and press Shift+Tab.