Skip to main content

Building templates

How to build a template​

  1. Create a new slide, the same as any other, but place it in a folder titled templates at the root of the directory (see on-disk-structure).
  2. See the deck-wide editing guide to define which areas of the template are editable by operational staff.
  3. In the deck project file, define the Template with a key and title (see below).
  4. Publish the deck the usual way.

Example folder structure

.
├── sections
│   └── section_1
│       ├── index.html
│       └── slides
│           └── slide_1
│               └── index.html
├── templates
│   └── template_1
│       ├── index.html
│       └── slide.css
│   └── template_2
│       ├── index.html
│       └── slide.css
├── index.html
└── project.yaml

Example Project File (project.yaml)

version: 2
name: "Example Deck"
src: ./src
dist: ./dist
dimensions:
  width: 1920
  height: 1080
common:
  js:
    - js/deck.js
  css:
    - css/core.css
templates:
  - key: template_1
    title: "Template 1"
  - key: template_2
    title: "Template 2"

When a template is placed in the directory correctly, it will appear in CDK as a section header for previewing.

FAQ​

I already have a folder called "templates" in my project, can I change where templates are stored?​

Sadly, no. To use the templated slide feature, templates must be organised into the correct folder, and defined in the project file. If you are already using a folder called "Templates", you will need to update that folder title and any associated compile tasks.

Note that if you haven't added a reference to Templates in your project file, your deck will continue to work the same as before, so there's no need to update file references right away. As a best practice, we recommend prefixing all non-compiled or supplementary folders with an underscore (eg. _data, _assets).

I've followed the instructions but my templates still aren't loading, what do I do?​

These are some of the common culprits, obvious though they may be:

  • Is the CDK updated to the latest version?
  • Has the deck version with the template been approved, and is it the one being used by the app?
  • Has the app been updated to the latest version?
  • Is there a compilation task (gulp or similar) in your deck that is ignoring /templates?

The thumbnail previews of my templates look bad/wrong. How can I fix these?​

Like every other slide or section header, thumbnails are generated automatically based on the default content of the slide. This can be particularly problematic for Templates, since in many case they do not have any content, which can leave them looking like an empty screen.

Refer to the thumbnails overview for more information.

What is the relationship between templates, and any slides created from them?​

This explanation should help to set this out.