Skip to main content

pandoc/template-html5-articleedit.html5

This is a modified version of Pandoc's default HTML5 template (template-html5.html5) used for generating standalone HTML articles outside the main Hakyll build process.

Pathtemplate/pandoc/template-html5-articleedit.html5
LanguageHTML5/Pandoc
Lines77

Read this when Use this page when tracing the HTML/Pandoc templates and include fragments that shape rendered gwern.net pages around pandoc/template-html5-articleedit.

Overview

This is a modified version of Pandoc's default HTML5 template (template-html5.html5) used for generating standalone HTML articles outside the main Hakyll build process. It provides a complete, self-contained HTML document with Pandoc's full feature set, including table of contents, math rendering (MathJax), syntax highlighting, and metadata support.

Unlike default.html (the Hakyll template), this template is used by Pandoc directly for conversion tasks that need standard HTML output without gwern.net's custom page structure. It's suitable for generating articles that can be viewed independently, shared externally, or published to other platforms. The template includes MathJax for mathematical notation, making it appropriate for technical/academic content.

The template follows Pandoc's conventions for variable names and structure, making it compatible with standard Pandoc workflows and documentation. It supports both modern and legacy browsers (includes HTML5 shiv for IE8 compatibility).

Key Variables/Blocks

Document Metadata

  • $pagetitle$: Raw page title (used in <title> element)
  • $title-prefix$: Optional prefix for title (rendered as "prefix – title")
  • $title$: Formatted title (rendered in <h1> within header)
  • $subtitle$: Optional subtitle
  • $author$: Author name(s) (supports multiple with $for(author)$ loop)
  • $date$: Publication date
  • $author-meta$: Author in meta tag format
  • $date-meta$: Date in dcterms.date format
  • $keywords$: Comma-separated keywords for meta tag

HTML Attributes

  • $dir$: Text direction (e.g., "rtl" for right-to-left languages)
  • $lang$: Language code (defaults to "en")

Styling and Scripts

  • $highlighting-css$: Pandoc-generated CSS for syntax highlighting
  • $for(css)$: Loops through external CSS files to link
  • $for(header-includes)$: Custom header content injection point
  • $math$: Math rendering configuration emitted if set (inside $if(math)$)
    • Additionally, hardcoded and loaded unconditionally: <script src="https://cdn.jsdelivr.net/npm/mathjax@3/es5/tex-mml-chtml.js">

Content Blocks

  • $for(include-before)$: Content to inject before article body
  • $body$: Main article content (Pandoc-generated HTML)
  • $for(include-after)$: Content to inject after article body
  • $toc$: Enables table of contents generation
  • $table-of-contents$: Rendered TOC HTML
  • $idprefix$: Prefix for element IDs (for TOC anchors)

Legacy Browser Support

  • Conditional IE8 comment with HTML5 shiv:
    <!--[if lt IE 9]>
    <script src="//cdnjs.cloudflare.com/ajax/libs/html5shiv/3.7.3/html5shiv-printshiv.min.js"></script>
    <![endif]-->

Usage

This template is invoked directly by Pandoc, not by Hakyll. Its two actual consumers in the repository are:

  1. build/markdown-lint.sh (~line 103): as a lint check, each Markdown page is test-compiled to standalone HTML with this template (via a copy deployed at /home/gwern/bin/bin/pandoc-template-html5-articleedit.html5) to catch Pandoc compilation errors:
cat "$PAGE" | pandoc --metadata lang=en --metadata title="Test" --mathml \
--to=html5 --standalone --number-sections --toc --reference-links \
--css=https://gwern.net/static/css/default.css --from=markdown+smart \
--template=/home/gwern/bin/bin/pandoc-template-html5-articleedit.html5 \
- --output="$HTML"
  1. build/markdown.el: the Emacs markdown-command uses this template (from /home/gwern/wiki/static/template/pandoc/) to generate quick HTML previews of Markdown files during writing/editing.

Typical Use Cases

  1. Lint/test compilation: Verifying that Markdown pages compile cleanly to standalone HTML (markdown-lint.sh)
  2. Editor previews: Quick HTML previews from Emacs during writing (markdown.el)
  3. Standalone article exports: Any ad hoc Pandoc conversion needing standard HTML output without gwern.net's custom page structure

Inline Styles

The template includes minimal inline CSS for basic formatting:

code { white-space: pre-wrap; }
span.smallcaps { font-variant: small-caps; }
span.underline { text-decoration: underline; }
div.column { display: inline-block; vertical-align: top; width: 50%; }

It also handles quotation marks based on $if(quotes)$:

q { quotes: """ """ "'" "'"; }

See Also