Contributing To These Guides¶
You'd like to help us improve these guides? Great! We're always looking for new contributors to help us improve our documentation. There are many ways you can contribute, from writing new guides, improving existing guides, or even just fixing typos.
What Can I Contribute?¶
There are many ways you can contribute to this project. Here are some examples:
- Writing new guides
- Improving existing guides
- Fixing typos
- Expanding explanations
How Do I Contribute?¶
Contributing to this project is easy. Just follow these steps:
- Fork this repository
- Create a new branch for your changes
- Make your changes
- Commit your changes
- Push your changes to your fork
- Create a pull request
- Wait for your changes to be reviewed and merged
- Celebrate!
- Repeat steps 2-8 as often as you like
How Should I Write My Guide?¶
Basics¶
We have a few guidelines for writing guides. Please follow these guidelines when writing your guide:
- Guides should be written in markdown format
- Guides should be written in a way that is easy to understand
- Guides should be written in a way that is easy to read
- Guides should be written in a way that is easy to follow
- Guides should be written in a way that is easy to translate
- Guides should be written in a way that is easy to maintain
- Guides should be written in a way that is easy to update
- Guides should be written in a way that is easy to expand
- Guides should be written in a way that is easy to improve
- That should cover it..
File Location¶
The markdown files for guides need to be placed in the /guides/
directory. The file name should be the same as the guide title, with all spaces replaced with hyphens. For example, a guide titled "How To Install rAthena" would be saved as how-to-install-rathena.md
.
We have created some directories to help organize the guides. Please place your guide in the appropriate directory. If you are unsure where to place your guide, please ask in our Discord server.
Markdown Guidelines¶
You can structure your guide any way you see fit, but we do have a few guidelines for writing markdown files to keep everything looks reasonably consistent.
Headings¶
Headings should be used to break up your guide into sections. When you use hashes #
to create headings, you should use the following number of hashes for each heading:
#
- Top level heading (autogen - do not use in your guide)##
- Second level heading###
- Third level heading####
- Fourth level heading
These headings are automatically turned into a table of contents on the guide page. This allows users to quickly jump to the section they are interested in.
Code Blocks¶
Code blocks should be used to display code. You can use code blocks to display commands, code snippets, or even entire files. To create a code block, you can use the following syntax:
```text
# This is a code block
```
You can add an optional language identifier to enable syntax highlighting in your code block.
Inline Code¶
Inline code should be used to display code that is part of a sentence. To create inline code, you can use the following syntax:
`This is inline code`
Links¶
Links should be used to link to other pages. To create a link, you can use the following syntax:
[Link Text](https://example.com)
Images¶
Images can be used, but we recommend using them sparingly. They should be linked from a permenant hosting solution (not somewhere that deletes images after x days) and should not be pushed to this repository unless absolutely necessary. To display an image, you can use the following syntax:
![Image Alt Text](https://example.com/image.png)
Tables¶
Tables can be used to display data in a tabular format. To create a table, you can use the following syntax:
| Column 1 | Column 2 | Column 3 |
| -------- | -------- | -------- |
| Row 1 | Row 1 | Row 1 |
| Row 2 | Row 2 | Row 2 |
| Row 3 | Row 3 | Row 3 |
Lists¶
Lists can be used to display data in a list format. To create a list, you can use the following syntax:
- List Item 1
- List Item 2
- List Item 3
MkDocs Goodies¶
Since we are using MkDocs for our documentation, we can take advantage of the plugins and extensions that MkDocs has to offer;
Admonitions, also known as call-outs, are an excellent choice for including side content without significantly interrupting the document flow.
Usage
Admonitions follow a simple syntax: a block starts with !!!
, followed by a
single keyword used as a type qualifier. The content of the block follows on
the next line, indented by four spaces:
!!! note
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nulla et euismod
nulla. Curabitur feugiat, tortor non consequat finibus, justo purus auctor
massa, nec semper lorem quam in massa.
Note
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nulla et euismod nulla. Curabitur feugiat, tortor non consequat finibus, justo purus auctor massa, nec semper lorem quam in massa.
Changing the title
By default, the title will equal the type qualifier in titlecase. However, it can be changed by adding a quoted string containing valid Markdown (including links, formatting, ...) after the type qualifier:
!!! note "Phasellus posuere in sem ut cursus"
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nulla et euismod
nulla. Curabitur feugiat, tortor non consequat finibus, justo purus auctor
massa, nec semper lorem quam in massa.
Phasellus posuere in sem ut cursus
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nulla et euismod nulla. Curabitur feugiat, tortor non consequat finibus, justo purus auctor massa, nec semper lorem quam in massa.
Removing the title
Similar to [changing the title], the icon and title can be omitted entirely by adding an empty string directly after the type qualifier. Note that this will not work for [collapsible blocks]:
!!! note ""
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nulla et euismod
nulla. Curabitur feugiat, tortor non consequat finibus, justo purus auctor
massa, nec semper lorem quam in massa.
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nulla et euismod nulla. Curabitur feugiat, tortor non consequat finibus, justo purus auctor massa, nec semper lorem quam in massa.
Collapsible blocks
When an admonition block is started with ???
instead
of !!!
, the admonition is rendered as a collapsible block with a small toggle
on the right side:
??? note
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nulla et euismod
nulla. Curabitur feugiat, tortor non consequat finibus, justo purus auctor
massa, nec semper lorem quam in massa.
Note
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nulla et euismod nulla. Curabitur feugiat, tortor non consequat finibus, justo purus auctor massa, nec semper lorem quam in massa.
Adding a +
after the ???
token renders the block expanded:
???+ note
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nulla et euismod
nulla. Curabitur feugiat, tortor non consequat finibus, justo purus auctor
massa, nec semper lorem quam in massa.
Note
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nulla et euismod nulla. Curabitur feugiat, tortor non consequat finibus, justo purus auctor massa, nec semper lorem quam in massa.
Inline blocks
Admonitions can also be rendered as inline blocks (e.g., for sidebars), placing
them to the right using the inline
+ end
modifiers, or to the left using
only the inline
modifier:
Lorem ipsum
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nulla et euismod nulla. Curabitur feugiat, tortor non consequat finibus, justo purus auctor massa, nec semper lorem quam in massa.
!!! info inline end "Lorem ipsum"
Lorem ipsum dolor sit amet, consectetur
adipiscing elit. Nulla et euismod nulla.
Curabitur feugiat, tortor non consequat
finibus, justo purus auctor massa, nec
semper lorem quam in massa.
Use inline end
to align to the right (left for rtl languages).
Lorem ipsum
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nulla et euismod nulla. Curabitur feugiat, tortor non consequat finibus, justo purus auctor massa, nec semper lorem quam in massa.
!!! info inline "Lorem ipsum"
Lorem ipsum dolor sit amet, consectetur
adipiscing elit. Nulla et euismod nulla.
Curabitur feugiat, tortor non consequat
finibus, justo purus auctor massa, nec
semper lorem quam in massa.
Use inline
to align to the left (right for rtl languages).
Important: admonitions that use the inline
modifiers must be declared
prior to the content block you want to place them beside. If there's
insufficient space to render the admonition next to the block, the admonition
will stretch to the full width of the viewport, e.g., on mobile viewports.
Supported types
Following is a list of type qualifiers provided by Material for MkDocs, whereas
the default type, and thus fallback for unknown type qualifiers, is note
1:
note
-
Note
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nulla et euismod nulla. Curabitur feugiat, tortor non consequat finibus, justo purus auctor massa, nec semper lorem quam in massa.
abstract
-
Abstract
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nulla et euismod nulla. Curabitur feugiat, tortor non consequat finibus, justo purus auctor massa, nec semper lorem quam in massa.
info
-
Info
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nulla et euismod nulla. Curabitur feugiat, tortor non consequat finibus, justo purus auctor massa, nec semper lorem quam in massa.
tip
-
Tip
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nulla et euismod nulla. Curabitur feugiat, tortor non consequat finibus, justo purus auctor massa, nec semper lorem quam in massa.
success
-
Success
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nulla et euismod nulla. Curabitur feugiat, tortor non consequat finibus, justo purus auctor massa, nec semper lorem quam in massa.
question
-
Question
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nulla et euismod nulla. Curabitur feugiat, tortor non consequat finibus, justo purus auctor massa, nec semper lorem quam in massa.
warning
-
Warning
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nulla et euismod nulla. Curabitur feugiat, tortor non consequat finibus, justo purus auctor massa, nec semper lorem quam in massa.
failure
-
Failure
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nulla et euismod nulla. Curabitur feugiat, tortor non consequat finibus, justo purus auctor massa, nec semper lorem quam in massa.
danger
-
Danger
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nulla et euismod nulla. Curabitur feugiat, tortor non consequat finibus, justo purus auctor massa, nec semper lorem quam in massa.
bug
-
Bug
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nulla et euismod nulla. Curabitur feugiat, tortor non consequat finibus, justo purus auctor massa, nec semper lorem quam in massa.
example
-
Example
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nulla et euismod nulla. Curabitur feugiat, tortor non consequat finibus, justo purus auctor massa, nec semper lorem quam in massa.
quote
-
Quote
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nulla et euismod nulla. Curabitur feugiat, tortor non consequat finibus, justo purus auctor massa, nec semper lorem quam in massa.
Diagrams help to communicate complex relationships and interconnections between different technical components, and are a great addition to project documentation. Material for MkDocs integrates with Mermaid.js, a very popular and flexible solution for drawing diagrams.
``` mermaid
graph LR
A[Start] --> B{Error?};
B -->|Yes| C[Hmm...];
C --> D[Debug];
D --> B;
B ---->|No| E[Yay!];
```
graph LR
A[Start] --> B{Error?};
B -->|Yes| C[Hmm...];
C --> D[Debug];
D --> B;
B ---->|No| E[Yay!];
Using sequence diagrams Sequence diagrams describe a specific scenario as sequential interactions between multiple objects or actors, including the messages that are exchanged between those actors:
``` mermaid
sequenceDiagram
autonumber
Alice->>John: Hello John, how are you?
loop Healthcheck
John->>John: Fight against hypochondria
end
Note right of John: Rational thoughts!
John-->>Alice: Great!
John->>Bob: How about you?
Bob-->>John: Jolly good!
```
sequenceDiagram
autonumber
Alice->>John: Hello John, how are you?
loop Healthcheck
John->>John: Fight against hypochondria
end
Note right of John: Rational thoughts!
John-->>Alice: Great!
John->>Bob: How about you?
Bob-->>John: Jolly good!
Material for MkDocs provides support for several HTML elements that can be used to highlight sections of a document or apply specific formatting.
Text can be {--deleted--} and replacement text {++added++}. This can also be
combined into {~~one~>a single~~} operation. {==Highlighting==} is also
possible {>>and comments can be added inline<<}.
{==
Formatting can also be applied to blocks by putting the opening and closing
tags on separate lines and adding new lines between the tags and the content.
==}
Text can be deleted and replacement text
added. This can also be combined into
onea single operation.
Highlighting is also possible
and comments can be added inline.
Formatting can also be applied to blocks by putting the opening and closing tags on separate lines and adding new lines between the tags and the content.
Highlighting text
Text can be highlighted with a simple syntax, which is more convenient that directly using the corresponding
mark
, ins
and del
HTML tags:
- This was marked
- This was inserted
This was deleted
Sub- and superscripts
Text can be sub- and
superscripted with a simple syntax, which is more convenient than directly
using the corresponding sub
and sup
HTML tags:
- H2O
- ATA
Adding Title to Code Bocks
Adding keyboard keys
Keyboard keys can be rendered with a simple syntax. Consult the Python Markdown Extensions documentation to learn about all available shortcodes:
Ctrl+Alt+Del
Sometimes, it's desirable to group alternative content under different tabs, e.g. when describing how to access an API from different languages or environments.
Code blocks are one of the primary targets to be grouped, and can be considered a special case of content tabs, as tabs with a single code block are always rendered without horizontal spacing:
=== "C"
``` c
#include <stdio.h>
int main(void) {
printf("Hello world!\n");
return 0;
}
```
=== "C++"
``` c++
#include <iostream>
int main(void) {
std::cout << "Hello world!" << std::endl;
return 0;
}
```
Grouping other content
When a content tab contains more than one code block, it is rendered with horizontal spacing. Vertical spacing is never added, but can be achieved by nesting tabs in other blocks:
=== "Unordered list"
* Sed sagittis eleifend rutrum
* Donec vitae suscipit est
* Nulla tempor lobortis orci
=== "Ordered list"
1. Sed sagittis eleifend rutrum
2. Donec vitae suscipit est
3. Nulla tempor lobortis orci
- Sed sagittis eleifend rutrum
- Donec vitae suscipit est
- Nulla tempor lobortis orci
- Sed sagittis eleifend rutrum
- Donec vitae suscipit est
- Nulla tempor lobortis orci
Embedded content
When [SuperFences] is enabled, content tabs can contain arbitrary nested content, including further content tabs, and can be nested in other blocks like [admonitions] or blockquotes:
Data tables can be used at any position in your project documentation and can contain arbitrary Markdown, including inline code blocks, as well as [icons and emojis]:
| Method | Description |
| ----------- | ------------------------------------ |
| `GET` | :material-check: Fetch resource |
| `PUT` | :material-check-all: Update resource |
| `DELETE` | :material-close: Delete resource |
Method | Description |
---|---|
GET |
Fetch resource |
PUT |
Update resource |
DELETE |
Delete resource |
Column alignment
If you want to align a specific column to the left
, center
or right
, you
can use the [regular Markdown syntax] placing :
characters at the beginning
and/or end of the divider.
| Method | Description |
| :---------- | :----------------------------------- |
| `GET` | :material-check: Fetch resource |
| `PUT` | :material-check-all: Update resource |
| `DELETE` | :material-close: Delete resource |
Method | Description |
---|---|
GET |
Fetch resource |
PUT |
Update resource |
DELETE |
Delete resource |
| Method | Description |
| :---------: | :----------------------------------: |
| `GET` | :material-check: Fetch resource |
| `PUT` | :material-check-all: Update resource |
| `DELETE` | :material-close: Delete resource |
Method | Description |
---|---|
GET |
Fetch resource |
PUT |
Update resource |
DELETE |
Delete resource |
| Method | Description |
| ----------: | -----------------------------------: |
| `GET` | :material-check: Fetch resource |
| `PUT` | :material-check-all: Update resource |
| `DELETE` | :material-close: Delete resource |
Method | Description |
---|---|
GET |
Fetch resource |
PUT |
Update resource |
DELETE |
Delete resource |
Footnotes are a great way to add supplemental or additional information to a specific word, phrase or sentence without interrupting the flow of a document. Material for MkDocs provides the ability to define, reference and render footnotes.
Adding footnote references
A footnote reference must be enclosed in square brackets and must start with a
caret ^
, directly followed by an arbitrary identifier, which is similar to
the standard Markdown link syntax.
Lorem ipsum[^1] dolor sit amet, consectetur adipiscing elit.[^2]
[^1]: Lorem ipsum dolor sit amet, consectetur adipiscing elit.
[^2]:
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nulla et euismod
nulla. Curabitur feugiat, tortor non consequat finibus, justo purus auctor
massa, nec semper lorem quam in massa.
InlineHilite is an inline code highlighter inspired by CodeHilite.
Here is some code: `#!py3 import pymdownx; pymdownx.__version__`.
The mock shebang will be treated like text here: ` #!c++ int test = 0; `.
Here is some code: import pymdownx; pymdownx.__version__
.
The mock shebang will be treated like text here: #!c++ int test = 0;
.
Testing Your Guide¶
If you have MkDocs installed, you can test your guide locally by running the following command:
mkdocs serve
This starts a local web server that you can use to view your guide. You can then visit http://localhost:8000
in your web browser to view your guide. This is useful for testing links, images, and other formatting.
What Happens Next?¶
Once you have created your pull request, it will be reviewed by a member of the documentation team or an rA Repository Maintaner. If your pull request is approved, it will be merged into the default (master
) branch and after a few moments will be pushed automatically as a HTML file to the Guides website.
If your pull request is not approved, you will be given feedback on what needs to be changed before it can be merged.