mirror of
https://github.com/Jermolene/TiddlyWiki5
synced 2024-08-27 19:42:50 +00:00
224 lines
5.5 KiB
Plaintext
224 lines
5.5 KiB
Plaintext
![]() |
|
|||
|
title: $:/plugins/tiddlywiki/markdown/syntax
|
|||
|
|
|||
|
To review standard Markdown syntax, see: [ext[CommonMark quick reference|https://commonmark.org/help/]]. For formal specification, consult the [ext[CommonMark Spec|https://spec.commonmark.org/current/]].
|
|||
|
|
|||
|
! Linking to Tiddlers
|
|||
|
|
|||
|
Prepend `#` to tiddler titles to form link addresses. If a tiddler title contains spaces or other special characters, you must either (1) URI-encode the title, or (2) surround the #title with `<` `>` and backslash-escape any `<` or `>` in the title.
|
|||
|
|
|||
|
!! Links
|
|||
|
|
|||
|
<pre><code>[link text](<strong>#</strong><$text text="TiddlerTitle"/> "optional tooltip")
|
|||
|
|
|||
|
[link text](<strong>#</strong>New<strong>%20</strong>Tiddler)
|
|||
|
|
|||
|
[link text](<strong><#</strong>New Tiddler<strong>></strong>)
|
|||
|
|
|||
|
[](<strong><#</strong>How to use <strong>\</strong><$list<strong>\</strong>> widget?<strong>></strong>)
|
|||
|
</code></pre>
|
|||
|
|
|||
|
You can also use the `<$link>` widget to generate links to tiddlers:
|
|||
|
|
|||
|
```
|
|||
|
<$link to="Tiddler Title">Displayed Link Title</$link>
|
|||
|
```
|
|||
|
|
|||
|
!! Reference Style Links
|
|||
|
|
|||
|
```
|
|||
|
[link text][1]
|
|||
|
[link text][2]
|
|||
|
|
|||
|
[1]: #New%20Tiddler "optional tooltip"
|
|||
|
|
|||
|
[2]: <#Another Tiddler>
|
|||
|
```
|
|||
|
|
|||
|
!! Images
|
|||
|
|
|||
|
```
|
|||
|
![alt text](#Motovun%20Jack.jpg "optional tooltip")
|
|||
|
|
|||
|
![alt text](<#Motovun Jack.jpg>)
|
|||
|
```
|
|||
|
|
|||
|
! Escaping Special Characters
|
|||
|
|
|||
|
Markdown allows you to escape ASCII punctuation characters with `\`.
|
|||
|
|
|||
|
! HTML Blocks
|
|||
|
|
|||
|
An [[HTML block|https://spec.commonmark.org/0.30/#html-blocks]] is a group of lines that starts with an HTML tag and is treated as raw HTML. Block-level tags such as `<div>` and `<p>` can interrupt a paragraph. Inline elements such as `<strong>` and `<em>` can start an HTML block if the //complete// tag begins on a new paragraph by itself. In most cases, an HTML block continues until a blank line is reached.
|
|||
|
|
|||
|
A widget tag that begins on a new paragraph will also be treated as an HTML block. Markdown elements are not recognized inside the HTML block. For example:
|
|||
|
|
|||
|
```
|
|||
|
see
|
|||
|
|
|||
|
<$link to="New Tiddler">
|
|||
|
_New_ Tiddler
|
|||
|
</$link>
|
|||
|
```
|
|||
|
|
|||
|
rendered as:
|
|||
|
|
|||
|
```
|
|||
|
<p>see</p>
|
|||
|
<$link to="New Tiddler">
|
|||
|
_New_ Tiddler
|
|||
|
</$link>
|
|||
|
```
|
|||
|
|
|||
|
A widget tag not preceded by a blank line is an inline element.
|
|||
|
|
|||
|
```
|
|||
|
see
|
|||
|
<$link to="New Tiddler">
|
|||
|
_New_ Tiddler
|
|||
|
</$link>
|
|||
|
```
|
|||
|
|
|||
|
rendered as:
|
|||
|
|
|||
|
```
|
|||
|
<p>see <$link to="New Tiddler"><em>New</em> Tiddler</$link></p>
|
|||
|
```
|
|||
|
|
|||
|
! Syntax Extensions
|
|||
|
|
|||
|
!! <$text text=KaTeX/>
|
|||
|
|
|||
|
You need to install the <$text text=KaTeX/> plugin to activate this syntax extension.
|
|||
|
|
|||
|
Surround your math expression with `$` for inline rendering. Whitespace characters cannot immediately follow the opening `$` or precede the closing `$`, and the closing delimiter must not immediately precede a digit. Furthermore, `$` followed by `:/` will not be recognized as a valid opening or closing delimiter either.
|
|||
|
|
|||
|
Here's an example of an inline math expression:
|
|||
|
|
|||
|
```
|
|||
|
$c = \pm\sqrt{a^2 + b^2}$
|
|||
|
```
|
|||
|
|
|||
|
Use `$$` to center the math in display mode:
|
|||
|
|
|||
|
```
|
|||
|
$$c = \pm\sqrt{a^2 + b^2}$$
|
|||
|
```
|
|||
|
|
|||
|
!! Superscript and Subscript
|
|||
|
|
|||
|
```
|
|||
|
X^2^
|
|||
|
```
|
|||
|
x<sup>2</sup>
|
|||
|
|
|||
|
```
|
|||
|
H~2~O
|
|||
|
```
|
|||
|
H<sub>2</sub>O
|
|||
|
|
|||
|
!! Marked Text
|
|||
|
|
|||
|
```
|
|||
|
==marked text==
|
|||
|
```
|
|||
|
|
|||
|
<mark>marked text</mark>
|
|||
|
|
|||
|
!! Strikethrough
|
|||
|
|
|||
|
```
|
|||
|
~~striked through text~~
|
|||
|
```
|
|||
|
|
|||
|
<s>striked through text</s>
|
|||
|
|
|||
|
!! Inserted Text
|
|||
|
|
|||
|
```
|
|||
|
++inserted text++
|
|||
|
```
|
|||
|
|
|||
|
<ins>inserted text</ins>
|
|||
|
|
|||
|
!! Tables
|
|||
|
|
|||
|
markdown-it supports <$text text="GitHub Flavored Markdown"/> (GFM) [ext[table syntax|https://github.github.com/gfm/#tables-extension-]].
|
|||
|
|
|||
|
```
|
|||
|
|Left Aligned |Centered |Right Aligned |
|
|||
|
|:--- | :---: | ---:|
|
|||
|
|apple |bat |candle |
|
|||
|
```
|
|||
|
|
|||
|
<table>
|
|||
|
<thead>
|
|||
|
<tr><th style="text-align:left">Left Aligned</th><th style="text-align:center">Centered</th><th style="text-align:right">Right Aligned</th></tr>
|
|||
|
</thead>
|
|||
|
<tbody>
|
|||
|
<tr><td style="text-align:left">apple</td><td style="text-align:center">bat</td><td style="text-align:right">candle</td></tr>
|
|||
|
</tbody>
|
|||
|
</table>
|
|||
|
|
|||
|
!! Definition Lists
|
|||
|
|
|||
|
```
|
|||
|
Term One
|
|||
|
: Definition with
|
|||
|
lazy continuation.
|
|||
|
|
|||
|
Term Two
|
|||
|
: Here is the first defintion.
|
|||
|
|
|||
|
: Here is the second definition.
|
|||
|
|
|||
|
As you can see. A definition can have
|
|||
|
more than one paragrpah. It can also have
|
|||
|
|
|||
|
And indended code block...
|
|||
|
```
|
|||
|
|
|||
|
<dl>
|
|||
|
<dt>Term One</dt>
|
|||
|
<dd><p>Definition with
|
|||
|
lazy continuation.
|
|||
|
</p></dd>
|
|||
|
<dt>Term Two</dt>
|
|||
|
<dd><p>Here is the first defintion.
|
|||
|
</p></dd>
|
|||
|
<dd><p>Here is the second definition.</p><p>As you can see. A definition can have
|
|||
|
more than one paragrpah. It can also have
|
|||
|
<pre><code>And indended code block...
|
|||
|
</code></pre>
|
|||
|
</p></dd>
|
|||
|
</dl>
|
|||
|
|
|||
|
!! Footnotes
|
|||
|
|
|||
|
For detailed explanation, see [[Creating Footnotes|https://www.markdownguide.org/extended-syntax/#footnotes]].
|
|||
|
|
|||
|
```
|
|||
|
Here's a simple footnote,[^1] and here's a longer one.[^bignote]
|
|||
|
|
|||
|
[^1]: This is the first footnote.
|
|||
|
|
|||
|
[^bignote]: Here's one with multiple paragraphs and code.
|
|||
|
|
|||
|
Indent paragraphs to include them in the footnote.
|
|||
|
|
|||
|
`{ my code }`
|
|||
|
|
|||
|
Add as many paragraphs as you like.
|
|||
|
```
|
|||
|
|
|||
|
<div class="markdown"><p>Here’s a simple footnote,<a class="footnote-ref" href="##fn1--doc639182" id="#fnref1--doc639182">[1]</a> and here’s a longer one.<a class="footnote-ref" href="##fn2--doc639182" id="#fnref2--doc639182">[2]</a>
|
|||
|
<hr class="footnotes-sep">
|
|||
|
<section class="footnotes">
|
|||
|
<ol class="footnotes-list">
|
|||
|
<li id="#fn1--doc639182" class="footnote-item"><p>This is the first footnote. <a href="##fnref1--doc639182" class="footnote-backref">↥︎</a>
|
|||
|
</p></li>
|
|||
|
<li id="#fn2--doc639182" class="footnote-item"><p>Here’s one with multiple paragraphs and code.</p><p>Indent paragraphs to include them in the footnote.</p><p><code class="codified">{ my code }</code></p><p>Add as many paragraphs as you like. <a href="##fnref2--doc639182" class="footnote-backref">↥︎</a>
|
|||
|
</p></li>
|
|||
|
</ol>
|
|||
|
</section>
|
|||
|
</p></div>
|