Hello World

6 years ago · 3 MIN READ
#Getting Started 

Welcome to Canvas! I'm your first post demonstrating Markdown integration. Don't delete me, I'm very helpful! If you do delete me though, I can be recovered. Just grab me from:

resources/views/shared/helpers/welcome.blade.php

The Basics

---

Before I tell you about all the extra syntaxes and capabilities you have available to you, I'll introduce you to the basics of standard markdown. If you already know markdown, and want to jump straight to learning about the fancier things I can do, feel free to skip this section. Lets jump right in!

Markdown is a plain text formatting syntax created by John Gruber, aiming to provide a easy-to-read and feasible markup. The original Markdown syntax specification can be found here.

Typography

---

Heading 1

Heading 2

Heading 3

Heading 4

Heading 5

Heading 6

Just put angle brackets around an email and it becomes clickable: [email protected] <[email protected]>

Same thing with urls: http://example.com <http://example.com>

Perhaps you want to some link text like this: Example Website [Example Website](http://example.com "Title") (The title is optional)

Make a link [a link][arbitrary_id] then on it's own line anywhere else in the file: [arbitrary_id]: http://example.com "Title"

If the link text itself would make a good id, you can link like this [like this][], then on it's own line anywhere else in the file: [like this]: http://example.com

Option name	Markup	Result
Intra-word emphasis	Intra-word em\*pha\*sis	Intra-word emphasis
Strikethrough	\~~Strikethrough\~~	Strikethrough
Underline	\_Underline\_	Underline
Quote	\"Quote\"	Quote
Highlight	\==Highlight\==	Highlight
Superscript	Some\^(superscript)	Somesuperscript
Italics	**Italics**	Italics
Bold	*Bold text*	Bold text
HTML Entities	© ƒ ™ ®	© ƒ ™ ®

Tables

---

Markup:

Key | Value
--- | ---
SSH Host | `example.com`
SSH User | `username`
SSH Password | `secret`
Database Host | `127.0.0.1`
Database User | `username`
Database Password | `secret`

Result:

Key	Value
SSH Host	example.com
SSH User	username
SSH Password	secret
Database Host	127.0.0.1
Database User	username
Database Password	secret

Code Blocks

---

Inline code is indicated by surrounding it with backticks: `Inline code`

If your code has `backticks` that need to be displayed, you can use double backticks: ``Code with `backticks` `` (mind the spaces preceding the final set of backticks)

GitHub's fenced code blocks are supported in canvas::

namespace App;

class Canvas extends Blog
{

    /**
    * Dreaming of a world without WordPress?
    *
    * @with  Canvas
    */
    public function create()
    {
        // Make something awesome...
    }
}

You can also use waves (~) instead of back ticks (`):

print('Hello world!')

Lists

---

Markup:

* Lists must be preceded by a blank line (or block element)
* Unordered lists start each item with a `*`
- `-` Works too
* Indent a level to make a nested list
1. Ordered lists are supported.
2. Start each item (number-period-space) like `1.`
42. It doesn't matter what number you use, it will render sequentially

Result:

• Lists must be preceded by a blank line (or block element)
• Unordered lists start each item with a *
• - Works too
• Indent a level to make a nested list
  1. Ordered lists are supported.
  2. Start each item (number-period-space) like 1
  3. It doesn't matter what number you use, it will render sequentially

Block Quotes

---

Markup:

> Angle brackets `>` are used for block quotes.
Technically not every line needs to start with a `>` as long as
there are no empty lines between paragraphs.
> Looks kinda ugly though.
> > Block quotes can be nested.
> > > Multiple Levels
>
> Most markdown syntaxes work inside block quotes.

Result:

Angle brackets > are used for block quotes. Technically not every line needs to start with a > as long as there are no empty lines between paragraphs. Looks kinda ugly though.

Block quotes can be nested.

Multiple Levels

Most markdown syntaxes work inside block quotes.

Horizontal Rules

---

If you type three asterisks ***, you will get a horizontal rule. Three dashes --- will make the same rule.

Task List Syntax

---

1. [x] Support for rendering checkbox list syntax
   • [x] Support for nesting
   • [x] Support for ordered and unordered lists
2. [ ] No support for clicking checkboxes directly in the HTML window

Markdown Extra

---

Canvas supports Markdown Extra, which extends traditional Markdown syntax with some nice features. If you need some help or just want a refresher, read more about Markdown syntax and Markdown Extra.

Hack On

---

That’s about it. The best way to be proficient in anything is to know what tools you have available to you. You're one step ahead of the game now. Happy coding!

···