Format

Headers

Source

 == AsciiDoc Format -> Level 1 Header

 === Headers -> Level 2 Header

 ==== Level 3 Header

...

Render

Level 1 Header

Level 2 Header

Level 3 Header

Anchors

Create Anchor

Create an anchor to a header so it can be accessed quickly.

Source
```
[[test-anchor]]
=== Test Anchor
```
Render

Test Anchor

Use Anchor

Create a link to the previously created anchor.

Source
```
<<test-anchor, Header>>
```
Render

Header

Text Format

Bold

Complete Bold

Use bold font for a word.

Source
```
*word*
```
Render

word

Partial Bold

Use bold font for a part of a word.

Source
```
w**or**d
```
Render

word

Italics

Complete Italics

Use style italics for a word.

Source
```
_word_
```
Render

word

Partial Italics

Use style italics for part of a word.

Source
```
w__or__d
```
Render

word

Emphasis

Give emphasis to a word.

Source
```
Give emphasis to a _word_
```
Render

word

Single Quotes

Place a word in single quotes.

Source
```
'`word`'
```
Render

‘word’

Double Quotes

Place a word in double quotes.

Source
```
"`word`"
```
Render

“word”

Superscripts

Place a word, or part of a word, as a superscript.

Source
```
^super^script
```
Render

^superscript

Subscripts

Place a word, or part of a word, as a subscript

Source
```
~wo~rd
```
Render

_word

Monospaced

Use monospaced font.

Monospaced

Source
```
`word`
```
Render

word

Line Break

Break a line in the same paragraph.

Source

This idea ends here. +
And I want this one in a new line,
but in the same paragraph.

Render

This idea ends here.
And I want this one in a new line, but in the same paragraph.

Escape Character

Use the backslash (\) to escape special characters.

Source

\*word* (Normally, it would make the word bold.)

Render

*word*

Comments

Use two slashes (//) to comment in the text and do not render it in the HTML.

Source

The next line is a comment.
// It should not be rendered in the HTML.

Render

The next line is a comment.

Pass-through HTML - Do not use

Delimit HTML code in 4 plus (+) to execute it once rendered.
Since the idea of Pelican is to separate content from style, do not use this method. Focus only on content in the .adocs.

Source

++++
  <p style="color:green">
  This <I>HTML</I> code will be rendered directly to the page.<br>
  </p>
++++

Render

This HTML code will be rendered directly to the page.

License Characters

Source
```
(C), (R), (TM)
```
Render

©, ®, ™

Media and links

Titles

They are declared before an element, starting with a dot (images, lists, quotes, literals, etc.).

Image Titles

Source

.Image Title
image::https://res.cloudinary.com/fluid-attacks/image/upload/v1620228838/airs/format/doge_e5vldn.webp[Doge]

Render

Figure 1. Image Title

Video Title

Source

.Video Title
video::https://res.cloudinary.com/fluid-attacks/video/upload/v1620228846/airs/format/he-man_avvqyi.mp4[He-man]

Render

Video Title

Literal Title

Source

 .Literal Title
 ....
 Literal Block
 ....

Render
Literal Title
```
Literal block
```

List Title

Source

.List Title
. Item 1
.. Subitem 1
. Item 2

Render
List Title
1. Item 1
  1. Subitem 1
2. Item 2

Quote Title

Source
```
.Quote Title
[quote]
I'm Batman
```
Render

Quote Title

I’m Batman

Table Title

Source

.Table Title
|====
| Col 1 | Col 2
|====

Render

Table 1. Table Title

Col 1

Col 2

Table 1. Table Title
Col 1	Col 2

Paragraph Title

Source
```
.Paragraph Title
Normal Paragraph
```
Render

Paragraph Title

Normal Paragraph

Code Title

Source

.Code Title
[source, python]
print "Hello World"

Render
Code Title
```
print "Hello World"
```

Images

Block Images

Source

image::https://res.cloudinary.com/fluid-attacks/image/upload/v1620228838/airs/format/doge_e5vldn.webp[Doge]

Render

Block Image

Inline Images

Source

image:https://res.cloudinary.com/fluid-attacks/image/upload/v1620228838/airs/format/doge_e5vldn.webp[Doge]

Render

Inline Image

Videos

Source

video::https://res.cloudinary.com/fluid-attacks/video/upload/v1620228846/airs/format/he-man_avvqyi.mp4[He-man]

Render

Links

Link - Option 1

When this option is being used, every punctuaction mark goes outside of the square brackets ``[]''.

Source
```
link:https://google.com[Google].
```
Render

Google.

Link - Option 1 - Type button

Source

[button]#link:https://google.com[Google]#.

Render

Google.

Special Blocks

Literals

Literal - Option 1

A literal block is delimited by 4 dots before and after the content.

Source
```
 ....
 Hello
 ....
```
Render
```
Hello
```

Literal - Option 2 - Do not use

Set a blank space as the first character of a line.

Source
```
{space}Hello
```
Render
```
Hello
```

Quotes

Quote Without Source Information

Source
```
[quote]
I'm Batman
```
Render

I’m Batman

Quote With Source Information

Source

[quote, Batman, Detective Comics]
I'm Batman

Render

I’m Batman

— Batman
Detective Comics

Source Code

Simple code

Source

.Code.py
[source, python]
print "Hello World"

Render
Code.py
```
print "Hello World"
```

Source Code With Numbered Lines

Source

.Code.java
[source, java, linenums]
----
Line 1
Line 2
Line 3
----

Render
Code.java
```
Line 1
Line 2
Line 3
```

If there are multiple code blocks with numbered lines, the numbering will be organized sequentially.

Source

.Code.cpp
[source, cpp, linenums]
----
Line 1
Line 2
Line 3
----
+
[source, cpp, linenums]
----
Line 4
Line 5
Line 6
----

Render

Code.cpp

Line 1
Line 2
Line 3

Line 4
Line 5
Line 6

Note	In order to reset the numbering, a title must be given to the desired code block.

Source

.Code1.py
[source, python, linenums]
----
Line 1
Line 2
Line 3
----
+
.Code2.py
[source, python, linenums]
----
Line 1
Line 2
Line 3
----

Render

Code1.py

Line 1
Line 2
Line 3

Code2.py

Line 1
Line 2
Line 3

Source Code from file

The path to the file must be absolute and according to the container’s filesystem.
In the source, there must not be a space between the path and the square brackets. The space was placed, so the file was not rendered in the literal block.

Source

 .Code from file
 [source, gherkin, linenums]
 ----
 include::script.feature [] -> No space
 ----

Render
Code from file
```
link:script.feature[]
```

Code Inside a List

Source

. Item 1
+
.Code1.py
[source, python]
----
print "Hello World"
----

. Item 2
+
.Code2.py
[source, python]
----
print "Bye World"
----

Render
1. Item 1
  Code1.py
  print "Hello World"
2. Item 2
  Code2.py
  print "Bye World"

Lists

Unordered Lists

Source
```
* Item 1
- Subitem 1.1
** Subitem 1.2
```
Render
Item 1
- Subitem 1.1
  - Subitem 1.2

Ordered Lists

Source

. Item 1
.. Item 1.1
... Item 1.1.1
.. Item 1.2
... Item 1.2.1
.... Item 1.2.1.1
. Item 2

Render
1. Item 1
  1. Item 1.1
    
    Item 1.1.1
  2. Item 1.2
    
    Item 1.2.1
    
    Item 1.2.1.1
2. Item 2

List Continuation

Source

. Something about a topic
+
Still talking about the same topic

. Another Topic

Talking about something else

Render
1. Something about a topic
  
  Still talking about the same topic
2. Another Topic

Talking about something else

Tables

Simple table

Source

.Title
[options="header"] -> Optional
|====
|Col 1|Col 2      |Col 3
|1    |Item 1     |a
|2    |Item 2     |b
|3    |Item 3     |c
|6    |Three items|d
|====

Render

Table 2. Title

Col 1 Col 2 Col 3

1

Item 1

a

2

Item 2

b

3

Item 3

c

6

Three items

d

Table 2. Title
Col 1	Col 2	Col 3
1	Item 1	a
2	Item 2	b
3	Item 3	c
6	Three items	d

A More Complicated Table

Source

[grid="rows",format="csv"]
[options="header",cols="^,<,<s,<,>m"]
|====
ID,FName,LName,Address,Phone
1,Vasya,Pupkin,London,+123
2,X,Y,"A,B",45678
|====

grid -> Sets borders
format -> Sets the delimiter character between columns
header -> The first column are headers
cols -> Sets format of the columns
  ^  align center in the row
  <  align left in the row
  <s align left in the row and font strong (bold)
  >m align right in the row and font monospaced

The CSS of the site overrides some of the previous.

Render

ID FName LName Address Phone

1

Vasya

Pupkin

London

+123

2

X

Y

A,B

45678

ID	FName	LName	Address	Phone
1	Vasya	Pupkin	London	`+123`
2	X	Y	A,B	`45678`

Multiline cells in a table, custom caption

Source

.Multiline cells, row/col span
[caption="Tabla"]
|====
|Date |Duration |Avg HR |Notes

|22-Aug-08 .2+^.^|10:24 | 157 |
Worked out MSHR (max sustainable
heart rate) by going hard
for this interval.

|22-Aug-08 | 152 |
Back-to-back with previous interval.

|24-Aug-08 3+^|none
|====

.2+^.^ -> Occupy two cells vertically and align center
          horizontally and vertically
3+^    -> Occupy 3 cells horizontally and align center horizontally

A dot (.) represents columns

Render

Tabla 1.Multiline cells, row/col span
Date	Duration	Avg HR	Notes
22-Aug-08	10:24	157	Worked out MSHR (max sustainable heart rate) by going hard for this interval.
22-Aug-08	10:24	152	Back-to-back with previous interval.
24-Aug-08	none

Responsive Table Distributed Horizontally

Use the special class tb-row for this type of table. DO NOT USE MULTILINE CELLS.

Source

[role="tb-row"]
.Horizontal Distribution
[frame="topbot", cols="^s,^,^"]
|====
| Row 1 | Item 1 | Item 2

| Row 2 | Item 1 | Item 2

| Row 3 | Item 1 | Item 2
|====

Render

Table 3. Horizontal Distribution

Row 1 Item 1 Item 2

Row 2

Item 1

Item 2

Row 3

Item 1

Item 2

Table 3. Horizontal Distribution
Row 1	Item 1	Item 2
Row 2	Item 1	Item 2
Row 3	Item 1	Item 2

Source

[role="tb-row"]
.Horizontal Distribution - More Cols than Rows
|====
>m| Row 1 | Item 1 | Item 2 | Item 3 | Item 4

^s| Row 2 | Item 1 | Item 2 | Item 3 | Item 4

| Row 3 | Item 1 | Item 2 | Item 3 | Item 4
|====

Render

Table 4. Horizontal Distribution - More Cols than Rows

Row 1 Item 1 Item 2 Item 3 Item 4

Row 2

Item 1

Item 2

Item 3

Item 4

Row 3

Item 1

Item 2

Item 3

Item 4

Table 4. Horizontal Distribution - More Cols than Rows
Row 1	Item 1	Item 2	Item 3	Item 4
Row 2	Item 1	Item 2	Item 3	Item 4
Row 3	Item 1	Item 2	Item 3	Item 4

Responsive Table Distributed Vertically

Use the special class `tb-col”` for this type of table.
*DO NOT USE MULTILINE CELLS*.

Source

[role="tb-col"]
.Vertical Distribution - NxN
[options="header", cols="^,^,^"]
|====
| Col 1 | Col 2 | Col 3

| Item 1.1 | Item 1.2 | Item 1.3

| Item 2.1 | Item 2.2 | Item 2.3
|====

Render

Table 5. Vertical Distribution - NxN

Col 1 Col 2 Col 3

Item 1.1

Item 1.2

Item 1.3

Item 2.1

Item 2.2

Item 2.3

Table 5. Vertical Distribution - NxN
Col 1	Col 2	Col 3
Item 1.1	Item 1.2	Item 1.3
Item 2.1	Item 2.2	Item 2.3

Source

[role="tb-col"]
.Vertical Distribution - MxN, M < N
[cols="<,^,>,<"]
|====
s| Col 1 s| Col 2 s| Col 3 s| Col 4

| Item 2.1.1 | Item 2.1.2 | Item 2.1.3 | Item 2.1.4

| Item 2.2.1 | Item 2.2.2 | Item 2.2.3 | Item 2.2.4
|====

Render

Table 6. Vertical Distribution - MxN, M < N

Col 1 Col 2 Col 3 Col 4

Item 2.1.1

Item 2.1.2

Item 2.1.3

Item 2.1.4

Item 2.2.1

Item 2.2.2

Item 2.2.3

Item 2.2.4

Table 6. Vertical Distribution - MxN, M < N
Col 1	Col 2	Col 3	Col 4
Item 2.1.1	Item 2.1.2	Item 2.1.3	Item 2.1.4
Item 2.2.1	Item 2.2.2	Item 2.2.3	Item 2.2.4

Source

[role="tb-col"]
.Vertical Distribution - MxN, M > N
|====
| Col 1 | Col 2 | Col 3

| Item 2.1.1 | Item 2.1.2 | Item 2.1.3

| Item 2.2.1 | Item 2.2.2 | Item 2.2.3

| Item 2.3.1 | Item 2.3.2 | Item 2.3.3

| Item 2.4.1 | Item 2.4.2 | Item 2.4.3

| Item 2.5.1 | Item 2.5.2 | Item 2.5.3
|====

Render

Table 7. Vertical Distribution - MxN, M > N
Col 1	Col 2	Col 3
Item 2.1.1	Item 2.1.2	Item 2.1.3
Item 2.2.1	Item 2.2.2	Item 2.2.3
Item 2.3.1	Item 2.3.2	Item 2.3.3
Item 2.4.1	Item 2.4.2	Item 2.4.3
Item 2.5.1	Item 2.5.2	Item 2.5.3

Responsive Table with Alternated Content - Max. 2 Columns

Use the special class tb-alt for this type of table. DO NOT USE MULTILINE CELLS.

Source

[role="tb-alt"]
.Table with Alternated Content
[cols="2*^", frame="none"]
|====
|Text 1
|image:https://res.cloudinary.com/fluid-attacks/image/upload/v1620228838/airs/format/doge_e5vldn.webp[Doge]

|image:https://res.cloudinary.com/fluid-attacks/image/upload/v1620228838/airs/format/doge_e5vldn.webp[Doge]
|Text 2

|Text 3
|image:https://res.cloudinary.com/fluid-attacks/image/upload/v1620228838/airs/format/doge_e5vldn.webp[Doge]

|image:https://res.cloudinary.com/fluid-attacks/image/upload/v1620228838/airs/format/doge_e5vldn.webp[Doge]
|Text 4
|====

Render

Table 8. Table with Alternated Content

Text 1

Text 2

Text 3

Text 4

Table 8. Table with Alternated Content
Text 1
	Text 2
Text 3
	Text 4

Questions and Answers

[qanda]
Question 1::
   Answer 1
Question 2::
   Answer 2

Render
1. Question 1
  
  Answer 1
2. Question 2
  
  Answer 2

Definitions

Source

Term 1:: Definition
Term 2:: Definition
[horizontal]
Subterm 2.1::: Definition can also be placed horizontally

Render

Term 1

Definition

Term 2

Definition

Subterm 2.1
Definition can also be placed horizontally.

Admonition Elements

Source

[WARNING]
The speed limit in this road is 60 mph. +
Do not exceed this speed.

NOTE: I left the dinner in the oven.

[CAUTION]
Be careful! The floor is slippery!

TIP: You can also make an appointment via our website.

[IMPORTANT]
Be sure to get all of your belongings
before exiting the vehicle.

Render

Warning
The speed limit in this road is 60 mph.
Do not exceed this speed.

Note
I left the dinner in the oven.

Caution
Be careful! The floor is slippery!

Tip
You can also make an appointment via our website.

Important
Be sure to get all of your belongings before exiting the vehicle.

Horizontal Rule

Source
```
'''
```
Render

Variables

They can be declared at the beginning of the document.

Source

:variable: AsciiDoc

This text is written in {variable}.

Render

This text is written in AsciiDoc.

Classes

Inline Classes

As with colors, inline elements can be given a class name and then be edited in the CSS.

Source
```
[new-class]#element#
```
Render

element

Block Classes

Block elements can also be given class names.

Source
```
[role="new-class"]
----
Text
----
```
Render
```
Text
```

Tooltips

Using images

Source

Term image:https://res.cloudinary.com/fluid-attacks/image/upload/v1620226925/airs/icons/tooltip_kf1mug.webp[alt="Tooltip icon",title="Additional information about the term"]

Term2 image:https://res.cloudinary.com/fluid-attacks/image/upload/v1620226925/airs/icons/tooltip_kf1mug.webp[alt="Tooltip icon",title="The description can have
line breaks in the source code"]

Render

Term

Term2

Format

Headers

Level 1 Header

Level 2 Header

Level 3 Header

Anchors

Create Anchor

Test Anchor

Use Anchor

Text Format

Bold

Complete Bold

Partial Bold

Italics

Complete Italics

Partial Italics

Emphasis

Single Quotes

Double Quotes

Superscripts

Subscripts

Monospaced

Monospaced

Line Break

Escape Character

Comments

Pass-through HTML - Do not use

License Characters

Media and links

Titles

Image Titles

Video Title

Literal Title

List Title

Quote Title

Table Title

Paragraph Title

Code Title

Images

Block Images

Inline Images

Videos

Links

Link - Option 1

Link - Option 1 - Type button

Special Blocks

Literals

Literal - Option 1

Literal - Option 2 - Do not use

Quotes

Quote Without Source Information

Quote With Source Information

Source Code

Simple code

Source Code With Numbered Lines

Source Code from file

Code Inside a List

Lists

Unordered Lists

Ordered Lists

List Continuation

Tables

Simple table

A More Complicated Table

Multiline cells in a table, custom caption

Responsive Table Distributed Horizontally

Responsive Table Distributed Vertically

Responsive Table with Alternated Content - Max. 2 Columns

Questions and Answers

Definitions

Admonition Elements

Horizontal Rule

Variables

Classes

Inline Classes

Block Classes

Tooltips

Using images

References