Navigating the theme folder structure

Every Zendesk theme has the same folder structure, however there are some important additions for our range of themes.

Folder overview

├── assets/
├── bin/
├── scss/
├── settings/
├── templates/
├── translations/
├── manifest.json
├── script.js
└── style.css

assets/

The assets/ folder contains all custom files used by the theme, by default our framework-level JavaScript files.

bin/

The bin/ folder contains Ruby and JavaScript files responsible for compiling Sass source files into CSS and generating theme setting translations.

scss/

The scss/ folder contains the source Sass files used to compile the theme’s stylesheet.

templates/

The templates/ folder contains editable templates that define the layout of each page type, as well as the global header and footer. Each template is written using Zendesk’s full-featured templating language called Curlybars.

translations/

The translations/ folder contains translated labels and descriptions for each theme setting. If required, these can be updated using the update-translation.js file within the assets/ folder.

manifest.json

The manifest.json file contains information about your theme and is used to define the theme’s Settings panel in Guide.

script.js

The script.js file contains the compiled JavaScript for your theme. Because every theme is different, functionality provided by our plugins are added separated through the use of theme assets.

style.css

The style.css file contains the styles for your theme, compiled from the Sass source files.