Anatomy of a Theme

Chyrp Lite allows you to extend your blog with powerful themes that can radically alter its presentation and behaviour, using the Twig template engine. Themes are added to Chyrp Lite by copying them into the themes directory in the Chyrp Lite installation, where each theme should be located in its own subdirectory. A fresh install of Chyrp Lite comes with four themes.

Theme Structure

A Chyrp Lite theme is structured as follows:

• theme
  • content
    • post.twig
    • preview.twig
  • feathers
    • audio.twig
    • link.twig
    • photo.twig
    • quote.twig
    • text.twig
    • uploader.twig
    • video.twig
    • missing.twig
  • forms
    • user
      • register.twig
      • login.twig
      • controls.twig
      • lost_password.twig
      • reset_password.twig
  • info.php
  • javascripts
    • JavaScript files.
  • layouts
    • default.twig
  • pages
    • 403.twig
    • 404.twig
    • archive.twig
    • drafts.twig
    • index.twig
    • page.twig
    • search.twig
    • updated.twig
    • view.twig
  • stylesheets
    • CSS files.

Metadata

info.php

This file contains attribution and version information that Chyrp Lite will display in the administration console.

Layouts

The layouts directory contains default.twig that provides the container for every blog page rendered by Chyrp Lite.

Pages

The pages directory contains template twigs that extend default.twig in different contexts. If you add new pages to your blog, they can be given a unique appearance by adding a twig for them in this directory, using the naming convention page_<<page URL >>.twig.

403.twig

extends: layouts/default.twig

This twig is the template for a 403 (forbidden) error page.

404.twig

extends: layouts/default.twig

This twig is the template for a 404 (resource not found) error page.

archive.twig

extends: layouts/default.twig

This twig is the template for a page that displays a chronological archive of blog posts.

drafts.twig

extends: layouts/default.twig

This twig is the template for a page that displays the draft blog posts of a logged-in user.

index.twig

extends: layouts/default.twig

This twig is the template for a page that displays the blog index.

page.twig

extends: layouts/default.twig

This twig is the template for a page that displays a paginated blog post, if the pagination module is enabled.

search.twig

extends: layouts/default.twig

This twig is the template for a page that displays the blog posts returned a search.

updated.twig

extends: layouts/default.twig

This twig is the template for a page that displays updated posts in order of update.

view.twig

extends: layouts/default.twig

This twig is the template for a page that displays a single blog post in isolation.

Content

post.twig

This twig renders blog posts. It is extended by whichever Feather was used to create the post.

preview.twig

This twig renders previews in an iframe on the Write pages. The twig should display an approximation of how the text will appear in a published post or page.

Feathers

The feathers directory contains twigs dedicated to various Feathers.

text.twig

extends: content/post.twig

This twig allows Chyrp Lite to render plain text blog posts handled by the text Feather.

audio.twig

extends: content/post.twig

This twig allows Chyrp Lite to render audio posts handled by the audio Feather.

video.twig

extends: content/post.twig

This twig allows Chyrp Lite to render video posts handled by the video Feather.

link.twig

extends: content/post.twig

This twig allows Chyrp Lite to render link posts handled by the link Feather.

photo.twig

extends: content/post.twig

This twig allows Chyrp Lite to render photo posts handled by the photo Feather.

quote.twig

extends: content/post.twig

This twig allows Chyrp Lite to render quoted text blog posts handled by the quote Feather.

uploader.twig

extends: content/post.twig

This twig allows Chyrp Lite to render blog posts with attached files handled by the uploader Feather.

missing.twig

extends: content/post.twig

This twig is displayed as a fallback if the theme does not have a template to support a Feather type.

Forms

The forms directory contains twigs that contain HTML forms for various purposes.

user/register.twig

extends: layouts/default.twig

This twig allows a visitor to your blog to become a registered user.

user/login.twig

extends: layouts/default.twig

This twig allows a registered user to log in.

user/controls.twig

extends: layouts/default.twig

This twig allows a registered user to change various details, including their password.

user/lost_password.twig

extends: layouts/default.twig

This twig allows a registered user to reset their password.

user/reset_password.twig

extends: layouts/default.twig

This twig displays a password reset form that can only be accessed within 1 hour of request.

JavaScripts

The javascripts and js directories contain JavaScript files that will be loaded by the theme's pages. Files with names containing .inc.js will not be served to the visitor.

Stylesheets

The stylesheets and css directories contain CSS files that will be loaded by the theme's pages. Files with names containing .inc.css will not be served to the visitor, allowing you to @import them in one of your other stylesheets.