17 Nov 2018
Markdown CSS This is a collection of stylesheets to use when converting Markdown text to HTML format. Stylesheets have been tested to work with Pandoc, but might also work with other converters that output fairly plain HTML. To use one of the stylesheets, just unpack somewhere convenient, e.g. /.local/share/markdown-css and then do something like. I built the package using setuptools. In setup.py file, for longdescription field I just read README.md file and assigned it. After uploading the package to PyPi, I saw the page and found that PyPi doesn't support Markdown format. So I had to change it to reStructuredText. Pandoc is the best tool available to convert markup formats. My previous solution, the add-on Markdown-here is not maintained, and no longer works with the latest Thunderbird versions. One approach I've tried to some success is using pandoc, and inserting the contents of the HTML file via Insert-HTML. Hi there,.this. is a.test. email written in `markdown` pandoc command. Pandoc has a multitude of styling extensions for markdown variants, all listed on the manual page. Pandoc ignores everything enclosed in. When converting from markdown to HTML, these comments are usually directly placed as is in the HTML document but the opposite does not seem to be true. Lastly, this was tested using pandoc version 1.19.2.1. See the pandoc MANUAL: Creating a PDF. By default, pandoc will use LaTeX to create the PDF Therefore, raw HTML will be ignored and would only have an effect if your output format is HTML as well. However, you can use wkhtmltopdf instead of pdflatex to go from markdown to PDF via HTML, instead of via LaTeX. From the raw HTML extension docs.
About
Both LaTeX and HTML are both markup languages. They both have standardized short-hand syntax to specify how content should be styled and formatted. Markdown is another markup language with its own specific syntax, yet is far simpler and less verbose than either LaTeX or HTML.The goal of markup languages is to provide simple styling rules and syntax so as to allow the author to concentrate on the content. To this end, the highly simplified syntax of the markdown languagemakes it one of the briefest and content rich formats.Unlike, many other markup languages (such as LaTeX and HTML), carriage returns and spaces form an important part of the language structure and thus influence the formatting of the final document.
Simplicity also makes markdown an ideal languagefor acting as a base source from which other formats (such as PDF, HTML, Presentations, Ebooks) can be created as well as a sort of conduit languagethrough which other formats are converted.
Pandoc is a universal document converter that converts between one markup language and another.Specifically, Pandoc can read markdown and subsets of the following formats:
- HTML
- LaTeX
- Textile
- reStructuredText
- MediaWiki markup
- DocBook XML
- plain text
- markdown
- HTML (XHTML, HTML5>)
- LaTeX
- PDF (when LaTeX installed)
- Various HTML/Javascrip based slide shows (Slidy, Slideous, DZSlides, S5)
- EPUB
- Emacs org-mode
- Rich Text Format (RTF)
- OpenDocument XML
- LibreOffice (Open Document Format, ODT)
- Microsoft Word DOCX
- MediaWiki markup
- FictionBook2
- Textile
- groff man pages
- AsciiDoc
Many of the above markup languages feature extensive definitions for styling and formattingrules that do not have direct equivalents within other languages. For example, Cascading Style Sheets and Javascriptwithin HTML provide advanced styling and dynamic presentation of content that cannot be easily translated into other languages. Similarly, there are many macros available for LaTeX that enhance the styling and formattingof content relevant to PDF. Consequently, not all of the more advanced features of each of the languages are supported by Pandoc for conversion.
Pandoc fully supports markdown as an input language, making markdown a popular base language to create content from which other formats can be generated.For example, contents authored in markdown can then be converted into PDF, HTML, HTML presentations, eBooks and others. There are currently numerous dialects of the markdown language. Pandoc has its own enhanced dialect of markdownwhich includes syntax for bibliographies and citations, footnotes, code blocks, tables, enhanced lists, tables of contents, embedded LaTeX math.
This tutorial will focus on markdown as a base source language from which PDF, HTML, presentations and eBooks are created.As a result, the tutorial will focus on Pandoc's enhanced markdown.
Using Pandoc
Pandoc is a command line application with the basic use of:where output.file is the name of the output file and input.file is the name of the input file or files (space separated).Pandoc uses the file extensions to determine the input and output formats. If multipleinput files are specified, Pandoc will first concatenate (join) them together before parsing the combined input file.
Before going through the specifics of the Pandoc markdown syntax and the Pandoc options, I will illustratea very basic example of Pandoc markdown conversion into a PDF, HTML and DZSlides presentation.Note, in the case of the PDF, the default is to produce a A4 size page, and therefore the font in theexample below is going to look small.
Markdown (*.md) | PDF result (*.pdf) |
---|---|
HTML result (*.html) | |
DZSlides result (*.html) |
Pandoc markdown
The basic philosophy of markdown is that a document formatted in markdown is completelyreadable in plain text without any obvious tags or formatting instructions. That is, the formatting rules are derived almost entirely from the structure of the plain text document.Furthermore, any additional 'markup' (such as underlined text) should not appear out of place in a plain text document.
Pandoc's dialect of markdown, whilst retaining some of this philosophy for most elements, is nevertheless guided by its aims to support multiple input and output formats (not just markdown -> HTML).
Paragraphs
Paragraphs of text are specified by separating sentences by one or more blank lines.Hard line breaks within paragraphs can be specified by placing two or more spaces at the end of a sentence followed by a line break.
Using Pandoc
Pandoc is a command line application with the basic use of:where output.file is the name of the output file and input.file is the name of the input file or files (space separated).Pandoc uses the file extensions to determine the input and output formats. If multipleinput files are specified, Pandoc will first concatenate (join) them together before parsing the combined input file.
Before going through the specifics of the Pandoc markdown syntax and the Pandoc options, I will illustratea very basic example of Pandoc markdown conversion into a PDF, HTML, presentation and eBook.
Markdown (*.md) |
---|
Show HTML output |
Show PDF output |
The metadata block
You may have noticed in the examples above, that at the start of the markdown there were a block of linesstarting with three hypens (---) and ending with three dots (...).When processed via pandoc, these linesdefine the document's meta data (such as the title, author and creation date).
The meta data are a set of key value pairs in YAML format. The list of useful metadata depends on theintended output.
Note however, the metadata block only appears in the output when the --standalone (or -s) switch is used.
The following rules can be applied to field different outcomes:
- The three fields must be in order of title, author(s), date with each on a separate line
- When omitting a field, the field must be left as a line just containing the % character
- Multiple authors can be defined by either:
- separating each author by a ; (semicolon) character
- placing each author on a separate line (indented by a single space)
Text formatting
Brief changes to font styles within a block of text can be effective at emphasizing or applying different meanings to characters.Common text modifier styles are: italic, bold and strikethrough.
Markdown | Font type |
---|---|
*Italic text* or _Italic text_ | Italic text |
**bold text** or __bold text__ | bold text |
~~strikethrough~~ | |
`courier` or ``courier`` | courier or typewriter font shape. |
Note, underlined text is not defined in any dialect of markdown (including pandoc markdown) as the developers believe that the underline style is a relic of the days of typewriters when there where fewalternatives for emphasizing words. Furthermore, underlining of regular words within a sentence tends to breakthe aesthetic spacing of lines.
Subscript and Superscript
- subscripts are supported by surrounding the content to be lowered by ~ characters
- superscripts are supported by surrounding the content to be raised by ^ characters
Markdown (*.md) |
---|
Show HTML output |
Show PDF output |
Additional mathematical and symbol notation will be illustrated in a later section.
Section headings
Pandoc markdown supports two heading formats (pandoc markdown headings must be proceeded by a blank line):
- Setext-style headings. Level 1 headings are specified by underlining the heading with a row of = charactersand level 2 headings are specified by underlining with a row of - characters.
Setext-style headings only support level 1 and level 2 headings.Markdown (*.md) Show HTML outputShow PDF output - Atx-style headings. Levels 1-6 headings comprise one to six # characters followed by the heading text.by underlining the heading with a row of = characters.
Markdown (*.md) Show HTML outputShow PDF output
Table of contents
A table of contents can be included by issuing the --toc command line switch to pandoc.For some output formats (such as HTML), a block of links to section headings is created, whilst for others (such as LaTeX), an instruction (tableofcontentsfor the external driver to create the table of contents is generated.
Markdown (*.md) |
---|
Show HTML output |
Show PDF output |
Block quotations
Block quotations in pandoc markdown follows email conventions - that is, each line is proceeded by a > character.
Markdown (*.md) |
---|
Show HTML output |
Show PDF output |
Verbatim (code) blocks
Verbatim blocks are typically used to represent blocks of code syntax. The text within the verbatim block is rendered literally as it is typed (retaining all spaces and line breaks) and in monoscript font (typically courier). In pandoc markdown, verbatim text blocks are specified by indenting a block of text by either four spaces or a tab character.Within verbatim text, regular pandoc markdown formatting rules (due to spaces etc) are ignored.
Markdown (*.md) |
---|
Show HTML output |
Show PDF output |
Alternatively, verbatim blocks can be specified without indentation if the text block is surrounded by a row of three or more ~ characters. This format is often referred to as fenced code.
Markdown (*.md) |
---|
Show HTML output |
Show PDF output |
Lists
There are three basic list environments available within pandoc markdown:
- Bullet lists - un-numbered itemized lists
- Ordered lists - enumerated lists
- Definition lists - descriptive lists
Bullet lists
A bullet list item begins with either a *, + or - character followed by a single space. Bullets can also be indented.
Markdown (*.md) |
---|
Show HTML output |
Show PDF output |
Ordered lists
An ordered list item begins with a number followed by a space. The list enumerator can be a decimal number or a roman numeral. In addition to the enumerator, other formatting characters can be used to further define the format of the list numbering.Markdown (*.md) |
---|
Show HTML output |
Show PDF output |
Definition lists
The term (word or phrase) must fit on a single line and the definition must start with either a colon (:) or tilde (~) and be indented by four or more spaces.
Markdown (*.md) |
---|
Show HTML output |
Show PDF output |
Nesting and the four space rule
To include multiple paragraphs (or other blocked content) within a list item or nested lists, the content must be indented by four or more spaces from the main list item.
Markdown (*.md) |
---|
Show HTML output |
Show PDF output |
List ends
Normally, pandoc considers a list as complete when a blank line is followed by non-indented text (as markdown does not have starting and ending tags).However, if you wish to place indented text directly after a list, it is necessary to provide an explicit indication that the list is complete.This is done with the <!-- end of list --> marker.
Similarly, if you wish to place one list directly following on from another list, a <!-- --> markermust be used between the two lists so as to explicitly separate them.
Markdown (*.md) |
---|
Show HTML output |
Show PDF output |
Horizontal lines (rules)
Horizontal lines are indicated by a row of three or more *, - or _ characters (optionally separated by spaces) witha blank row either side.
Markdown (*.md) |
---|
Show HTML output |
Show PDF output |
Tables
As markdown is a very minimalist markup language that aims to be reasonably well formattedeven read as plain text, table formatting must be defined by layout features that have meaning in plain text
Simple tables
The number of columns as well as column alignment are determined by the relative positions of the table headings and dashed row underneath:- if the dashed line is flush with the end of the column header, yet extends to the left of the start of the header text, then the column will be right aligned
- if the dashed line is flush with the start of the column header, yet extends to the right of the end of the header text, then the column will be left aligned
- if the dashed line extends to the left of the start and right of the end of the header text, then the column will be center aligned
- if the dashed line is flush with the start and end of the header text, then the column will follow the default justification (typically left justified)
The table must finish in either a blank line or a row of dashes mirroring those below the header followed by a blank row.
Markdown (*.md) |
---|
Show HTML output |
Show PDF output |
Multiline tables
Simple tables can be extended to allow cell contents to span multiple lines. This imposes the following additionallayout requirements:
- The table must start with a row of dashes that spans the full width of the table
- The table must end with a row of dashes that spans the full width of the table followed by a blank line
- Each table row must be separated by a blank line
Markdown (*.md) |
---|
Show HTML output |
Show PDF output |
Grid tables
Grid tables have a little more adornment in that they use characters to mark all the cell boundaries.However, by explicitly defining the bounds of a cell, grid tables permit more complex cell contents.A grid table for example, can contain a list or a code block etc.
Cell corners are marked by + characters and the table header and main body are separated by a row of = characters
Markdown (*.md) |
---|
Show HTML output |
Show PDF output |
Although, grid tables require substantially more setup, emacs users will welcome that grid tables are compatible with emacs table mode.
Pipe tables
Finally, there are also pipe tables. These are somewhat similar to grid tables in requiring a little more explicit specification of cell boundaries, however, unlike grid tables, they have a means to configure column alignment. Cell alignment is specified via the use of : characters (see example below)..Nor is it necessary to indicate cell corners.
Pandoc Markdown To Html Software
Markdown (*.md) |
---|
Show HTML output |
Show PDF output |
Again, emacs users will appreciate that pipe tables are compatible with orgtbl-mode.
Math
Markdown leverages TeX math processing. Whilst this does technically break the rules that promote source documents that are readable in text only mode, the payoff is that math is rendered nicely in the various derivative documents (such as pdf or html). In fact, math are passed straight through to the derivative document allowing that document (or is reader) to handle TeX math as appropriate.
Inline math is defined as anything within a pair of $ characters and for math in its own environment (paragraph), use a pair of $$ characters.
Markdown (*.md) |
---|
Show HTML output |
Show PDF output |
Referencing
Referencing is the linking of information and content between different parts of a document or even between documents. These are alternatively referred to as links (particularly in the context of web documents).
Internal links
Internal links make use of the section identifiers that are automatically generated. That is, section headings are automatically defined as labels for referencing. Therefore, to reference (link to) a section simply involves using the target section header as a reference label in the following The in text label is a word or phrase that should appear as the link in the text, and reference label is the title of the section you wish to link to. Note, there should not be any spaces between the square braces and the brackets.
Markdown (*.md) |
---|
Show HTML output |
Show PDF output |
To link to arbitrary parts of the document (non sections), it is necessary toinclude a point marker with a reference label, so that there is something to link to.
Markdown (*.md) |
---|
Show HTML output |
Show PDF output |
Pandoc Html To Pdf
External links
Linking to external documents follows a similar format:Markdown (*.md) |
---|
Show HTML output |
Show PDF output |
Images
Images are not displayed in plain text (obviously). However, an image link in pandoc markdownwill insert the image into the various derivative document types (if appropriate), Image links aredefined in a similar manner to other links, yet preceded immediately by a ! character.
Markdown (*.md) |
---|
Show HTML output |
Show PDF output |
Footnotes
Footnotes consist of a placemarker and the footnote text
Markdown (*.md) |
---|
Show HTML output |
Show PDF output |
Further reading
If you’re using the excellent Pandoc to convert between different document formats, and you:
- want your final output to be in HTML;
- want the HTML to be styled with CSS;
- and want the HTML document to be truly standalone;
then read on.
The most common approach with Pandoc is, I think, to write in Markdown, and then convert the output to RTF, PDF or HTML. There are all sorts of more advanced options too; but here we are only concerned with HTML.
The pandoc
command has an option which allows you to style the resulting HTML with CSS. Example 3 in the User’s Guide shows how you do this, with the -c
option. The example also uses the -s
option, which means that we are creating a standalone HTML document, as distinct from a fragment that is to be embedded in another document. The full command is:
If you inspect the generated HTML file after running this, you will see it contains a line like this:
That links to the CSS stylesheet, keeping the formatting information separate from the content. Very good practice if you’re publishing a document on the web.
But what about that “standalone” idea that you expressed with the -s
option? What that does is make sure that the HTML is a complete document, beginning with a DOCTYPE
tag, an <html>
tag, and so on. But if, for example, you have to email the document you just created, or upload it to your company’s document store, then things fall apart. When your reader opens it, they’ll see what you wrote, all right; but it won’t be styled the way you wanted it. Because that pandoc.css
file with the styling is back on your machine, in the same directory as the original Markdown file.
What you really want is to use embedded CSS; you want the content of pandoc.css
to be included along with the prose you wrote in your HTML file.
Luckily HTML supports that, and Pandoc provides a way to make it all happen: the -H
option, or using its long form, --include-in-header=FILE
First you’ll have to make sure that your pandoc.css
file1 starts and ends with HTML<style>
tags, so it should look something like this:
Then run the pandoc
command like this:
and you’re done. A fully standalone HTML document.