Markdown Cheat Sheet

Opensource.
com: Markdown Cheat Sheet PAGE 1 OF 2 BY MATT BROBERG
Markdown is the most widely adopted way to format documents using plain text syntax. Here are the essentials.
STYLIZE TEXT TABLES

italic *italic* Tables are a common extension of the official markdown definition (CommonMark).
They can be formatted in quite a lot of ways:
bold **bold**
| Column Title | Another Column | One More |
strikethrough ~~strikethrough~~ |:------------------|:----------|:---------|
| **Bolded text** | Columns don’t need to be aligned | |
code in-line `code in-line` | Or even filled in | | code |
code block ```code block``` Renders as:

Column Title Another Column One More
> text blockquote
bolded text Columns don’t need to be aligned
HEADERS AND BREAKS Or even filled in code
# Text H1 That can be painful to look at. Here’s a prettier example with alignment based on the
placement of the : in the table structure:
## Text H2
| Tables | Are | Cool |
### Text H3 |:---------|:-------------:|-----:|
| col 1 is | left-aligned | $1 |
--- Horizontal Rule | col 2 is | centered | $2 |
| col 3 is | right-aligned | $3 |
LISTS Tables Are Cool

Lists can be unordered or ordered, which is col 1 is left-aligned $1
determined by the symbol used to list them. col 2 is centered $2
Unordered lists have either -, +, or *, while
col 3 is right-aligned $3
ordered lists require any integer followed by
a . or ) character. Tables are always a little tricky to remember. Use available online tools to help build
them, like: https://csvtomd.com
An ordered list:
1. First item LINKS
2. Second item
There are two ways to create links. The most commonly used format includes
3. Third item brackets followed by parentheses: [ ] ( ) . To render a link to an image, begin with a !.
Unordered List: Examples.
- First item [Link inline this way](https://opensource.com)
- Second item [Or add a title for the link](https://opensource.com "Google's Homepage")
[Here is a relative link within a repository](../blob/master/LICENSE)
- Third item
![I link to an image](path/to/image.png)
Combining the two:
The second format involves brackets, [ ][ ] or [ ], followed by a reference formatted
1. First ordered list item with a bracket and colon, [ ]:, anywhere else in the document.
1.
Second ordered list item (which Examples.
shows as 2.)
[Reference-style link][Case-insensitive Reference Text]
1.
(Markdown ignores the written [Numbers are commonly used][1]
number in favor of enumerating
[Text can link on its own as a reference]
by integer)
[case-insensitive reference text]: https://opensource.com
-
Indented lists require four [1]: https://opensource.com
spaces in most specifications
[text can link on its own as a reference]: https://opensource.com
Sublists are implementation
-
specific URLs, in and out of angle brackets, will automatically get turned into links with most
implementations.
-
Try it out and render to be
sure it works Example.
1.
Continuing the list after an Both https://opensource.com and <https://opensource.com> will render as
indentation links, as well as opensource.com on some renderings.
opensource.com Twitter @opensourceway | facebook.com/opensourceway | CC BY-SA 4.0

Opensource.com: Markdown Cheat Sheet PAGE 2 OF 2 BY MATT BROBERG
BEST OF GITHUB FLAVORED MARKDOWN

Task lists are fantastic usage of the GitHub-specific You can also have language-specific syntax highlighting. Instead of
implementation: having a code block of black-and-white text, append the language to
the first set of backticks to have highlighting enabled:
Task List
- [x] Step one is complete <html>
<head>
- [ ] Step two in this unordered list is
<meta content="text/html;charset=utf-8"
- [x] Step three is done as well http-equiv="Content-Type" />
</head>
Renders as:
<body>
Task List <script src='./pkg/my_wasm_library.js'></script>
<script>
 Step one is complete
 window.addEventListener('load', async () => {
// Load the wasm file
 Step two in this unordered list is await wasm_bindgen('./pkg/my_wasm_library_bg.wasm');
 Step three is done as well
 // Once it's loaded the `wasm_bindgen` object is
// populated with the functions defined in our Rust code
Drop-downs are an incredible feature to tidy up files: const greeting = wasm_bindgen.excited_greeting(“Matt”)
console.log(greeting)
<details> });
<summary>Q1: What is the best website in </script>
</body>
the world? </summary>
</html>
A1: Opensource.com
</details> Nearly all programming languages are supported using this syntax
(python, ruby, go, rust, javascript, and java to name a few). See
Renders as a clickable drop-down menu. See the example at GitHub’s documentation for the full list: https://help.github.com/en/
github.com/opensourceway/markdown-example articles/creating-and-highlighting-code-blocks#syntax-highlighting
GITLAB SPECIFIC REFERENCES

GitLab, the second largest Git-based repository on the Internet, has unique You can also design flow diagrams:
global references designed for teamwork.
mermaid
@user_name specific user graph TD;
@group_name specific group A-->B;
A-->C;
@all entire team
B-->D;
#123 issue
C-->D;
!123 merge request
Becomes:
$123 snippet
~123 label by ID
~bug one-word label by name
9ba12248 specific commit
9ba12248...b19a04f5 commit range comparison
[README](doc/Readme) repository file references
/tableflip <comment> Quick reaction that includes (╯°□°)╯ ͡ ┻━┻
THE BEST OF BOTH GITHUB AND GITLAB REFERENCES
Emojis bring both formats together. Use everything

🎉🎉 from :abc: https://commonmark.org/
to :zap: to add emojis to your markdown . https://spec.commonmark.org/0.28/
A searchable list of emoji icons is available at https://github.github.com/gfm/

https://www.webfx.com/tools/emoji-cheat-sheet/ https://docs.gitlab.com/ee/user/markdown.html
opensource.com Twitter @opensourceway | facebook.com/opensourceway | CC BY-SA 4.0

Markdown Cheat Sheet

Uploaded by

Copyright:

Available Formats

Markdown Cheat Sheet

Uploaded by

Document Information

Original Description:

Copyright

Available Formats

Share this document

Share or Embed Document

Sharing Options

Did you find this document useful?

Is this content inappropriate?

Copyright:

Available Formats

Markdown Cheat Sheet

Uploaded by

Copyright:

Available Formats

Opensource.

com: Markdown Cheat Sheet PAGE 1 OF 2 BY MATT BROBERG

STYLIZE TEXT TABLES

code block ```code block``` Renders as:

HEADERS AND BREAKS Or even filled in code

LISTS Tables Are Cool

opensource.com Twitter @opensourceway | facebook.com/opensourceway | CC BY-SA 4.0

BEST OF GITHUB FLAVORED MARKDOWN

GITLAB SPECIFIC REFERENCES

THE BEST OF BOTH GITHUB AND GITLAB REFERENCES

Emojis bring both formats together. Use everything

A searchable list of emoji icons is available at https://github.github.com/gfm/

opensource.com Twitter @opensourceway | facebook.com/opensourceway | CC BY-SA 4.0

You might also like