UI-macros

<This file and it’s contents were copied from the Antora documentation for quick local reference.>

Asciidoctor has three user interface (UI) macros:

  • Button btn:[]

  • Keyboard kbd:[]

  • Menu menu:[]

The :experimental: attribute must be set in the document header, component version descriptor (antora.yml), or globally in your Antora playbook (antora-playbook.yml) to enable UI macros.

Button

Triple

Quad

Communicate that a user should press a button with the button macro.

Button UI macro
Press the btn:[Submit] button when you are finished the survey.

Select a file in the file navigator and click btn:[Open].
Result

Press the Submit button when you are finished the survey.

Select a file in the file navigator and click Open.

Keyboard

Create keyboard shortcuts with the keyboard macro.

Keyboard UI macro
Press kbd:[esc] to exit insert mode.

Use the shortcut kbd:[Ctrl+T] to open a new tab in your browser.

kbd:[Ctrl+Shift+N] will open a new incognito window.
Result

Press esc to exit insert mode.

Use the shortcut Ctrl+T to open a new tab in your browser.

Ctrl+Shift+N will open a new incognito window.

Show readers how to select a menu item with the menu macro.

Menu UI macro
To save the file, select menu:File[Save].

Select menu:View[Zoom > Reset] to reset the zoom level to the default setting.
Result

To save the file, select File  Save.

Select View  Zoom  Reset to reset the zoom level to the default setting.

Image

Show readers how to set an image using the image macro

Image
To display an image, insert the text as:
image:{Path/To/Image}[]
Result

imagemacro