Features for Coders
Contents
Fenced Code Blocks
Fenced code blocks are enabled in both included processors by default (MultiMarkdown and Discount (GFM)). Fenced code blocks are delimited by three or more tildes (~) or backticks (`). You can use more than three, but the beginning and ending delimiters must have exactly the same number of characters.
~~~~
Some code to be rendered as a pre/code block
~~~~
Languages may be specified using the language title (or short title) after the delimiter in the first line, or in curly brackets (with or without a leading period) after the last delimeter. For example:
~~~~~ruby
some ruby code
~~~~~
Will render as:
<pre><code class="ruby">some ruby code</code></pre>
Or with backticks:
`````
some Java code
`````{.java}
Marked can detect both Markdown Extra/Python Markdown ({.lang} after closing fence) and Discount (lang after first fence) language specifications. The following (Discount format) would create the same result as the above (Python Markdown format):
`````java
some Java code
`````
Marked also handles indented fenced code blocks so you can use them within nested lists.
The built in syntax highlighting will recognize 41+ different language specifiers. If there is no language specified, it will detect it automatically, so it’s not required for the preview. The language string given will be output in the final html as a class on the <code> tag.
See the section on Marked Special Syntax to learn how to include external code files in your document.
Syntax Highlighting
Syntax highlighting can be enabled in the . It will recognize code blocks, detect the language and render color-coded output in the preview. There are multiple themes available, selected by the dropdown below the option in preferences. The selected theme will apply to all documents.
Marked uses highlight.js to provide consistent color coding for all types of embedded code, including standard Markdown syntaxes that don’t allow language to be specified. Highlight.js autodetects well. There are some minor rendering differences between it and colorizers such as Pygments (GitHub style), but the output is similar. Using the github.css theme on Ruby code, for example, renders almost the exact output you’d see on GitHub.
The GitHub stylesheet provides backup styles for blocks rendered with Pygments. If the
<pre>tag is inside a div with the class “highlight”, it will display using the standard GitHub styling, not Marked’s. You can render the code externally and paste HTML, or usepygmentizeto render it to html files and include them with the<<(source.html)syntax.
The “Only if language specified” option to the right of the syntax style selector applies to fenced code blocks. If enabled, syntax highlighting will only be applied to code blocks with a language specifier after the opening fence, e.g.
```js
code
```
Syntax highlighting will show up in the preview and in print and PDF export. If enabled in preferences and the theme is included when exporting HTML, the highlight.js library used by Marked will be embedded in the HTML output, allowing your exported HTML to appear as it does in Marked.
GitHub Linebreaks
Marked can preserve line breaks in your paragraphs. Just select the and check the box to retain line breaks in paragraphs.
GitHub Checkboxes
List items formatted as:
- [ ] Unfinished task
- [x] Finished task
will appear in the preview as rendered checkbox items. They cannot be interacted with, but their state will reflect any changes in the source document.
Code block wrapping
In the you’ll find an option under Layout and Typography: “Allow themes to wrap text inside code blocks.” Disabling this will force all code blocks to scroll horizontal overflow rather than wrapping it, regardless of the current preview style.
Next up: Scrivener 3 Support ▶
Search | Support Site | Knowledgebase | Legal | Privacy | Twitter