Ace Editor Documentation

Integrates the Ace code editor into Drupal so you can edit and display raw HTML, PHP, JavaScript, CSS, YAML and many more languages with syntax highlighting, proper indentation, keyboard shortcuts and find & replace.

What is Ace Editor?

Ace Editor surfaces the Ace code editor in three independent ways:

• Text editor — attach Ace to any text format so node, block and other edit forms get a full code editor in place of the plain <textarea>.
• Field formatter — display a long-text field as read-only, syntax-highlighted code with the Ace Format formatter.
• Text filter — embed code snippets in body text with <ace> … </ace> tags; the Ace Filter renders each snippet as a read-only highlighted editor.

All three share a common configuration (theme, syntax mode, dimensions, font size, line numbers, print margin, word wrap, autocomplete).

Key Features

• Many themes and syntaxes — every Ace theme and language mode bundled with the library is auto-discovered and selectable.
• Three integration points — editor, formatter and filter, used together or on their own.
• Per-snippet overrides — <ace> tags accept attributes to override the theme, syntax and other options for a single snippet.
• Library auto-detection — the Ace library is located automatically under /libraries.

Getting Started

For Content Editors

• Installation and Setup — download the Ace library and enable the module
• Using the Code Editor — edit fields with the Ace editor
• Displaying Code (Formatter) — render a field as highlighted, read-only code
• Embedding Snippets (Filter) — drop <ace> snippets into body text

For Site Administrators

• Configuration — configure the editor, formatter and filter
• Themes and Syntaxes — the available themes and language modes
• Permissions — the module's permission

For Developers

• Architecture — the plugins, libraries and JavaScript behaviours
• Library Detection — how the Ace library path is resolved

Quick Links

• FAQ — frequently asked questions
• Project Page — Drupal.org project page
• Issue Queue — report bugs and request features
• Ace Editor library — the upstream Ace builds

Need Help?

• Check the FAQ for common questions.
• Review the relevant documentation section based on your role.
• Visit the issue queue for support.