A new approach to theming

Learn about our powerful theming framework, designed to create beautiful and unique themes

  • Understanding our theming framework

    Our themes and plugins make it easy to deliver a branded Zendesk Help Center to your customers in record time. Whether you need a ready-made template or the ability to customize pages quickly and confidently, we provide you with everything you need to get the job done.

    Some theme providers attempt to provide layout and styling options through the use of theme settings alone, but this approach doesn’t come close to addressing the countless possibilities that exist. Because these themes are limited to a set of options defined by the theme author they often look the same and are difficult to customize and maintain.

    What makes your themes different?

    Our themes and plugins are all built on top of a powerful theming framework which provides a structured approach to customization and allows layouts to be copied between themes or from our ever-growing Pattern Library. You can think of the framework as starting with low-level settings and gradually building up to patterns which can occupy entire pages.

    • Settings offer direct control over basic aspects of your theme’s appearance, including color palettes, fonts and images. Changes made through both theme settings and Sass variables are reflected in the theme’s base styles and form the foundation on which everything else in the framework is built.

      Learn about settings

    • Utilities are single-purpose class names that you can use to make quick, specific changes to existing layouts. There are utilities for almost everything you could want to change, including colors, typography, positioning and sizing. They can even be combined to create entirely new designs.

      Learn about utilities

    • Elements are building blocks that you can use to update or create new page layouts. They include common website and Help Center components like buttons, lists, cards, rows and columns. As with utilities, you can combine them to create new layouts or define your own using custom CSS.

      Learn about elements

    • Patterns are predefined layouts, ready to copy, paste and tweak. They are often compositions of both elements and utilities and can be copied in their entirety between themes or directly from the Pattern Library. Use patterns to get ideas and significantly speed up the design and development process.

      Learn about patterns

    • Plugins instantly extend the functionality of your Help Center in ways that are not possible using Zendesk’s standard templates alone. They can be used anywhere in the theme, both as a part of broader page layouts and within article content.

      Learn about plugins

    This makes branding and customization faster, allows for rapid prototyping of ideas and ensures that changes are made in a consistent way based on the parameters decided by you when configuring top-level settings. There’s a practically unlimited number of ways that you can combine elements and patterns, to say nothing of the changes that you can bring about with utilities. The only constraint you’ll face is your own imagination.

    Of course if one of our themes already meets your requirements, you can simply import it into Guide without making any changes at all!

  • 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.

  • Getting familiar with our pricing

    Our complete theming package is just that: everything you need to create an amazing, customized Help Center.

    A single purchase grants you immediate access to:

    • All of our themes and plugins
    • The Pattern Library
    • Comprehensive documentation
    • Premium support for three months

    You also get lifetime access to product updates, including themes, plugins and patterns released after the date of purchase.

    Each purchase includes a multibrand licence allowing you to use our products on all brands belonging to your Zendesk account.

    We’re available to assist with advanced customization if required and also offer extended support for those that are interested.

  • Requesting additional services

    Every purchase gets your immediate access to all of our themes and plugins, built on top of a powerful framework designed to make it quick and easy to create a unique and beautifully branded Help Center for your company. This includes free theme installation in your Zendesk Guide account as well as three months of premium support.

    If you don’t have the time to create your own custom theme using our theming framework, we can help. Here are some of the ways that we can help you deliver an amazing customer experience:

    • Branding involves updatintg the colors, fonts, images, icons and content element to perfectly match your company brand. This can include updating the page header and footer to match that of your company website.

    • Customization can range from simple layout changes to building an entirely new Zendesk Guide theme. We can also help build new and exciting functionality specific to your industry or use case.

    • We don’t just do themes. We can help you improve your agent experience as well through custom Zendesk Support, Chat and Sell apps. We’ll manage the entire process from design through delivery.

    Visit our Services page for more information.

    We are experts in design, development, UX and (most importantly) Zendesk and offer a full warranty on our work. Your satisfaction is guaranteed.

    If one of the themes from our ever-growing collection ticks all of the boxes for you, we offer installation with every purchase. Getting up and running with couldn’t be easier.