What is a Pagedip Theme?

A Pagedip theme is a bundle of templates and assets that give a Pagedip its design and user experience. When a creator uses the Pagedip Writeroom, they are only entering the content seen on the page. Everything else, fonts, colors, navigation and more, is a product of the theme.

A Pagedip theme is formally a folder of files, organized by type:

  • theme.json - A JSON file containing theme metadata.

  • HTML Templates - Nunjucks templating system, providing structure to pages.

  • Scripts - to write ES6 JavaScript, you'll need to configure Webpack with Babel

  • Preview - Markdown content for local development.

  • Assets - Files accessible to the theme (images, fonts, etc).

  • webpack.config.js - configuration for building with Webpack

In general, this means that a Pagedip theme usually looks like the following:

my-pagedip-theme/
assets/
logo.jpg
styles.css
preview/
main.md
page.json
scripts/
index.js
templates/
main.html
layout.html
theme.json
webpack.config.js

All of the folder and file names are configured in the theme.json file and you can decide where to put things. Check out the directories, styles, and scripts properties.

Additionally, themes are not required to have all of the various file types. If you theme does not have scripts, for example, you can omit them.