|
|
| (11 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> |
| | Most modern markdown parsers now adhere to the [https://spec.commonmark.org/ commonmark spec]. |
|
| |
|
| {{ TODO | | | = Documentation = |
| These are old, bad, ugly. fixme }}
| | <blockquote> |
| | {| class="wikitable" |
| | |- |
| | | CommonMark Spec || https://spec.commonmark.org/ |
| | |- |
| | | Original markdown docs || https://daringfireball.net/projects/markdown/syntax |
| | |- |
| | |} |
| | </blockquote><!-- Documentation --> |
|
| |
|
| = Notes = | | = Notes = |
| Line 21: |
Line 31: |
| | [[ruby redcarpet]] | | | [[ruby redcarpet]] |
| |- | | |- |
| | [[ruby github flavoured markdown]] | | | [[c sundown]] |
| | |- |
| | | [[c soldout]] |
| | |- |
| | | [[c hoedown]] |
| |- | | |- |
| |} | | |} |
| </blockquote><!-- Parsers --> | | </blockquote><!-- Parsers --> |
|
| |
| = 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 -->
| |
