|
- <!DOCTYPE html>
- <!--[if IE 8]><html class="no-js lt-ie9" lang="en" > <![endif]-->
- <!--[if gt IE 8]><!-->
- <html class="no-js" lang="en">
- <!--<![endif]-->
- <head>
- <meta charset="utf-8">
- <meta http-equiv="X-UA-Compatible" content="IE=edge">
- <meta name="viewport" content="width=device-width, initial-scale=1.0">
-
- <title>Markdown support - DocNet Documentation</title>
- <link rel="shortcut icon" href="favicon.ico">
- <link rel="stylesheet" href="css/theme.css" type="text/css" />
- <link rel="stylesheet" href="css/theme_colors.css" type="text/css" />
- <link rel="stylesheet" href="css/styles/vs.css">
- <link rel="stylesheet" href="css/font-awesome.4.5.0.min.css">
- </head>
- <body role="document">
- <div class="grid-for-nav">
- <nav data-toggle="nav-shift" class="nav-side stickynav">
- <div class="side-nav-search">
- <a href="index.htm"><i class="fa fa-home"></i> DocNet Documentation</a>
- <div role="search">
- <form id="search-form" class="form" action="Docnet_search.htm" method="get">
- <input type="text" name="q" placeholder="Search docs" />
- </form>
- </div>
- </div>
- <div class="menu menu-vertical" data-spy="affix" role="navigation" aria-label="main navigation">
- <ul>
- <li class="tocentry"><a href="index.htm">Home</a>
- </li>
-
- <li class="tocentry"><a href="usage.htm">Usage</a>
- </li>
- <li class="tocentry">
- <span class="navigationgroup"><i class="fa fa-caret-right"></i> <a href="Configuration.htm">Configuration</a></span>
- </li>
- <li class="tocentry">
- <ul>
- <li><span class="navigationgroup"><i class="fa fa-caret-down"></i> <a href="Authoringcontent.htm">Authoring content</a></span></li>
- <li class="tocentry"><a href="themes.htm">Themes</a>
- </li>
- <li class="tocentry">
- <ul>
- <li><span class="navigationgroup"><i class="fa fa-caret-down"></i> <a href="WritingcontentusingMarkdown.htm">Writing content using Markdown</a></span></li>
- <li class="tocentry current"><a class="current" href="markdownsupport.htm">Markdown support</a>
- <ul class="currentrelative">
- <li class="tocentry"><a href="#standard-markdown">Standard Markdown</a></li>
-
- <li class="tocentry"><a href="#php-markdown-extra">Php Markdown Extra</a></li>
- <li class="tocentry">
- <ul class="currentrelative">
- <li class="tocentry"><a href="#footnotes">Footnotes</a></li>
-
- <li class="tocentry"><a href="#definition-lists">Definition lists</a></li>
-
- <li class="tocentry"><a href="#tables">Tables</a></li>
-
- <li class="tocentry"><a href="#special-attributes">Special attributes</a></li>
-
- <li class="tocentry"><a href="#image-rendering">Image rendering</a></li>
-
- <li class="tocentry"><a href="#abbreviations">Abbreviations</a></li>
-
-
- </ul>
- </li>
-
- <li class="tocentry"><a href="#highlighting-code">Highlighting code</a></li>
-
- <li class="tocentry"><a href="#linking">Linking</a></li>
-
-
-
- </ul>
- <li class="tocentry"><a href="markdownextensions.htm">DocNet Markdown extensions</a>
- </li>
-
- </ul>
- </li>
-
- </ul>
- </li>
- <li class="tocentry"><a href="search.htm">Search</a>
- </li>
- <li class="tocentry"><a href="acknowledgements.htm">Acknowledgements</a>
- </li>
- <li class="tocentry"><a href="license.htm">License</a>
- </li>
- </ul>
- <div class="toc-footer">
- <span class="text-small">
- <hr/>
- <a href="https://github.com/FransBouma/DocNet" target="_blank">Made with <i class="fa fa-github"></i> DocNet</a>
- </span>
- </div>
- </div>
-
- </nav>
- <section data-toggle="nav-shift" class="nav-content-wrap">
- <nav class="nav-top" role="navigation" aria-label="top navigation">
- <i data-toggle="nav-top" class="fa fa-bars"></i>
- <a href="index.htm">DocNet Documentation</a>
- </nav>
- <div class="nav-content">
- <div role="navigation" aria-label="breadcrumbs navigation">
- <div class="breadcrumbs">
- <ul><li><a href="index.htm">Home</a></li> / <li><a href="Authoringcontent.htm">Authoring content</a></li> / <li><a href="WritingcontentusingMarkdown.htm">Writing content using Markdown</a></li> / <li><a href="markdownsupport.htm">Markdown support</a></li></ul>
-
- </div>
- <hr />
- </div>
- <div role="main">
- <div class="section">
- <h1 id="markdown-support">Markdown support<a class="headerlink" href="#markdown-support" title="Permalink to this headline"><i class="fa fa-link" aria-hidden="true"></i></a></h1>
- <p><code>DocNet</code> uses markdown files as input. The markdown is parsed with the markdown parser from topten software (called '<a href="http://www.toptensoftware.com/markdowndeep/" target="_blank">MarkdownDeep</a>'). It supports the default markdown statements as well as github style code block markers and specific extensions for writing documentation, which are described below.</p>
- <h2 id="standard-markdown">Standard Markdown<a class="headerlink" href="#standard-markdown" title="Permalink to this headline"><i class="fa fa-link" aria-hidden="true"></i></a></h2>
- <p>The standard markdown syntax as defined by <a href="https://daringfireball.net/projects/markdown/" target="_blank">John Gruber</a> is supported in full. </p>
- <h2 id="php-markdown-extra">Php Markdown Extra<a class="headerlink" href="#php-markdown-extra" title="Permalink to this headline"><i class="fa fa-link" aria-hidden="true"></i></a></h2>
- <p>MarkdownDeep supports <a href="https://michelf.ca/projects/php-markdown/extra/" target="_blank">PHP Markdown Extra</a>. PHP Markdown Extra comes with a set of neat extensions for markdown to define e.g. tables, footnotes and more. Please see the link above for all the syntax examples. Additionally, you can look at the <a href="https://github.com/FransBouma/DocNet/tree/master/src/MarkdownDeepTests/testfiles/extramode" target="_blank">unit test files</a> for MarkdownDeep in the <a href="https://github.com/FransBouma/DocNet" target="_blank">DocNet respository at GitHub</a>.
</p>
- <p>A couple of examples are given below</p>
- <h3 id="footnotes">Footnotes<a class="headerlink" href="#footnotes" title="Permalink to this headline"><i class="fa fa-link" aria-hidden="true"></i></a></h3>
- <p>MarkdownDeep supports Footnotes, which can be added through the following system: To specify a footnote marker, specify <code>[^1]</code>, which will result in:<sup id="fnref:1"><a href="#fn:1" rel="footnote">1</a></sup></p>
- <p>The actual footnote text is then specified with <code>[^1]:</code> following the text of the actual footnote. Click on the superscript <code>1</code> link above to go to the footnote rendered at the bottom of this page. </p>
- <h3 id="definition-lists">Definition lists<a class="headerlink" href="#definition-lists" title="Permalink to this headline"><i class="fa fa-link" aria-hidden="true"></i></a></h3>
- <p>To specify simple definition lists, simply do:</p>
- <pre class="nocode">Item one
- : this is the description of item one
-
- Item Two
- : this is the text of item 2
- </pre><p>which results in: </p>
- <dl>
- <dt>Item one</dt>
- <dd>this is the description of item one</dd>
- <dt>Item Two</dt>
- <dd>this is the text of item 2</dd>
- </dl>
- <h3 id="tables">Tables<a class="headerlink" href="#tables" title="Permalink to this headline"><i class="fa fa-link" aria-hidden="true"></i></a></h3>
- <p>There's basic support for defining tables. </p>
- <p>Specifying: </p>
- <pre class="nocode">Fruit|Color
- --|--
- Apples|Red
- Pears|Green
- Bananas|Yellow
- Bongo|Bongo... it's a strange color, do you have a minute? It's a bit like the sea, but also a bit like the beach. You know how it is... oh and a bit like the wind too? You see it? Hey! Where're you going?!
- </pre><p>results in:</p>
- <table class="table table-bordered-all table-responsive">
- <thead>
- <tr>
- <th>Fruit</th>
- <th>Color</th>
- </tr>
- </thead>
- <tbody>
- <tr>
- <td>Apples</td>
- <td>Red</td>
- </tr>
- <tr>
- <td>Pears</td>
- <td>Green</td>
- </tr>
- <tr>
- <td>Bananas</td>
- <td>Yellow</td>
- </tr>
- <tr>
- <td>Bongo</td>
- <td>Bongo... it's a strange color, do you have a minute? It's a bit like the sea, but also a bit like the beach. You know how it is... oh and a bit like the wind too? You see it? Hey! Where're you going?!</td>
- </tr>
- </tbody>
- </table>
- <h3 id="special-attributes">Special attributes<a class="headerlink" href="#special-attributes" title="Permalink to this headline"><i class="fa fa-link" aria-hidden="true"></i></a></h3>
- <p>DocNet supports special attributes for Links and Images. Currently this is supported on normal links/image specifications only, e.g.:</p>
- <pre class="nocode">{.cssclass1 .cssclass2 #idvalue name=value}
- </pre><p>which will result in:</p>
- <pre><code class="html"><img src="imageurl" alt="id text" id="idvalue" class="cssclass1 cssclass2" name="value" />
- </code></pre>
-
- <h3 id="image-rendering">Image rendering<a class="headerlink" href="#image-rendering" title="Permalink to this headline"><i class="fa fa-link" aria-hidden="true"></i></a></h3>
- <p>By default images have no special rendering applied to them. To apply a shadow, specify '.shadowed' as css class in a special attribute specification.
- If you want to have an image rendered centered with a note below it, simply specify a title for the image: </p>
- <pre class="nocode">
- </pre><p>will be rendered as: (xxx and yyy are the width/height values of mycenteredpicture.jpg)</p>
- <pre><code class="html"><div class="figure">
- <img src="mycenteredpicture.jpg" title="this is a picture" width="xxx" height="yyy"/>
- <p>this is a picture</p>
- </div>
- </code></pre>
-
- <p>All images rendered contain the width/height of the picture file included in the html.</p>
- <h3 id="abbreviations">Abbreviations<a class="headerlink" href="#abbreviations" title="Permalink to this headline"><i class="fa fa-link" aria-hidden="true"></i></a></h3>
- <p>There's also support for abbreviations, using the <code><abbr></code> HTML tag. </p>
- <p>Specifying:</p>
- <pre class="nocode">*[FuBar]: F**ked Up Beyond Any Repair.
- </pre><p>gives an abbreviation link in the following sentence: This is a test for abbreviations: <abbr title="F**ked Up Beyond Any Repair.">FuBar</abbr>.</p>
- <h2 id="highlighting-code">Highlighting code<a class="headerlink" href="#highlighting-code" title="Permalink to this headline"><i class="fa fa-link" aria-hidden="true"></i></a></h2>
- <p>The markdown parser has been extended with GitHub code specifications, so it's easy to specify a specific code beautifying based on a language. This feature uses the <a href="https://highlightjs.org/" target="_blank">Highlight.js</a> javascript library and most popular languages are included. </p>
- <p>Example: to specify a codeblock as C#, append <code>cs</code> after the first ``` marker:</p>
- <pre><code class="cs">var i=42;
- </code></pre>
-
- <p>To specify a block of text in a fixed sized font but not specify any language highlighting, specify <code>nohighlight</code> as language name:</p>
- <pre class="nocode">this is a simple <pre> block
- </pre><h2 id="linking">Linking<a class="headerlink" href="#linking" title="Permalink to this headline"><i class="fa fa-link" aria-hidden="true"></i></a></h2>
- <p><code>Docnet</code> doesn't automatically transform links to markdown files by default. To enable automatic link conversion to local markdown files, please specify the <code>ConvertLocalLinks</code> option in the <a href="docnetjson.htm">docnet.json file</a> file with the value <code>true</code>. If <code>ConvertLocalLinks</code> isn't specified or set to <code>false</code>, any link to any document in your documentation has to use the url it will get in the destination folder. </p>
- <p>Example: you want to link to the file <code>How to\AddEntity.md</code> from a page. If <code>ConvertLocalLinks</code> isn't specified or set to <code>false</code>, you have to specify in the markdown the url it will need to be in the result site, which is the link <code>How%20to/AddEntity.htm</code>. If <code>ConvertLocalLinks</code> is set to <code>true</code>, you can specify <code>How%20to/AddEntity.md</code> and DocNet will convert it to <code>How%20to/AddEntity.htm</code>.</p>
- <div class="alert alert-warning"><span class="alert-title"><i class="fa fa-warning"></i> Important!</span><p>The markdown parser also doesn't allow spaces to be present in the urls. If you need a space in the url, escape it with <code>%20</code>. </p>
- </div>
- <div class="footnotes">
- <hr />
- <ol>
- <li id="fn:1">
- <p>And this is the footnote related to the example above. <a href="#fnref:1" rev="footnote">↩</a></p>
- </li>
- </ol>
- </div>
-
- </div>
- </div>
- <footer>
- <hr />
- <div role="contentinfo">
- Made with DocNet. Get your copy at: <a href='https://github.com/FransBouma/DocNet' target='_blank'>https://github.com/FransBouma/DocNet</a>.
- </div>
- </footer>
- </div>
- </section>
- </div>
- <script src="js/jquery-2.1.1.min.js"></script>
- <script src="js/modernizr-2.8.3.min.js"></script>
- <script src="js/highlight.pack.js"></script>
- <script src="js/theme.js"></script>
-
- </body>
- </html>
|