A Markdown Primer

Using Markdown allows you to write in an easy-to-read plain-text format which is automatically converted into HTML. Markdown is powerful enough to do just about anything you need it to, and the resulting HTML is compatible with pretty much every device out there.

Markdown is a cinch to learn. You can use the cheat sheet below to familiarize yourself with the most commonly used elements.

Paragraphs

A line break equals a line break. Two line breaks will make a new paragraph. To create separate paragraphs, simply leave a blank line between blocks of text.

This is one paragraph, and it's amazing.

And this is another paragraph!
RESULT

This is one paragraph, and it's amazing.

And this is another paragraph!

Headings

Create headings by placing 1 to 6 hashes # in front of your header text. Use 1 # for an H1 (the biggest), use 2 ## for an H2 (the next biggest), and so on.

# This is an H1
## This is an H2
###### This is an H6
RESULT

This is an H1

This is an H2

This is an H6

Text Styling

Emphasis

Wrap text in asterisks * to italicize it. Put double asterisks ** around text to make it bold.

Hey, here is something *italicized* and here is some other thing **bold**.
RESULT

Hey, here is something italicized and here is some other thing bold.

Alternatively, you can use underscores _ instead of asterisks *. This can help with double-styling pieces of text.

__I want this whole sentence bold, but only *this part* to be italicized and bold.__ This part won't have any emphasis added.
RESULT

I want this whole sentence bold, but only this part to be italicized and bold. This part won't have any emphasis added.

Deletion

Wrap your text in double tildes ~~ to add a strikethrough.

I would love to make ~~a game~~ money.
RESULT

I would love to make a game money.

Create a link by wrapping square brackets [ ] around the clickable text. Put the URL immediately after that in parantheses ( ).

Check out [this link](http://gamejolt.com)!
RESULT

Check out this link!

Also, any text that is not wrapped but looks like a link will automatically become one. Cool, huh?

Head on over to http://gamejolt.com
RESULT

Head on over to http://gamejolt.com

Images

You can add an image from the web to your comment using this format:

![alt text](//help.gamejolt.com/app/img/111o2di.gif)
RESULT

alt text

Start the line with an exclamation point ! followed by some alt text in brackets [ ]. Next comes the image's URL in parentheses ( ).

The alt text should be a very brief description of the image. It's used by search engines and in some cases when images are not displayed, such as when a visually impaired person uses a screen reader.

Lists

Make lines of text into a bulleted list by placing a dash - or an asterisk *, followed by a space, before each line.

- This is a list item.
- Another list item.
* Still part of the list.
RESULT
  • This is a list item.
  • Another list item.
  • Still part of the list.

Numbered Lists

Make a numbered list by simply starting each line with a number followed by a period . and a space.

1. This is the first item.
1. This is the second item.
1. Notice that we can use any number...
4. and the list will automatically be renumbered correctly.
RESULT
  1. This is the first item.
  2. This is the second item.
  3. Notice that we can use any number...
  4. and the list will automatically be renumbered correctly.

Block Quotes

You can create block quotes by prefixing lines with angle brackets >.

> This is a block quote.

> And this is still part of the block quote.
> > You can even nest block quotes within one another!
RESULT

This is a block quote.

And this is still part of the block quote.

You can even nest block quotes within one another!

Tables

Create a table by assembling a list of words and separating each column with a pipe |. Separate the first row (the column headers) from the other rows with a series of hyphens -.

First Header  | Second Header
------------- | -------------
Content Cell  | Content Cell
Content Cell  | Content Cell
RESULT
First Header Second Header
Content Cell Content Cell
Content Cell Content Cell

For aesthetic purposes, you can also add extra pipes on the ends.

| First Header  | Second Header |
| ------------- | ------------- |
| Content Cell  | Content Cell  |
| Content Cell  | Content Cell  |
RESULT
First Header Second Header
Content Cell Content Cell
Content Cell Content Cell

Note that the hyphens at the top don't need to match the length of the header text.

| Name | Description          |
| ------------- | ----------- |
| Help      | Display the help window.|
| Close     | Closes a window     |
RESULT
Name Description
Help Display the help window.
Close Closes a window

You can also include other pieces of Markdown such as links, bold, italics, or strikethroughs.

| Name | Description          |
| ------------- | ----------- |
| Help      | ~~Display the~~ help window.|
| Close     | _Closes_ a window     |
RESULT
Name Description
Help Display the help window.
Close Closes a window

Finally, by adding colons : to lines of hyphens, you can make all text in the column left-aligned, right-aligned, or center-aligned.

| Left-Aligned  | Center Aligned  | Right Aligned |
| :------------ |:---------------:| -----:|
| col 3 is      | some wordy text | $1600 |
| col 2 is      | centered        |   $12 |
RESULT
Left-Aligned Center Aligned Right Aligned
col 3 is some wordy text $1600
col 2 is centered $12

A colon on the left side indicates a left-aligned column; a colon on the right side indicates a right-aligned column; a colon on both sides indicates a center-aligned column.

Horizontal Lines

You can add a horizontal separator line between sections of content by placing three or more hyphens -, asterisks *, or underscores _ on a line by themselves.

This is a bit of text.

***

Separated, oh no!
RESULT

This is a bit of text.


Separated, oh no!

Code

Inline Code

You can add inline code tags to any piece of text by putting a backtick ` on each side. The designated text will be displayed using a special fixed-width font.

Tweet out jam activity with the hashtag `#blahjam` if you want to be nice.
RESULT

Tweet out jam activity with the hashtag #blahjam if you want to be nice.

Fenced Code

You can create a fenced block of code by preceding it and following it with a line of three apostrophes `.

And here's how you annoy someone with JavaScript...

```
while ( true ) {
confirm( 'Do you like turtles?' );
}
```
RESULT

And here's how you annoy someone with JavaScript...

while ( true ) {
confirm( 'Do you like turtles?' );
}

Spoilers

Hide spoilers by adding an angle bracket and an exclamation point >! before each line of text.

You can use other Markdown elements within the spoiler.

Sorry, but spoilers don't work yet on jam pages.

>! This is a spoiler.

>! Still spoiling!

Not a spoiler.

>! Spoilers are **cool**. Here, have some:

>! - It was all just a dream.
>! - He was dead the whole time!
>! - They were really the same person.
>! - Rosebud's a sled.

RESULT
This is a spoiler.

Still spoiling!

Not a spoiler.

Spoilers are cool. Here, have some:

  • It was all just a dream.
  • He was dead the whole time!
  • They were really the same person.
  • Rosebud's a sled.