Run Antora to Generate Your Site

Assumptions:

On this page, you’ll learn:

  • How to run Antora and generate a site.

  • Where files are cached.

  • How to update the cache.

  • How to preview a generated site locally.

Antora Demo

You don’t need to set up a playbook file, docs component, or create a UI to evaluate Antora. Instead, you can use the Antora demo.

The demo consists of a playbook repository containing a playbook file and several content respositories (component-a and component-b) to which that playbook refers. It also makes use the UI bundle produced by the default UI project. In other words, it contains everything you need to get started.

Once you’ve installed Antora, you can run Antora using the demo materials to explore its capabilities. The instructions and examples on this page will guide you through the process.

Choose a Playbook

To produce a documentation site, Antora needs a playbook. But first, you’ll need to create or choose a directory where you’ll store the playbook and where the generated site files will be saved (assuming you use the default output configuration).

For the examples on this page, we’ll use the Demo materials.

  1. Open a terminal and make a new directory named demo-site.

    ~ $ mkdir demo-site

  2. Switch (cd) into the directory you just made.

    ~ $ cd demo-site

  3. Using your preferred text editor or IDE, create a new playbook file named site.yml and populate it with the contents of the following example. You can also download a sample playbook file from the Demo repository.

    site.yml
    site:
  title: Antora Demo Site
  url: https://example.org/docs (1)
  start_page: component-b::index.adoc (2)
content:
  sources:
  - url: https://gitlab.com/antora/demo/demo-component-a.git
    branches: master
  - url: https://gitlab.com/antora/demo/demo-component-b.git
    branches: [v2.0, v1.0]
    start_path: docs
ui:
  bundle:
    url: https://gitlab.com/antora/antora-ui-default/-/jobs/artifacts/master/raw/build/ui-bundle.zip?job=bundle-stable
    snapshot: true
    1 The 404 page and sitemap files are only generated if the site.url property is set. The sitemap files are only generated if the site.url property is an absolute URL.
    2 The site.start_page property accepts the same page ID syntax that’s used in xrefs.

  4. Save the playbook as site.yml in the demo-site directory you made in Step 1.

Run Antora

  1. To generate the site with the default Antora site generator, point the antora command at your playbook file. In the terminal, type:

    demo-site $ antora site.yml

    First, Antora will clone the content repositories. The cloning progress of each repository is displayed in the terminal.

    Repository cloning progress
    [clone] https://gitlab.com/antora/demo/demo-component-a.git [################]
[clone] https://gitlab.com/antora/demo/demo-component-b.git [################]

    Once cloning is complete, Antora converts the AsciiDoc pages to embeddable HTML, wraps the HTML in the UI page templates, then assembles the pages into a site under the destination folder, which defaults to build/site.

  2. Antora has completed generation when the command prompt ($) reappears in the terminal.

    If something goes wrong during generation, you’ll see an error message in the terminal.

    error: a message that summarizes what went wrong

    If this message does not provide enough information to fix the problem, you can ask Antora for more context. To tell Antora to reveal the calls leading up to the error (i.e., the stacktrace), run the antora command again, this time with the --stacktrace option:

    demo-site $ antora --stacktrace site.yml

    Share this stacktrace when asking for help.

  3. Switch into the site folder (cd) and list (ls) its contents.

    demo-site $ cd build/site/

    Inside the build/site folder, run:

    site $ ls -1

    You should see the following list of files and directories:

    _
404.html
component-a
component-b
index.html
sitemap-component-a.xml
sitemap-component-b.xml
sitemap.xml
    The 404 page and sitemap files will be missing if the site.url property is not defined in your playbook. The main sitemap file is actually a sitemap index. That file links to the sitemap for each component, which is where the URL for the individual pages can be found.

    This list includes the entry point of your documentation site, index.html.

  4. On some operating systems, you can open the site directly from the command line by typing open, followed by the name of the HTML file.

    site $ open index.html

    Or, you can navigate to an HTML page inside the destination folder in your browser. If you’ve been following along with the Demo materials, once you find the demo-site directory, navigate to the file build/site/index.html.

Cache

When Antora runs the first time, it will save resources it fetches over the network in a local cache. Antora caches two types of resources:

  • cloned git repositories

  • downloaded UI bundles

Antora stores these resources in the cache directory, which are further organized under the content and ui folders, respectively. The default cache directory varies by operating system. You can override the default cache location—​listed here in order of precedence—​using:

If you want Antora to update the cache on subsequent runs, pass the --fetch option to the Antora CLI or set the runtime.fetch key to true in the playbook. This switch will force Antora to run a fetch operation on each repository it previously cloned. It will also force Antora to download a fresh copy of the UI bundle, if the URL is remote.

If you want to clear the cache altogether, locate the Antora cache directory on your system and delete it.

Private git repositories

Antora can authenticate with private repositories using HTTP Basic authentication over HTTPS. See Private repository authentication to learn more.

Local Site Preview

Since Antora generates static sites, you do not need to publish the site to a server in order to preview it.

To view the site, navigate to any HTML page inside the destination folder in your browser. If your using the Demo, look for the file /demo-site/build/site/index.html.

Optional: Run local server

A site generated by Antora is designed to be viewable without a web server. However, you may need to view your site through a web server to test certain features, such as indexified URLs or caching. You can use the serve package for this purpose.

Install the serve package globally using npm:

demo-site $ npm i -g serve@6.5.8

That puts a command by the same name on your PATH.

We specifically recommend using serve 6.5.8 since that’s the last version known to work reliably.

Now launch the web server by pointing it at the location of the generated site. In the terminal, type serve build/site. After executing the command, a the local address should be displayed in your terminal.

demo-site $ serve build/site

You should see the following output in your terminal.

   ┌─────────────────────────────────────────────────┐
   │                                                 │
   │   Serving!                                      │
   │                                                 │
   │   - Local:            http://localhost:5000     │
   │   - On Your Network:  http://192.168.1.9:5000   │
   │                                                 │
   │   Copied local address to clipboard!            │
   │                                                 │
   └─────────────────────────────────────────────────┘

Paste the provided URL into the location bar of your browser to view your site through a local web server.

Press Ctrl+C to stop the server.

Publish to GitHub Pages

Antora is designed to create sites that run anywhere, whether it be on a static web host or the local filesystem. However, some hosts offer “features” that mess with Antora’s output. GitHub Pages is one of those hosts.

By default, GitHub Pages runs all files through another static site generator named Jekyll (even if they aren’t using a Jekyll project structure). Since Antora already produces a ready-made site, there’s absolutely no need for this step. This processing is particularly problematic since Jekyll has the nasty side effect of removing all files that begin with an underscore (_). Antora puts UI files in a directory named _, and places images under the directory name _images, which Jekyll subsequently erases. As a result, no UI, no images.

Fortunately, there’s a way to disable this “feature” of GitHub Pages. The solution is to add a .nojekyll file to the root folder of the published site (i.e., the output directory).

One way to add this file is to touch the .nojekyll file in the output directory after Antora runs, but before committing the files to GitHub Pages. For example:

$ touch build/site/.nojekyll

To avoid the need for the extra command, the other way to do it is to inject the file using Antora’s supplemental UI feature. To do so, add the following supplemental_files block under the ui category in your playbook file:

ui:
  bundle:
    url: <url-of-bundle-goes-here>
  supplemental_files:
  - path: .nojekyll
  - path: ui.yml
    contents: "static_files: [ .nojekyll ]"

The presence of the .nojekyll file at the root of the gh-pages branch tells GitHub Pages not to run the published files through Jekyll. The result is that your Antora-made site will work as expected. (It will be available sooner since GitHub Pages doesn’t waste time running Jekyll).