Introducing Markdown
RapidWeaver 6 introduced a brand new page style to its lineup — Markdown.
Markdown, originally concieved by John Gruber of Daring Fireball, is a plain text formatting syntax designed to be super easy to use. It is popularly used to format content in text editors, for the quick creation of rich documents, readme files, writing messages in online discussion forums and much more.
It is extraordinarily easy to use and really, quite powerful. It's addition to RapidWeaver is both exciting in the here-and-now, as well as for the possibilities of future features throughout the app.
Formatting made easy
Styling your text is simple when writing with Markdown. Once you learn the basics you'll be building content rich pages without your fingers ever leaving the keyboard!
To get you started you can view the Markdown Reference found in RapidWeaver's Page Inspector under the Markdown page's Page Settings tab. You can also find the same basic reference here on Daring Fireball.
Beginning with basics
Some of the most basic styles you can create with Markdown are to bold or italicize text on your page.
Another basic element you can use in designing your page using Markdown is an image. Images are inserted a little bit like links, which we'll see later on further down the page.
Our example above is an image from RapidWeaver's Resources section of the app. And since this theme is responsive it takes this image and makes sure it too is responsive and will size down to fit the content container within the browser.
Lists are easy as pie
Creating a bulleted list is super easy using Markdown. Below is a sample of a simple unordered list. RapidWeaver takes the Markdown you write and turns it into a beautifully formatted list:
- Wonder Woman
- Superman
- Green Lantern
- Batman
- Black Canary
- Nightwing
- Shazam!
You can also easily create a list of links using Markdown, like so:
Quoting text
When writing content you may have call to draw attention to a specific quote or block of text. Markdown makes this quite easy as well. Checkout our blockquote example below to see how you can accomplish this:
Technology is nothing. What's important is that you have a faith in people, that they're basically good and smart, and if you give them tools, they'll do wonderful things with them.
With just one symbol we've applied a blockquote to our text and let the theme style it for us! We can even nest quotes within one another, or include elements like lists within our quote, just going to show how versatile Markdown really is.
Conveying code
We can even give code examples to our visitors using Markdown. If we add 4 spaces to the front of any line Markdown will interpert the content that follows as code and format it accordingly. For example we could display this block of code, without the browser interperting the HTML, just by adding 4 spaces to the start of each line of the code:
<div class="footer">
© 2049 The Foo Bar Corporation
</div>
You'll notice that none of the code above was interperted by the browser and our visitors can see each bit of the code we've opted to show them here.
Blocks of code can also be setup using triple backward ticks both before and after the code block, like so:
<div class="footer">
© 2049 The Foo Bar Corporation
</div>
We can also mark a single block of text as being code using a backwards tick before and after the code. It's output can be inline within a sentence, like so:
Example: The code needs an extra <div></div> container.
Lovely little links
If you thought building lists, quoting text and coveying code was easy, you'll be thrilled at how simple it is to create links in your Markdown pages. Here is a quick example of a text link in a block of type.
To create an inline link we use a set of regular parentheses immediately after the link text’s closing square bracket. Inside the parentheses, put the URL where you want the link to point, along with an optional title for the link, surrounded in quotes.
- This would be an example of a link with a title tag for example.
- You can also create automatic links by surrounding a URL with angle brackets. For example: http://elixirgraphics.com
- In addition you can create email links by placing angle brackets around an email address like so: johnny_appleseed@me.com
There are many other types of links you can create using Markdown as well, so we encourage you to have a look at the Daring Fireball reference page.
Great start
All in all Markdown is an immensely powerful tool, and it being introduced to RapidWeaver is a pretty big deal. We look forward to seeing how this wonderful tool evolves in RapidWeaver.