Antora Content Management

Use Resources

Table 1. Antora Content Organization

Directory

Purpose

attachments

resource, such as the ZIP archive, pdf of a sample project, that a site visitor can download via a link, using link macro

partials

reusable content snippets such as product descriptions and definitions, using include directive

images

using name macro

examples

source code file, using include

How to diagram using C4 model ?

Examples

(draw-box 1)
(draw-box "two" {:span 2})
(draw-box nil {:fill "#a0ffa0"})
(draw-box false)

partials

Introduction

An example of a basic AsciiDoc document prepared by avimehenwal.

A paragraph followed by an unordered list[1] with square bullets.[2]

  • item 1

  • item 2

  • item 3

Main

Here’s how you say “Hello, World!” in Prawn:

Create a basic PDF document using Prawn
require 'prawn'

Prawn::Document.generate 'example.pdf' do
  text 'Hello, World!'
end

Conclusion

That’s all, folks!

Images

edn

Attachments

like pdf and zip file for downloads

Download the PDF example and read it.

view prebuilt HTML page

Use bytefield

0123456789abcdef000102030405060708090a0b0c0d0e0f0010101112131415161718191a1b1c1d
A byteframe
0123456789abcdef2aWhee!0010i+00
A byte field

And some more text.

01two0

Tweet

tweet::104136996043670323[]

LaTex

Using maths on web?

  1. Challenges with maths on web

    • characters and layouts convey meaning

    • screenreaders and a11y

    • images and text, looses semantic meaning

    • Multiple Languages implementations to solve this problem TeX, LaTeX, MathML

Use MathTypes text language then process it with MathJax. And then you can do something like this

Without stem

x = {-b \pm \sqrt{b^2-4ac} \over 2a}. \rightarrow

A matrix can be written as



Interactive

const {camelCase} = require('lodash');
console.log(camelCase('get content'));  (1)
1 Now you can see the output of this line in the browser.

Content Organization

color:#FF5733[]

#fcf
#00BCD4
rgb(232, 74, 87)
rgba(103,58,183,50%)
hsl(88, 50%, 53%)
hsla(36, 100%, 50%, 75%)

We should use the color color:blueviolet[] in our logo.

  • Extensions are shared by all pages

[How can I use asciidoc extensions in antora?](https://gitlab.com/antora/antora/-/issues/442)

Extensions
Diagram
Diagram
Features and issues

  • Use LaTex with MathJax

  • Use bytefield

  • Interactive code-block?

  • Color chips?

Issues

How to use asciidoc-charts?

Issue is to include chartist css and js on page < head>

AWS Architecture diagrams

Diagram

New diagram

Diagram

Mermaid

abcd-flowchart
1. AsciiDoc supports unordered, ordered, and description lists.
2. You may choose from square, disc, and circle for the bullet style.