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
Many popular git repository hosts, including GitHub, GitLab, and Codeberg, 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 view an AsciiDoc file on these sites, you will see an HTML preview of the AsciiDoc content. This preview is powered by Asciidoctor. The HTML that’s rendered is the embedded output produced by the built-in HTML converter. This 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. This means that certain features may not be available.
GitHub and GitLab apply syntax highlighting to source blocks. Both services also add floating anchor links next to section titles. You can deep link to a specific section or to another 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 an AsciiDoc file instead of the preview, click the Code button or append ?plain=1
to the end of the URL.
If you enter edit mode by clicking the Edit file button on either GitHub or GitLab, you can modify the source of the AsciiDoc file and see a preview of the modified source before you commit your changes. GitLab even allows you to edit multiple files in a single commit 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
The Atom editor’s official site has announced that Atom is being sunset at the end of 2022. See Sunsetting Atom |
Install Atom. Then from the Atom editor menus, navigate to . 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:
-
Edit the user properties file and remove
asciidoc
from the list inimports.exclude
. -
Restart SciTE.
-
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.
-
Install Visual Studio Code.
-
Launch Visual Studio Code and open the Quick Open dialog by pressing Ctrl+P.
-
Type the following command to locate and install the AsciiDoc extension (by João Pinto):
ext install asciidoctor.asciidoctor-vscode
More information: