#Writing Documentation

Daleel uses GitHub Flavored Markdown (GFM). It is rendered using league/commonmark.

#Header Anchors

Daleel automatically generates header anchors for each header. You can link to a header by using the following syntax:

[Code Blocks](#code-blocks)

This will render as: Code Blocks

You can also link to an anchor on another page by using the following syntax:

[Top Level Configuration](/configuration#top-level-configuration)

This will render as: Top Level Configuration

#Links

When linking to an internal page, make sure it starts with a /. This will ensure that the link is relative to the root of the site. Also, omit adding an extension to the link.

For example:

[Check Daleel Usage](/usage)

will render as: Check Daleel Usage

External links will automatically have target="_blank" rel="noopener noreferrer" added to them. They will also have a small icon added to the end of the link.

#Table of Contents

Daleel automatically generates a table of contents for each page. You can see it in action on this page to the right if you are on a desktop.

#Page Title

The page title is automatically generated from the first header on the page. You can add a custom page title by using frontmatter:

---
title: Custom Page Title
---

#Table

You can create a table using the following syntax:

| #   | Country   |     Capital      |  Population |
| --- | --------- | :--------------: | ----------: |
| 1   | USA       | Washington, D.C. | 328,239,523 |
| 2   | Canada    |      Ottawa      |  37,411,047 |
| 3   | Mexico    |   Mexico City    | 126,014,024 |
| 4   | Brazil    |     Brasilia     | 209,469,333 |
| 5   | Argentina |   Buenos Aires   |  44,938,712 |
| 6   | Colombia  |      Bogota      |  50,372,424 |
| 7   | Peru      |       Lima       |  32,510,453 |

This will render as:

Overflow tables will automatically scroll horizontally:

#Code Blocks

Daleel uses commonmark-highlighter to render code blocks.

#input

```php
echo 'Hello World!';
```

```html
<ul>
	<li> Item 1 </li>
	<li> Item 2 </li>
	<li> Item 3 </li>
</ul>
```

#output

echo 'Hello World!';

<ul>
	<li> Item 1 </li>
	<li> Item 2 </li>
	<li> Item 3 </li>
</ul>

#Line Highlighting in Code Blocks

You can highlight a single line in a code block by adding curly braces with the line number {4}

#input

```php{4}
<?php
function helloWorld()
{
	echo 'Hello World!';
}
```

#output

<?phpfunction helloWorld(){	echo 'Hello World!';}

You can also highlight a range of lines by using a hyphen {3-5}

#input

```php{2-4}
<?php
$fruit = [
	'apple',
	'banana',
	'orange',
	'pear',
	'grape',
	'kiwi',
	'pineapple',
];
```

#output

<?php$fruit = [	'apple',	'banana',	'orange',	'pear',	'grape',	'kiwi',	'pineapple',];

Or you can combine the two {3-5,8}:

#input

```php{3-5,8}
<?php
$fruit = [
	'apple',
	'banana',
	'orange',
	'pear',
	'grape',
	'kiwi',
	'pineapple',
];
```

#output

<?php$fruit = [	'apple',	'banana',	'orange',	'pear',	'grape',	'kiwi',	'pineapple',];

#Containers

Daleel comes with a few custom containers that you can utilize to make your documentation more readable.

#input

:::info
This is an info box.
:::

:::tip
This is a tip.
:::

:::warning
This is a warning.
:::

:::danger
This is a dangerous warning.
:::

#output

You can add a custom title to the container by adding it after the container name:

:::info Custom Title
This is an info box with a custom title.
:::

Edit this page