Markdown is a syntax designed for the web to easy-to-read and easy-to-write. It's not intended to replace HTML, but it focuses on replacing subset of frequently used HTML tags with natural manner of writing. As John Gruber wrote "HTML is a publishing format. Markdown is a writing format."
Additional Links:
Markdown for Sitecore implements Markdown and nearly all the enhanced features in Markdown Extra.
Markdown Features
Headings
Creating the <H1> family of markup.
H1 w/ underline
===========
### H2 w/ dashed-underline
# H1
## H2
### H3
#### H4
##### H5
###### H6
Paragraphs
Paragraphs are created on line returns with spaces. Just like you'd expect
I really like Sitecore.
I really like not typing HTML. Imagine that.
Strong & Emphasis
In the modern web we defer to strong and em tags to give extra meaning to text. In a simpler time we called them bold and italtics.
Enclose content in matching asterisks or underscores for <em>'s and double asterisks or underscores for <strong>'.
Be sure *italicize* this word instead of using air quotes. What do you mean _air quotes_?
Now that is a **bold** statement. I really __mean it__.
Links
Links can be relative or absolute.
I love when [multiple words are used a link](http://getfishtank.ca/).
When I'm linking within our site I use [relative urls](/blog).
They can also use links by reference which allows to treat them as variables.
I want [this to link to google][googleurl] and [this too](googleurl).
Put this on it's own line anywhere in your Markdown field.
[googleurl]: https://www.google.com/
Markdown for Sitecore also allows to specify some additional properties for how to handle your links. These are configured in the Source property of Markdown field used in Sitecore.
Attribute | Description |
---|---|
newwindowforexternallinks | External links are assigned target="_blank" |
newwindowforlocallinks | Site links are assigned target="_blank" |
nofollowlinks | Adds a rel="nofollow" to links |
Images
The <img /> can be expressed inline or by reference just like links.
![Alt text for the image](http://getfishtank.ca/gone-fishing.jpg "Optional title")
![Relative Image](/gone-fishing.jpg)
![Image By Referenece][Logo]
[Logo] http://placehold.it/250x200
[Banner] http://placehold.it/800x300 "Optional title"
Markdown for Sitecore also allows to declare a css class to be added to all images with a title. This is configured using the Source property on the field.
Attribute | Description |
---|---|
htmlclasstitledimages | CSS class applied to title images (requires extra mode) |
Markdown Extra Features
To enable Markdown Extra features the Source of the Markdown field must contain extramode=1. See the Markdown for Sitecore setup documentation for more info.
Markdown Inside HTML
This allows you to use Markdown syntax inside of html blocks should it suit your fancy.
<p markdown="1">
I have a **strong** opinion about this.
</p>
Code Blocks
Writing some code or something technical? Make sure the number of ~ match above and below.
~~~~
public void HighFive(Person peeps) { // execute high five }
~~~~
And it will output:
<pre><code>
public void HighFive(Person peeps) { // execute high five }
</code></pre>
Tables
Tables! Tables! Tables! One of my least things to create in HTML is now pretty simple.
Traditional table below.
Column A|Column B|Column C
======|====|======
Yes|No|No
No|Yes|No
No|No|No
Use the colons underneath row headings to align left, center & right.
Left Aligned|Center Aligned|Right Aligned
:===========|:============:|=============:
Yes|No|No
No|Yes|No
No|No|No
Some extra unnecessary formatting to make it look more like a table
|Column 1|Column 2|
|========|========|
|One |Two |
Defintion Lists
While they're not commonly used, definitions lists are a great fit for certain content... like lists of definitions.
There must be an empty line between definitions. There must be a space following the colon.
### Favorite Fruits
Apple
: Crunchy fruit that grows on trees.
Orange
: Delicious sweet fruit. Ironically not found in orange juice.
A new paragraph about fruit.
Abbreviations
Create an abbreviation anywhere in your Markdown field and any uses of it in your content will get transformed into the <abbr> tag.
*[GSA]: Google Search Appliance
The functionality of the GSA is extremely limited when compared to Coveo.
This gets transformed into:
<p>The the functionality of the <abbr title="Google Search Appliance">GSA</abbr> is extremely limited when compared to Coveo.</p>
More Documentation
For additional examples please see Daring Fireball's and Markdown Extra's documentation. Please leave your thoughts in the comments. Thanks!