epubjs
Version:
Render ePub documents in the browser, across many devices
352 lines (252 loc) • 11.2 kB
HTML
<html xmlns:epub="http://www.idpf.org/2007/ops" xmlns="http://www.w3.org/1999/xhtml"><head><title>Markdown</title><link rel="stylesheet" type="text/css" href="epub.css"/></head><body data-type="book"><section data-type="chapter" epub:type="chapter" data-pdf-bookmark="Chapter 10. Markdown"><div class="chapter" id="markdownref">
<h1><span class="label">Chapter 10. </span>Markdown</h1>
<p>Atlas supports writing in <a data-original-title="" href="http://daringfireball.net/projects/markdown/syntax" title="">Markdown</a> in addition to HTMLBook. Files ending in “.md”, “.mdown” or “.markdown” will be converted to HTMLBook when building. The <a href="http://daringfireball.net/projects/markdown/syntax">Markdown Syntax Guide</a> has all the details you’ll need. This guide will highlight parts of the Markdown syntax as well as document a few additions to how we use Markdown in Atlas.</p>
<section data-type="sect1" data-pdf-bookmark="Syntax"><div class="sect1" id="idp1213376">
<h1>Syntax</h1>
<section data-type="sect2" data-pdf-bookmark="Headings"><div class="sect2" id="idp1214560">
<h2>Headings</h2>
<p>To insert headings with Markdown, use a number of hash symbols (<code>#</code> ) equal to the heading level. The top heading has one hash (<code>#</code> ) and the smallest heading has six hashes (<code>######</code> ).</p>
<p><strong>Example:</strong></p>
<pre data-original-title="" title="">
# H1
## H2
### H3
#### H4
##### H5
###### H6</pre>
</div></section>
<section data-type="sect2" data-pdf-bookmark="Text Formatting"><div class="sect2" id="idp1219312">
<h2>Text Formatting</h2>
<h3>Italics</h3>
<p>For italic text, surround the text you wish to be italic in single underscores (<code>_</code> ) or single asterisks (<code>*</code> ).</p>
<p><strong>Example:</strong></p>
<pre data-original-title="" data-type="programlisting" title="">
_italic text_ not italic
*italic text* not italic
</pre>
<h3>Bold</h3>
<p>For bold text, surround the text with two underscores (<code>__</code> ) or two asterisks (<code>**</code> )</p>
<p><strong>Example:</strong></p>
<pre data-original-title="" data-type="programlisting" title="">
__bold text__ not bold
**bold text** not bold</pre>
<h3>Strikethrough</h3>
<p>For strikethrough text, surround the text with two tildes (<code>~~</code> ).</p>
<p><strong>Example:</strong></p>
<pre data-original-title="" data-type="programlisting" title="">
~~strike through~~ no strike through
</pre>
</div></section>
<section data-type="sect2" data-pdf-bookmark="Code"><div class="sect2" id="idp1219936">
<h2>Code</h2>
<h3>Inline Code</h3>
<p>For inline code markup, use backticks (<code>`</code> ) around the code text. This will output a <code>code</code> element.</p>
<p><strong>Example:</strong></p>
<pre data-original-title="" data-type="programlisting" title="">
Here is a variable declaration `var x = 3;` in Javascript.
</pre>
<h3>Code Blocks</h3>
<p>There are two options for code blocks. The first is the default Markdown syntax using four spaces to start a code block. Be sure to leave an empty line before and after a code block.</p>
<p><strong>Example: </strong></p>
<pre data-original-title="" data-type="programlisting" title="">
This is regular text.
// This is code
var x = 3;
Back to regular text
</pre>
<p> The other way to make code blocks is to use three backticks (<code>```</code> ) on lines above and below the code. This is referred to as <em>fenced code blocks</em> and is part of <a href="https://help.github.com/articles/github-flavored-markdown#fenced-code-blocks">Github Flavored Markdown</a>.</p>
<p><strong>Example:</strong></p>
<pre data-original-title="" data-type="programlisting" title="">
This is regular text
```
// This is code
var x = 3;
```
Back to regular text
</pre>
<h3>Syntax Highlighting</h3>
<p>Using fenced code blocks you can also specify a language to highlight the code</p>
<pre data-original-title="" data-type="programlisting" title="">
This is regular text
```javascript
// This is code
var x = 3;
```
Back to regular text
</pre>
</div></section>
<section data-type="sect2" data-pdf-bookmark="Links and Images"><div class="sect2" id="idp1231648">
<h2>Links and Images</h2>
<h3>Automatic Linking</h3>
<p>URLs starting with <code>http://</code> will automatically be converted to hyperlinks in appropriate formats. Meaning</p>
<p><strong>Example:</strong></p>
<pre data-original-title="" data-type="programlisting" title="">
This is a link to http://oreilly.com.
</pre>
<p>Will be converted to</p>
<pre data-original-title="" data-type="programlisting" title="">
This is a link to <a href="http://oreilly.com">http://oreilly.com</a>
[Add a title to a link](http://oreilly.com "O'Reilly")</pre>
<h3>Links</h3>
<p>For links that don’t display the URL, first type the text of the link inside of square brackets (<code>[</code> and <code>]</code> ) and then the URL itself surrounded by parentheses.</p>
<p><strong>Example:</strong></p>
<pre data-original-title="" data-type="programlisting" title="">
[This is a link to oreilly.com](http://oreilly.com)</pre>
<p>Will be converted to</p>
<pre data-original-title="" data-type="programlisting" title="">
<a href="http://oreilly.com">This is a link to oreilly.com</a></pre>
</div></section>
<section data-type="sect2" data-pdf-bookmark="Lists"><div class="sect2" id="idp1245856">
<h2>Lists</h2>
<h3>Itemized Lists</h3>
<p>For itemized lists without numbering, type a separate line for each item with one of the following and a space beginning the line: <code>*</code> , <code>-</code> , <code>+</code></p>
<p><strong>Example:</strong></p>
<pre data-original-title="" data-type="programlisting" title="">
- List Item
- Next Item
- Another Item</pre>
<h3>Numbered Lists</h3>
<p>For numbered lists, use numbers followed by a period. If the numbers you use are not sequential they will be converted to be sequential</p>
<p><strong>Example:</strong></p>
<pre data-original-title="" data-type="programlisting" title="">
1. First item
2. Second item
3. Third item
</pre>
<h3>Nested Lists</h3>
<p>To nest a list within another, indent the child list using 4 spaces.</p>
<p><strong>Example:</strong></p>
<pre data-original-title="" data-type="programlisting" title="">
- Parent List
- Another item
- Child List
- Second Item
- One more item
1. You can mix list types
2. With numbered and itemized
</pre>
<h3>Multiparagraph List Items</h3>
<p>Since Markdown uses newlines to delineate the end of elements, to have a multi-paragraph list item, indent the new paragraph to the same level as the start of text in the list item. For more clarity, here is an example.</p>
<p><strong>Example:</strong></p>
<pre data-original-title="" data-type="programlisting" title="">
* A list item.
With multiple paragraphs.
* Bar
</pre>
</div></section>
<section data-type="sect2" data-pdf-bookmark="Blockquotes"><div class="sect2" id="idp1257744">
<h2>Blockquotes</h2>
<p>To represent some text as a blockquote, begin each line of the quote with an angle bracket (<code>></code> ).</p>
<p><strong>Example:</strong></p>
<pre data-original-title="" data-type="programlisting" title="">
Now I will quote something.
> To represent some text as a blockquote, begin each line of the quote with an angle bracket (>).
</pre>
<p>Now I will quote something.</p>
<blockquote>
<p>To represent some text as a blockquote, begin each line of the quote with an angle bracket (>).</p>
</blockquote>
</div></section>
<section data-type="sect2" data-pdf-bookmark="Tables"><div class="sect2" id="idp1276704">
<h2>Tables</h2>
<p>Using the pipe (|) character you can insert tables with Markdown. Lining up the pipes is optional but will probably be easier to read in Markdown. Tables must have header rows separated by a row of dashes.</p>
<p><strong>Example:</strong></p>
<pre data-original-title="" data-type="programlisting" title="">
| Titles | Required |
|--------|----------|
| Simple | 1 |
| Table | 2 |
|Example | 348978 |
</pre>
<h3>Alignment in Tables</h3>
<p>By including colons on either or both sides of a table divider, you can align that column to left, right or center.</p>
<p><strong>Example:</strong></p>
<pre data-original-title="" data-type="programlisting" title="">
| Left | Right | Center |
| -------- | --------:|:--------:|
| 1 | 1 | 1 |
| 14 | 14 | 14 |
| 9823764 | 9823764 | 9823764 |</pre>
<table>
<thead>
<tr>
<th>Left</th>
<th align="right">Right</th>
<th align="center">Center</th>
</tr>
</thead>
<tbody>
<tr>
<td>1</td>
<td align="right">1</td>
<td align="center">1</td>
</tr>
<tr>
<td>14</td>
<td align="right">14</td>
<td align="center">14</td>
</tr>
<tr>
<td>9823764</td>
<td align="right">9823764</td>
<td align="center">9823764</td>
</tr>
</tbody>
</table>
</div></section>
</div></section>
<section data-type="sect1" data-pdf-bookmark="Writing Markdown for HTMLBook"><div class="sect1" id="idp1294336">
<h1>Writing Markdown for HTMLBook</h1>
<p>Markdown was designed for writing for the web, HTMLBook is designed for writing books. As such, HTMLBook is designed for structure, chapters, sections, tables of contents. The conversion process from Markdown to HTMLBook attempts to add structure.</p>
<section data-type="sect2" data-pdf-bookmark="Converting Headers into Chapters and Sections"><div class="sect2" id="idp1296016">
<h2>Converting Headers into Chapters and Sections</h2>
<p>Atlas uses headings from Markdown files to create book sections. This section will explain how this happens and the requirements for using headings.</p>
<section data-type="sect3" data-pdf-bookmark="Chapters"><div class="sect3" id="idp1297664">
<h3>Chapters</h3>
<p>Each file in Atlas is treated as a new chapter, and each chapter must have a title. The first line of a Markdown file must start with a single pound sign (<code>#</code> ) and a title:</p>
<pre data-original-title="" data-type="programlisting" title="">
# Title of Chapter</pre>
<p>All subsequent content until the next <code>#</code> heading will be in the same chapter.</p>
</div></section>
<section data-type="sect3" data-pdf-bookmark="Heading to Section Conversion Chart"><div class="sect3" id="idp1302112">
<h3>Heading to Section Conversion Chart</h3>
<table border="1" cellpadding="1" cellspacing="1">
<thead>
<tr>
<th scope="col">Markdown Heading</th>
<th scope="col">HTMLBook Section Type</th>
</tr>
</thead>
<tbody>
<tr>
<td>#</td>
<td>Chapter</td>
</tr>
<tr>
<td>##</td>
<td>Sect1 e.g. 1</td>
</tr>
<tr>
<td>###</td>
<td>Sect2 e.g. 1.1</td>
</tr>
<tr>
<td>####</td>
<td>Sect3 e.g. 1.1.1</td>
</tr>
<tr>
<td>#####</td>
<td>Sect4 e.g. 1.1.1.1</td>
</tr>
<tr>
<td>######</td>
<td>Sect5 e.g. 1.1.1.1.1</td>
</tr>
</tbody>
</table>
</div></section>
</div></section>
</div></section>
<p> </p>
</div></section></body></html>