Skip to main content
Craft CMS Meta

Markdown help

collapse | the above section is quoted for convenience from the full editing help, below.

Indent four spaces to create an escaped <pre> <code> block:

    printf("%d\n", 42);  /* what was the
                            question again? */

You can also select text and press CTRL+K to toggle indenting as code.

The text will be wrapped in tags, and displayed in a monospaced font. The first four spaces will be stripped off, but all other whitespace will be preserved.

Markdown and HTML are ignored within a code block:

    <blink>
       You would hate this if it weren't
       wrapped in a code block.
    </blink>

Instead of using indentation, you can also create code blocks by using “code fences”, consisting of three or more backticks or tildes:

```
alert(false);
```

~~~
alert(true);
~~~

Use backticks to create an inline <code> span:

The `$` character is just a shortcut for `window.jQuery`.

(The backtick key is in the upper left corner of most keyboards.)

Like code blocks, code spans will be displayed in a monospaced font. Markdown and HTML will not work within them. Note that, unlike code blocks, code spans require you to manually escape any HTML within!

If your code itself contains backticks, you may have to use multiple backticks as delimiters:

The name ``Tuple`2`` is a valid .NET type name.

End a line with two spaces to add a <br/> linebreak:

How do I love thee?  
Let me count the ways

*This is italicized*, and so is _this_.
**This is bold**, and so is __this__.
Use ***italics and bold together*** if you ___have to___.

You can also select text and press CTRL+I or CTRL+B to toggle italics or bold respectively.

There are three ways to write links. Each is easier to read than the last:

Here's an inline link to [Google](https://www.google.com/).
Here's a reference-style link to [Google][1].
Here's a very readable link to [Yahoo!][yahoo].

  [1]: https://www.google.com/
  [yahoo]: https://www.yahoo.com/

You can also select text and press CTRL+L to make it a link, or press CTRL+L with no text selected to insert a link at the current position.

The link definitions can appear anywhere in the document -- before or after the place where you use them. The link definition names [1] and [yahoo] can be any unique string, and are case-insensitive; [yahoo] is the same as [YAHOO].

Links can have a title attribute, which will show up on hover. Title attributes can also be added; they are helpful if the link itself is not descriptive enough to tell users where they're going.

Here's a <span class="bg-black-300">[poorly-named link](https://www.google.com/ "Google")</span>.
Never write "[click here][^2]".
Visit [us][web].
  [^2]: https://www.w3.org/QA/Tips/noClickHere
        (Advice against the phrase "click here")
  [web]: https://craftcms.meta.stackexchange.com/ "Craft CMS Meta Stack Exchange"

You can also use standard HTML hyperlink syntax.

<a href="https://example.com" title="example">example</a>

We have modified our Markdown parser to support "naked" URLs (in most but not all cases -- beware of unusual characters in your URLs); they will be converted to links automatically:

I often visit https://example.com.

Force URLs by enclosing them in angle brackets:

Have you seen <https://example.com>?

URLs can be relative or full.

Underline text to make the two <h1> <h2> top-level headers :

Header 1
========
Header 2
--------

You can also select text and press CTRL+H to step through the different heading styles.

The number of = or - signs doesn't matter; one will work. But using enough to underline the text makes your titles look better in plain text.

Use hash marks for several levels of headers:

# Header 1 #
## Header 2 ##
### Header 3 ###

The closing # characters are optional.

Insert a horizontal rule <hr/> by putting three or more hyphens, asterisks, or underscores on a line by themselves:

---

You can also press CTRL+R to insert a horizontal rule.

Rule #1
---
Rule #2
*******
Rule #3
___

Using spaces between the characters also works:

Rule #4
- - - -

You can also press CTRL+R to insert a horizontal rule.

A bulleted <ul> list:

- Use a minus sign for a bullet
+ Or plus sign
* Or an asterisk

A numbered <ol> list:

1. Numbered lists are easy
2. Markdown keeps track of the numbers for you
7. So this will be item 3.

You can also select text and press CTRL+U or CTRL+O to toggle a bullet or numbered list respectively.

A double-spaced list:

- This list gets wrapped in <p> tags
 
- So there will be extra space between items

To put other Markdown blocks in a list; just indent four spaces for each nesting level:

1. Lists in a list item:
    - Indented four spaces.
        * indented eight spaces.
    - Four spaces again.

1. Lists in a list item:
    - Indented four spaces.
        * indented eight spaces.
    - Four spaces again.
2.  Multiple paragraphs in a list items:
    It's best to indent the paragraphs four spaces
    You can get away with three, but it can get
    confusing when you nest other things.
    Stick to four.
 
    We indented the first line an extra space to align
    it with these paragraphs. In real use, we might do
    that to the entire list so that all items line up.
 
    This paragraph is still part of the list item, but it looks messy to humans. So it's a good idea to wrap your nested paragraphs manually, as we did with the first two.
 
3. Blockquotes in a list item:
 
    > Skip a line and
    > indent the >'s four spaces.
 
4. Preformatted text in a list item:
 
        Skip a line and indent eight spaces.
        That's four spaces for the list
        and four to trigger the code block.

Add a > to the beginning of any line to create a blockquote.

> The syntax is based on the way email programs
> usually do quotations. You don't need to hard-wrap
> the paragraphs in your blockquotes, but it looks much nicer if you do.  Depends how lazy you feel.

You can also select text and press CTRL+Q to toggle a blockquote.

To put other Markdown blocks in a blockquote, just add a > followed by a space.

To put other Markdown blocks in a blockquote, just add a > followed by a space:

> The `>` on the blank lines is required
> to create a single blockquote.
> 
> If you leave out the extra `>`
> you will end up with
> two distinct blockquotes.

Blockquotes within a blockquote:

> A standard blockquote is indented
> > A nested blockquote is indented more
> > > > You can nest to any depth.

Lists in a blockquote:

> - A list in a blockquote
> - With a &gt; and space in front of it
>    * A sublist

Preformatted text in a blockquote:

>     Indent five spaces total.  The first
>     one is part of the blockquote designator.

Images are exactly like links, but they have an exclamation point in front of them:

![Valid XHTML](https://w3.org/Icons/valid-xhtml10).

You can also press CTRL+G to insert an image.

The word in square brackets is the alt text, which gets displayed if the browser can't show the image. Be sure to include meaningful alt text for screen-reading software.

Just like links, images work with reference syntax and titles:

This page is ![valid XHTML][checkmark].

[checkmark]: https://w3.org/Icons/valid-xhtml10
             "What are you smiling at?"

Note: Markdown does not currently support the shortest reference syntax for images:

Here's a broken ![checkmark].

But you can use a slightly more verbose version of implicit reference names:

This ![checkmark][] works.

The reference name is also used as the alt text.

You can also use standard HTML image syntax, which allows you to scale the width and height of the image.

<img src="https://example.com/sample.png" width="100" height="100">

URLs can be relative or full.

If you need to do something that Markdown can't handle, use HTML. Note that we only support a very strict subset of HTML!

 To reboot your computer, press <kbd>ctrl</kbd>+<kbd>alt</kbd>+<kbd>del</kbd>.

Markdown is smart enough not to mangle your span-level HTML:

<b>Markdown works *fine* in here.</b>

Block-level HTML elements have a few restrictions:

  1. They must be separated from surrounding text by blank lines.
  2. The begin and end tags of the outermost block element must not be indented.
  3. Markdown can't be used within HTML blocks.
<pre>
    You can <em>not</em> use Markdown in here.
</pre>

Need More Detail?

Visit the official CommonMark specification.


Stack Exchange additions

The following sections describe some additional features for text formatting that aren't officially part of CommonMark.

To talk about a tag on Craft CMS Meta Stack Exchange, like-this, use 

See the many questions tagged [tag:elephants] to learn more.

The tag will automatically be linked to the corresponding tag page.

For tags on this meta site, use this syntax:

There's a [meta-tag:feature-request] tag for that.

To hide a certain piece of text and have it only be visible when a user clicks it, use the blockquote syntax with an additional exclamation point: 

At the end of episode five, it turns out that
>! he's actually his father.

Code blocks can be highlighted using highlight.js. In many cases, the syntax highlighting language will be inferred from the question's tags.

To manually specify the language of a fenced code block, add the language to the line with the opening fence: 

``` lang-js
setTimeout(function () { alert("JavaScript"); }, 1000);
```

You can use either one of the supported language codes, like lang-cpp or lang-sql, or you can specify a tag, and the syntax highlighting language associated with this tag will be used.

To specify a syntax highlighting language to be used not only for the next, but for all following code blocks, use: 

<!-- language-all: lang-html -->

To specify that you don't want any syntax highlighting for a code block, use: 

<!-- language: lang-none -->

Our support for tables is based on the GitHub-flavored markdown table extension specification.

| A header | Another header |
| -------- | -------------- |
| First    | row            |
| Second   | row            |

Alignment

You can set the alignment of a table column by including a : in the corresponding cell of the separator line. A : on the left will make a column left-aligned (this is the default). A : on the right will make it right-aligned. Both left and right :s will produce a center-aligned column.

| left | center | right |
|:---- |:------:| -----:|
| One  | Two    | Three |

Syntax details

  • A header row is required and must be followed by a separator row with the same number of cells
  • Cells are separated by a pipe (|) symbol
  • Leading and trailing pipes are optional
  • Spacing and the - characters don’t have to line up visually

Comments support only bold, italic, code and links; in addition, a few shorthand links are available.

_italic_ and **bold** text,
inline `code in backticks`,
and [basic links](https://example.com).

Supported shorthand links:

  • [meta] – link to the current site's Meta; link text is the site name (e.g. "Super User Meta"). Does nothing if the site doesn't have (or already is) a Meta site.

  • [main] – like [meta], just the other way around.

  • [edit] – link to the edit page for the post the comment is on, i.e. /posts/{id}/edit. Link text is "edit" (capitalization is respected).

  • [tag:tagname] and [meta-tag:tagname] – link to the given tag's page. Link text is the name of the tag.meta-tag only works on meta sites.

  • [help], [help/on-topic], [help/dont-ask], [help/behavior] and [meta-help] – link to frequently visited pages of the help center. Link text is "help center" (capitalization is respected). All links point to the main site.

  • [tour] – link to the Tour page. Link text is "tour" (capitalization is respected).

  • [so], [pt.so], [su], [sf], [metase], [a51], [se] – link to the given site. Link text is the site name.

  • [chat] – link to the current site's chat site, the link text being "{site name} Chat".

  • [ask], [what you are asking], [answer] – link to the How to Ask or How to Answer page.

  • [code block] – link to the markdown editing help page. Link text is "code block".

  • [something.se] – link to something.stackexchange.com, if that site exists. Link text is the site name. Use [ubuntu.se] for Ask Ubuntu.

The owner of the post you're commenting on will always be notified of your comment. If you are replying to someone else who has previously commented on the same post, mention their username: @peter and @PeterSmith will both notify a previous commenter named “Peter Smith”.

It is generally sufficient to mention only the first name of the user whose comment you are replying to, e.g. @ben or @marc. However you may need to be more specific if three people named Ben replied in earlier comments, by adding the first character of the last name, e.g. @benm or @benc Spaces are not valid in comment reply names, so don't use @peter smith, always enter it as @peters or @petersmith.

If the user you're replying to has no natural first name and last name, simply enter enough characters of the name to make it clear who you are responding to. Three is the minimum, so if you're replying to Fantastico, enter @fan, @fant, or @fantastic.

You can use the same method to notify any editor of the post, or – if this is the case – to the Mod moderator who closed the question.