Skip to content

Transitioning from v1 to v2

Shan Carter edited this page Nov 14, 2017 · 4 revisions

This page is a work in progress.

Transitioning from v1 to v2

Version 2 of the distill template introduced some breaking changes to the article document structure. This page is intended to help you transition an article that was written to target version 1 of the template to one targeting version 2.

Sample v2 Document

<!doctype html>
<meta charset="utf-8">
<script src="https://distill.pub/template.v2.js"></script>
<d-front-matter>
  <script type="text/json">{
    "title": "Headline",
    "description": "Description",
    "authors": [
      {
        "author": "Shan Carter",
        "authorURL": "https://",
        "affiliation": "Google Brain",
        "affiliationURL": "https://"
      }
    ],
    "katex": {
      "delimiters" : [
        {"left": "$", "right": "$", "display": false}
      ]
    }
  }</script>
</d-front-matter>
<d-title>
  <h1>Headline</h1>
</d-title>
<d-byline></d-byline>
<d-article>
  <h2>Section Headline</h2>

Renamed tags

For consistency all tags in version 2 begin with a d- prefix. The footnote tag dt-fn has been renamed d-footnote.

New markup structure

d-article is no longer the only top-level tag. By convention we suggest moving your h1 and optional subheading into a new d-title top level element. Your subheading which used to be an h2 should become a p tag.

New frontmatter tag

Frontmatter has moved into a script tag within a d-front-matter tag. It is no longer written in YAML but in JSON.

<d-front-matter>
  <script id='distill-front-matter' type="text/json">{
    "title": "Why Momentum Really Works",
    "description": "Although extremely useful for visualizing high-dimensional data, t-SNE plots can sometimes be mysterious or misleading.",
    "published": "Jan 10, 2017",
    "authors": [
      {
        "author":"Chris Olah",
        "authorURL":"https://colah.github.io/",
        "affiliation":"Google Brain",
        "affiliationURL":"https://g.co/brain"
      },
      {
        "author":"Shan Carter",
        "authorURL":"https://shancarter.com/",
        "affiliation":"Google Brain",
        "affiliationURL":"https://g.co/brain"
      },
      {
        "author":"Ludwig Schubert",
        "authorURL":"https://shancarter.com/",
        "affiliation":"Google Brain",
        "affiliationURL":"https://g.co/brain"
      }
    ],
    "katex": {
      "delimiters": [
        {"left": "$$", "right": "$$", "display": false}
      ]
    }
  }</script>
</d-front-matter>