Markdown is a way to format your text to add bold and italic text, images, headings and a few other things, without having to use HTML.
To create italic text, surround one or a few words with stars:
This is how you create *italic text*.
To create bold text, surround one or a few words with double stars:
This is how you create **bold text**.
If you have to, you can make your text both bold and italic:
This is how you create ***bold and italic text***.
Create bullet lists using stars:
* Item 1 * Item 2 * Item 3
Will look like this:
You can also use plus (+) or minus (-) instead of a star.
Create a numbered lists using number and dot:
1. Item 1 2. Item 2 3. Item 3
Will look like this:
You can also use plus (+) or minus (-) instead of a star.
Combine brackets and parenthesis to create links in the text. It's quite simple:
Here's [a great search engine](http://www.google.com). It'll float your boat.
Will look like this:
Here's a great search engine. It'll float your boat.
Markdown has support for different levels of headers using the hash sign (#):
# This is the title Here's some very good boiler plate text. I don't even know what a boiler is, even less a plate. ## This is the subheader Subheaders are awesome. Even better than you think. ### This is the third level header. And so on.
Will look like this:
This is the title
Here's some very good boiler plate text. I don't even know what a boiler is, even less a plate.
This is the subheader
Subheaders are awesome. Even better than you think.
This is the third level header.
And so on.
When converted to HTML, the first level header will be a <h1>
element, a third level header will be a <h3>
, etc. At SimpleEditions there's only one first level header per page, namely the title (in this case, it's "Markdown: An introduction", a bit further up). Therefore, you typically always begin with a second level header (## Like this) when you write your tutorial text.
Add a greater-than sign (>) in front of anything you are quoting, and the text will be moved slightly towards the middle.
> "Never increase, beyond what is necessary, > the number of entities required to explain anything." > – *William Ockham*
Will look like this:
"Never increase, beyond what is necessary,
the number of entities required to explain anything."
– William Ockham
Note how the name, William Ockham, is surrounded by stars to make it render in italic text.
This tutorial only cover the basics of Markdown, but there are a few more tricks available.
Steps for to add a page.
Go to the pages page by clicking on "Pages" in the top navigation
<%= image_tag "burp/adding-a-page-1.png", :class => "img-polaroid" %>Click the "Add page" link
<%= image_tag "burp/adding-a-page-2.png", :class => "img-polaroid" %>Enter the Title of the page and its Path and then click the "Save" button. The Path is the address to the page. http://yourdomain.com/latest-news
<%= image_tag "burp/adding-a-page-3.png", :class => "img-polaroid" %>You can now find the new page in the pages list.
<%= image_tag "burp/adding-a-page-4.png", :class => "img-polaroid" %>Steps for removing a page.
Go to the pages page by clicking on "Pages" in the top navigation
<%= image_tag "burp/remove-a-page-1.png", :class => "img-polaroid" %>Click on the page you wish to remove. In the example we click on "News"
<%= image_tag "burp/remove-a-page-2.png", :class => "img-polaroid" %>Click the "Remove" button.
<%= image_tag "burp/remove-a-page-3.png", :class => "img-polaroid" %>You can see that the "News" page is no longer in the list.
<%= image_tag "burp/remove-a-page-4.png", :class => "img-polaroid" %>Steps for changing the title and path of a page.
Go to the pages page by clicking on "Pages" in the top navigation
<%= image_tag "burp/change-page-title-1.png", :class => "img-polaroid" %>Click on the page you wish to change. In the example we click on "News"
<%= image_tag "burp/change-page-title-2.png", :class => "img-polaroid" %>Enter the new title and path and click the "Save" button.
<%= image_tag "burp/change-page-title-3.png", :class => "img-polaroid" %>You can see in the list that the page title and path has changed.
<%= image_tag "burp/change-page-title-4.png", :class => "img-polaroid" %>Go to the "Pages" page.
<%= image_tag "burp/enter-page-edit-mode-1.png", :class => "img-polaroid" %>Click "Go to page" on page you wish to edit.
<%= image_tag "burp/enter-page-edit-mode-2.png", :class => "img-polaroid" %>Press Ctrl + Esc on the keybord to open the admin bar.
<%= image_tag "burp/enter-page-edit-mode-3.png", :class => "img-polaroid" %>You can now see the admin bar at the bottom of the page.
<%= image_tag "burp/enter-page-edit-mode-4.jpg", :class => "img-polaroid" %>Click the "Edit text" button.
<%= image_tag "burp/change-the-text-1.png", :class => "img-polaroid" %>Enter the some text. Its a Markdown texteditor so it understand both Markdown syntax and HTML syntax. Both are equaly valid to use.
<%= image_tag "burp/change-the-text-2.png", :class => "img-polaroid" %>Click the "Save" button.
<%= image_tag "burp/change-the-text-3.png", :class => "img-polaroid" %>Click the "Pictures" button.
<%= image_tag "burp/add-image-1.png", :class => "img-polaroid" %>Drag and drop the image you wish to add.
Click the "Save" button.
<%= image_tag "burp/add-image-5.png", :class => "img-polaroid" %>Click the "Pictures" button.
<%= image_tag "burp/remove-image-1.png", :class => "img-polaroid" %>Drag and drop the image you wish to remove onto the "Drop here to remove" area.
Click the "Save" button.
<%= image_tag "burp/add-image-5.png", :class => "img-polaroid" %>