AsciiDoc Tooling

Since AsciiDoc syntax is just plain text, you can write an AsciiDoc document using any text editor. You don’t need complex word processing programs like Microsoft Word or Google Docs. In fact, you shouldn’t use these programs because they add cruft to your document that you can’t see that makes conversion tedious.

Here’s an overview of the different ways to preview and edit your AsciiDoc documents.

Hosted git repositories

The two most popular git repository hosts, GitHub and GitLab, support editing and previewing AsciiDoc files. In order to activate this support, the file must have a supported AsciiDoc extension, such as .adoc.

When you browse to an AsciiDoc file in the repository view, you will see an HTML preview of the AsciiDoc content. That preview is powered by Asciidoctor. The HTML that’s rendered is the embedded output produced by the built-in HTML converter. That means it won’t look like a standalone HTML document generated by Asciidoctor. Rather, the HTML is styled to match the theme of the hosting service and sanitized so it does not impact the rendering of the page. That means that certain features may not be available.

Both services apply syntax highlighting to source blocks. Both services also add a floating anchor link next to section titles. You can deep link to a specific section or other anchor by adding a fragment identifier to the URL. The AsciiDoc preview on GitLab currently supports more AsciiDoc features than on GitHub. On GitLab, you can find support for include directives, admonition icons, diagrams, and STEM expressions. GitHub, on the other hand, provides a table of contents browser, whereas on GitLab you must add a TOC explicitly using the toc attribute.

On GitHub, if you want to see the source of the AsciiDoc file instead of the preview, append ?plain=1 to the end of the URL.

If you click the Edit button, you will see the syntax highlighted source of the AsciiDoc file. In edit mode, you can view a preview of the modified source before you commit the changes. GitLab allows you to edit multiple files at once using its Web IDE.

Web browser add-ons (preview only)

To preview an AsciiDoc document in a web browser, install the Chrome extension, the Edge add-on, the Firefox add-on, or the Opera extension (all produced from the same code base). Then you can see the AsciiDoc file rendered as HTML just by visiting it.

IDEs and text editors

The following IDEs and text editors support the AsciiDoc syntax and most provide document preview rendering with Asciidoctor.

AsciiDocFX

AsciiDoc FX is an editor and terminal emulator written with JavaFX 8. See its documentation for download and installation instructions.

Atom

Install Atom. Then from the Atom editor menus, navigate to Atom  Preferences. From there, open the Packages tab and install:

AsciiDoc Preview

enables live preview

AsciiDoc Language

enables syntax highlighting (AsciiDoc language support)

AsciiDoc Image Helper

provides the ability to paste images from the clipboard

AsciiDoc Autocomplete

automatically completes AsciiDoc language items

AsciiDoc Assistant

Installs useful components to Atom for editing AsciiDoc files (including the above packages)

Brackets

Install Brackets. Then from the Brackets file menu, open the extension manager. Browse available extensions and install AsciiDoc Preview.

More information:

Eclipse

Install the open source plugin Asciidoctor Editor from the Eclipse Marketplace or visit the project repository.

IntelliJ IDEA

The community AsciiDoc plugin adds support to edit AsciiDoc files in the IDE with syntax highlighting, auto-completion and a live preview. It includes support for Antora and Spring REST Docs and creates PDFs using Asciidoctor PDF.

It works with the free community editions as well as with the paid editions of IntelliJ IDEA, CLion, PhpStorm, RubyMine, Android Studio etc.

SciTE

Install SciTE 5.2.3 or later. To enable the AsciiDoc lexer, follow these steps:

  1. Edit the user properties file and remove asciidoc from the list in imports.exclude.

  2. Restart SciTE.

  3. SciTE will automatically apply AsciiDoc syntax highlighting to files ending in .adoc and .asciidoc.

SciTE does not provide document preview rendering like other editors listed on this page.

Visual Studio Code

Visual Studio Code provides rich language support for AsciiDoc and a live preview as you type.

  1. Install Visual Studio Code.

  2. Launch Visual Studio Code and open the Quick Open dialog by pressing Ctrl+P.

  3. Type the following command to locate and install the AsciiDoc extension (by João Pinto):

    ext install asciidoctor.asciidoctor-vscode

More information: