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
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: