Markdown: Difference between revisions

From wikinotes
No edit summary
 
 
(14 intermediate revisions by the same user not shown)
Line 1: Line 1:
Markdown is short-form HTML. There are several flavours with different featuresets.
A markup language that produces [[HTML]].<br>
 
Originally released in 2004 has seen several variations/flavours with different features/semantics.<br>
{{ TODO |
Most modern markdown parsers now adhere to the [https://spec.commonmark.org/ commonmark spec].
These are old, bad, ugly. fixme }}
 
= Syntax =


= Documentation =
<blockquote>
<blockquote>
{| class="wikitable" width="80%"
{| class="wikitable"
| <pre>[TOC]</pre> || || Table of Contents || **Note that TOC is only available with a python extension. It is not a part of vanilla markdown. INSTEAD:
|-
|-
| <pre>
| CommonMark Spec || https://spec.commonmark.org/
//title as seen and goto link
[Complicated Algebra][compAlgebra]
 
//create your headers
## Complicated Algebra [compAlgebra]
</pre> || || Cross References (Same-Page links) ||
|-
|-
| <pre># Header1
| Original markdown docs || https://daringfireball.net/projects/markdown/syntax
## Header2
### Header3 </pre> || || Headers || <h1 id="header1">Header1</h1> <h2 id="header2">Header2</h2> <h3 id="header3">Header3</h3>
|-
|-
| <pre>> Indent
|}
>> Indent2</pre> || || Indent1, Indent 2 || <blockquote> <p>Indent</p>  <blockquote> <p>Indent2</p> </blockquote> </blockquote>
</blockquote><!-- Documentation -->
 
= Notes =
<blockquote>
{|
|-
|-
| <pre>*italic*, _italic_</pre> || || Italics || <p><em>italics</em></p>
| [[markdown syntax]]
|-
|-
| <pre>**bold**, __bold__</pre> || || Bold || <p><strong>bold</strong></p>
|}
|-
</blockquote><!-- Notes -->
| <pre>* bullet list


Second Paragraph
= Parsers =
 
<blockquote>
Third Paragraph
{|
 
* bullet list 2</pre> || || Bullet List || <ul><li><p>bullet list</p><p>Second Paragraph</p><p>Third Paragraph</p></li><li><p>bullet list 2</p></li></ul>
|-
|-
| <pre>1. Red
| [[ruby kramdown]]
2. Green
3. Blue</pre> || || Numbered list || <ol> <li>Red</li> <li>Blue</li> <li>Green</li> </ol>
|-
|-
| <pre><http://www.ign.com></pre> || || link || <p><a href="http://www.ign.com">http://www.ign.com</a></p>
| [[ruby redcarpet]]
|-
|-
| <pre>fact number one [Google][1]. Also see [Reference][2].
| [[c sundown]]
Let's not forget about the [Special Case][MSN].
 
 
[1]: http://www.google.com/
[2]: http://www.wikipedia.com/
[MSN]: http://msn.com/</pre> || || Reference style links || <p>fact number one <a href="http://www.google.com/">Google</a>. Also see <a href="http://www.wikipedia.com/">Reference</a>.Let's not forget about the <a href="http://msn.com/">Special Case</a>.</p>
|-
| <pre>![alt-text](/path/to/img.jpg)
![alt-text][ImageID]
 
 
[ImageID]: http://www.image.com/image.png</pre> || || Images ||
|-
|-
| <pre>`this is code wrapping`</pre> || || Code Formatting || <p><code>this is code wrapping</code></p>
| [[c soldout]]
|-
|-
| <pre><p align="right"> my writing </p></pre> || || Aligned writing || <p align="right">  modify text-alignment </p>
| [[c hoedown]]
|-
|-
| <pre>
``` bash
for f in *.txt; do echo "---f"; done
```
</pre> || || Code Block || <syntaxhighlight lang="bash">
for f in *.txt; do echo "---f"; done
</syntaxhighlight>
|}
|}
 
</blockquote><!-- Parsers -->
 
</blockquote><!-- Syntax -->
 
= Workflow =
<blockquote>
 
{{ WARNING |
This is really out of date
}}
 
=== Overview ===
Personal Script automatically generates .html files every time a .md file
is saved in vim.
<pre>
### Pipeline
vim
  Markdown-Syntax
  autolaunch convert-markdown.py on save *.md
 
python2
  pip
  pygments
  markdown2
  markdown
  py-markdown-ditaa
 
python-markdown.py
  pers: markdown-converter.py
  pers: markdownToc.py
 
chromium
  Tincr (extension reloads page when files change CSS+html)
  To use:
  open page in chromium
  Menu > Tools > Developer Tools
  Click Tincr Tab
  Done. Next save should automatically reload
 
    ~OR~
 
firefox
  autoReload (reloads page when files change CSS+html)
 
 
 
</pre>
 
 
=== python setup ===
<pre>
### install markdown2.py
pip install markdown2              #for (fork)markdown 2  (no longer using)
pip install markdown                #for (official) markdown
pip install pygments                #for syntax highlighting support
 
 
### Official Use:
python2 markdown2.py myFile.md > myFile.html
 
 
 
### Personal Use (markdown2-converter.py)
# creates html of same name in same dir, using variable DEFAULT_CSS_PATH for css
python2 markdown2-converter.py myFile.md
python2 markdown-converter.py myFile.md
 
# can also specify html name, location, css file
python2 markdown2-converter.py myFile.md C:/path/to/style.css C:/myFile.html
python2 markdown-converter.py myFile.md C:/path/to/style.css C:/myFile.html
 
 
# use any variety of paths
python2 markdown2-converter.py myFile.md C:/file.md C:/something/style.css D:/web/web.html
python2 markdown-converter.py myFile.md C:/file.md C:/something/style.css D:/web/web.html
</pre>
 
 
=== vim setup ===
<pre>
:PluginInstall Markdown-Syntax
</pre>
<pre>
### .vimrc
au BuffRead,BufNewFile *.md set filetype=markdown
 
 
if has("unix")
  autocmd BufWritePost *.md silent !$progs/python/general/markdown/markdown2-converter.py <afile>
elseif has("win32")
  autocmd BufWritePost *.md silent ! P:\Python27\Scripts\python.exe \%progs\%/python/general/markdown/markdown-converter.py <afile> silent
endif
 
 
Plugin 'Markdown-syntax'
</pre>
 
=== Firefox ===
<pre>
### Install autoReload extension (reloads automatically when files are updated)
firefox file.md
 
#(nothing else required, page reloads entirely by itself!)
</pre>
 
 
 
 
=== MathJax ===
 
Mathjax was a pain to setup last time, and it was a paint to sync. I also deleted it once
by mistake, and it took a fair amount of reading to get it working again, so I'll document it's
use specifically for use with markdown here:
<pre>
####### Using Mathjax CDN (requires online) ##########
### HTML (already coded in markdown-converter.py):
<!--mathjax-->
<script type="text/x-mathjax-config">
MathJax.Hub.Config({tex2jax: {inlineMath: [['$','$'], ['\\(','\\)']]}});
</script>
<script type="text/javascript"
src="http://cdn.mathjax.org/mathjax/latest/MathJax.js?config=TeX-AMS-MML_HTMLorMML">
</script>
</head>
</pre>
 
 
<pre>
### Use in markdown:
single '$'s or '\(' and  '\)'        -------      Inline LaTeX (single line)
anything between  '$$'s              -------      Displayed LaTeX (standard)
 
 
 
 
## Inline Code Example:
When $a \ne 0$, there are two solutions to \(ax^2 + bx + c = 0\) and they are
 
## Displayed Code Example:
When $a \ne 0$, there are two solutions to \(ax^2 + bx + c = 0\) and they are
</pre>
 
 
 
=== ditaa ===
the ditaa package for python-markdown is not included in pip, and requires a manual
installation.
 
''' Install Java: '''
Portable version available (see jportable).
Portable or not, must add bin directory to %PATH%
can test with: <pre>java -version</pre>
 
 
''' Install ditaa: '''
I have ditaa installed in my python site-packages directory. Only planning to use with
python-markdown.
Test with: <pre>java -jar ditaa0.9.jar --help</pre>
 
 
''' Next, install script: '''
Find markdown's extension location:
<pre>
## Typically P:\Python27\lib\site-packages\markdown
python2 -c "import markdown; print markdown.__path__[0]"
</pre>
 
download and install mdx_ditaa.py to <pre>site-packages/markdown</pre> or above location
 
 
</blockquote><!-- plugins -->
 
= CSS Styles =
<blockquote>
Note that all colours (including the syntax highlighting called on by pygments)
must be present in the CSS stylesheet or they will not appear.
 
=== Colors ===
http://www.color-hex.com/color-wheel/
 
=== Fonts ===
http://www.w3schools.com/cssref/css_websafe_fonts.asp
 
=== Syntax Highlighting themes: ===
https://github.com/richleland/pygments-css
 
=== General Appearance themes: ===
https://github.com/jasonm23/markdown-css-themes                #Click on sample html pages, links at top to view more than just 3 listed
 
 
</blockquote><!-- CSS Styles -->

Latest revision as of 15:56, 19 September 2021

A markup language that produces HTML.
Originally released in 2004 has seen several variations/flavours with different features/semantics.
Most modern markdown parsers now adhere to the commonmark spec.

Documentation

CommonMark Spec https://spec.commonmark.org/
Original markdown docs https://daringfireball.net/projects/markdown/syntax

Notes

markdown syntax

Parsers

ruby kramdown
ruby redcarpet
c sundown
c soldout
c hoedown