theme/
├── assets/
├── bin/
├── scss/
├── settings/
├── templates/
├── translations/
├── manifest.json
├── script.js
└── style.css
assets/
The assets/ folder contains all custom files used by the theme, including JavaScript and CSS files for our extensions and theme framework. You can add and use your own theme assets by adding files to the assets/ folder. For example, when adding a custom font to your theme you may wish to host the font files within the assets/ folder.
bin/
The bin/ folder contains Ruby and JavaScript files responsible for generating theme setting translations and compiling Sass source files mentioned below into CSS.
scss/
The scss/ folder contains the theme’s Sass source files which you can compile the theme’s stylesheet. Sass lets you use features that don’t exist in standard CSS yet like variables, nesting, mixins and inheritance. Using Sass is completely optional and an alternative to editing the theme’s style.css file directly, but it can make writing custom CSS much faster and more enjoyable.
settings/
The settings/ folder contains images associated with settings defined in the theme’s manifest.json file. For more information, refer to Zendesk’s documentation for the File setting type.
templates/
The templates/ folder contains editable page templates that define the layout of each page type, as well as the global header and footer. Each template is written using Zendesk’s templating language called Curlybars.
translations/
The translations/ folder contains translated labels and descriptions for each theme setting. You should only need to modify these if you add your own custom theme settings and can do so 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 Zendesk Guide. You can use it to add or edit theme settings.
script.js
The script.js file contains basic JavaScript for your theme. It’s a great place to add your own custom functionality. Functionality provided by our theming framework and extensions are added separated through the use of theme assets. The core extensions used by every theme are bundled into the extensions.js file in the assets/ folder.
style.css
The style.css file contains the main styles for your theme, compiled from the Sass source files. You can edit this file locally or through the Zendesk Guide interface, but when making significant changes we recommend taking advantage of the power of the Sass language and the files in the scss/ folder.