Skip to content

Latest commit

 

History

History
233 lines (166 loc) · 4.67 KB

markdown-cheat-sheet.md

File metadata and controls

233 lines (166 loc) · 4.67 KB
Raw

This is intended as a quick reference and showcase.

Table of Contents

Headers


# H1
## H2
### H3
#### H4
##### H5
###### H6

Emphasis


*This text will be italic*
_This will also be italic_
**This text will be bold**
__This will also be bold__
*You **can** combine them*

Strikethrough uses two tildes. ~~Scratch this.~~

Lists



#### Unordered

* Item 1
* Item 2
* Item 2a
* Item 2b

#### Ordered

1. Item 1
2. Item 2
3. Item 3
* Item 3a
* Item 3b

Links

URLs and URLs in angle brackets will automatically get turned into links. There are diferent types of links:

  1. External links. Use absolute URL: [external](http://google.com).

  2. Anchor in the same page: [link text](#validate-your-manifestjson)

  3. Link to a page in the same section/folder: [link text](page-name#validate-your-manifestjson)

  4. Link to a page in different section/folder: [link text](../api/page-name#validate-your-manifestjson)

Images

If you want to display images in the site you can do it in two ways:

  1. upload files directly to the repo using the "upload files" button. make sure to upload it to the overwolf.github.io/docs/assets folder.

  2. Upload files to online services like https://imgur.com.

add images Inline-style: (hover to see the title text):



![alt-text](assets/app-creation-process.svg)

Or use HTML if you want to customize the size or other styles:

<img src="../assets/app-creation-process.svg" alt="process" width="800"/>

Image Gallery

You can create an image gallery. When you click on an image it will popup in a light box. Each image can be linked to YouTube video or larger image.

<div class="box" data-slick='{"slidesToShow": 2}'>
  <a data-fancybox="gallery" data-caption="LoLwiz" href="../assets/transparent-window.png">
    LoLwiz
    <span class="thumb">
      <img src="../assets/transparent-window.png" alt="DotaPlus">
    </span>
  </a>
  <a data-fancybox="gallery" data-caption="PUBG Tracker" href="https://www.youtube.com/watch?v=xiG_cCI9s-E">
    PUBG Tracker
    <span class="thumb">
      <img src="http://img.youtube.com/vi/xiG_cCI9s-E/maxresdefault.jpg" alt="DotaPlus">
    </span>
  </a>
</div>

Blockquotes



Regular blockquotew:

>

Supported admonition types are: caution, note, important, tip, warning.

:::note This is my custom title
A note.
:::

:::caution
A caution.
:::

:::important
An important.
:::

:::tip
A tip.
:::

:::warning
A warning.
:::

Backslash Escape

Markdown allows you to use backslash escapes to generate literal characters which would otherwise have special meaning in Markdown’s formating syntax.


\*literal asteriks\*

Markdown provides backslash escapes for the following characters:

\ backslash
` backtick
* asterisk
_ underscore
{} [] braces
() parentheses
# hash mark
+ plus sign
- minus sign (hyphen)
. dot
! exclamation mark

Code Blocks

Inline code has back-ticks around it. Example:


`getAround()`

And code blocks like that:


```js
var s = "JavaScript syntax highlighting";
alert(s);
```
Or:

```json
 { "icon": "IconMouseOver.png" }
```

To add code blocks that contain links, please put this line one the top of the page, right after the sidebar_label section:

<script>hljs.initHighlightingOnLoad();</script>

And define your code block using this tags:

<pre lang="no-highlight"><code>

Tables

You can create tables by assembling a list of words and dividing them with hyphens - (for the first row), and then separating each column with a pipe | :



| Tables        | Are           | Cool  |
| ------------- |:-------------:| -----:|
| col 3 is      | right-aligned | $1600 |
| col 2 is      | centered      |   $12 |
| zebra stripes | are neat      |    $1 |

Inline HTML

You can also use raw HTML in your Markdown, and it'll mostly work pretty well.

Line Breaks

My basic recommendation for learning how line breaks work is to experiment and discover -- hit once (i.e., insert one newline), then hit it twice (i.e., insert two newlines), see what happens.