Theming
jackyalcine edited this page 7 months ago

Theming

Themes provide Koype with visitor-facing functionality for extending their experience without compromising system functionality. The goal is to provide an outward facing theme that’s used to present content on the site. Other parts of the core experience will be themed using Koype’s internally shipped theme and will remain unaffected.

Configuration Format

The configuration file is defined using JSON.

Format

{
  "version": "2018.12.20-125658",
  "name": "Jacky's Theme",
  "uri": "https://jacky.wtf/themes/mine",
  "colophon": {
    "author": {
      "name": "Jacky Alcine",
      "uri": "https://jacky.wtf"
    },
    "description": "A theme about a tiny, tiny world.",
    "tags": ["superman", "kandor", "comics"]
  },
  "properties": {
    "pages": ["home", "stream"],
    "posts": ["article", "note", "reply", "photo", "video"],
    "stream": true,
    "streamItems": ["article", "note", "reply", "like", "bookmark", "checkin"]
  }
}

Properties

A working list of the options expected in the configuration file.

Table of Options, Defaults and Description

Name Default Description
version 2018.12.20-000000 The version using YY.MM.DD-HHMMSS
properties.home true Provides a homepage layout.
properties.stream false Provides a stream layout.
properties.streamItems Same as posts. Informs what kind of stream items are available.
properties.posts ["article", "note", "like", "repost"] Supported post types.
colophon.author {“name”: “”, “uri”: “”} Information about theme author.
colophon.uri ”” Path to theme’s homepage.
colophon.uuid null The UUID to search up this theme on looks.koype.net
colophon.tags [] Tags to search up this theme with.
colophon.description ”” Description of theme.
colophon.name ”” Name of the theme.

Files

In order to build the page, the following files are needed:

  • root.html: Represents the root HTML file of the site.
  • pages/
    • home.html: Renders the home page.
    • stream.html: Renders a stream (if enabled)
    • follow.html: Provides information on how to follow the site.
  • posts/
    • ${TYPE}.html
  • indicies/: Path to pagination friendly pages.
    • post.html: Used to show a list of posts at once.
    • tags.html: Used to show a list of tags at once.
    • tag.html: Used to show a list of posts for one particular tag.
  • assets/: All of the extra assets desired by the theme.