Building one Support Center for all of your Brands

Last Updated -

This article refers to a customized setup to nest all of your brands under the one Support Center. For the standard Multibrand setup, please see this article: How to set up multiple brands in Desk.com
 


What is Multi-Brand?

Multi-Brand is a feature from Desk.com (included in the Pro and Business Plus plans) that allows you to create multiple support centers, all tied to your single Desk.com account. Each support center is called a "brand" in Desk. By default, Desk sites start with a single support center, and thus one brand. By enabling Multi-Brand, you can create as many brands as you need. Managing content across your brands is very easy within your Desk.com Admin's Content section. You can also create a unique theme per brand, or share a single theme across your brands.
 

Prerequisites

  • Administrator access level or above.
  • Understanding of HTML and/or CSS.
  • Familiarity with Liquid to easily customize the appearance of Desk.com Support Center. For more information about Liquid, see List of Liquid Variables.
 

In this guide

In this guide you will learn how to setup a multi-brand support center, with each brand nested under a main Home page. This article explains how to turn on Multi-Brand, how to create a Shared Theme for your Multiple brands, and how to create a "Home" brand to serve as a sort of 'Table of Contents' for all your brands.

 

Enable Multi-Brand

  1. Enable Multi-Brand: Go to Admin > Settings. On the "Site Settings" page that follows, ensure the setting labeled "Multi-Brand" is toggled On and click Update at the bottom. If the text in this section says "Cannot disable with more than one brand configured", this means Multi-Brand is already enabled.
  2. Rename your default brand to 'Home': Go to Admin > Channels. With Multi-Brand enabled, you see a screen titled "Brand Overview". Click the pencil next to the brand name to change it.
 
 



Add Brands

  1. Create 1 new brand per product / department: For every brand you'd like to create, click “Add Brand” and create a brand. Although brand names aren't visible to your users by default, you may decide to customize your web theme down the road so that brand titles are visible. So it's best to clearly title brands based on the product, department, or topic they cover.
  2. As you create brands, feel free to upload an optional brand logo. Also keep in mind you can always come back to this page and create, edit, or delete brands in the future.
  3. You will now be able to toggle between your brands to update any settings for each separately.

 

Create a Shared Theme

With one or more brands, it's time to give your brands a custom web theme. A web theme, also called a template, is a collection of web code (HTML, CSS, JavaScript) that dictated how your support center looks and feels.

A theme that any brand can use is called a "Shared Theme". The benefit of sharing a single theme across all brands, as opposed to each brand having their own theme, is you can manage the look and feel of all brands with a single theme. This makes managing your multiple portals easier, as long as the look and feel isn't drastically different per brand.

  1. To create a new shared theme, click Support Center on the left navigation and then click into Web Themes from within that section. At the top of this page, click + Add Theme to create a new web theme. You can title this theme whatever you like, such as "Global Theme" or "Multi-brand Theme", then click Add.
  2. With your new theme created, find the theme in your list of themes and click both Default to make it live and Shared to give all future brands you create the ability to use this theme.




Insert special code to list links to brands for your 'Home' brand

 

Modify your shared theme so that your home brand lists out links to all your other brands. One way of approaching this is giving your Home brand its own unique theme. However, we recommend using a Shared Theme for all your brands if possible, as it consolidates your code and keeps your look and feel consistent across all brands. We'll use special conditional logic in your Shared Theme to do this.

  1. First, click the title of your newly created Shared Theme to edit it. When the editor opens, click onto Advanced Themes tab at the top.
  2. Welcome to the Advanced Editor! This powerful tool gives you direct, 'under-the-hood' access to all of your support center code. To edit the home page, click into 'Page (Index)' on the left-hand side. Our goal is to work in the below logic onto the page, adding the standard code where it states <!--Normal code-->:

  3. To do this, we work in this if/else statement so that if the brand is "Home", it renders the brand links. Otherwise, it shows the typical list of topics / articles.


Modify breadcrumbs to refer back to 'Home' brand

 

Modify the breadcrumbs at the top of each page so that it's easy to navigate back to your Home brand. As an example, take a look at the default breadcrumbs for your article page:

The 'Home' link, by default, goes to the home page of the current brand you're on. Change this link to instead point to your Home brand, then add an additional level to the breadcrumbs to show which brand you're in. Here's how we've modified the above breadcrumb for Article page to accomplish this:


Create a 'brand' case custom field

 

As cases flow into Desk from your support center contact form, it's nice to know which brand the case is concerning. The first step to storing this data is creating a case custom field for brand.

  1. Navigate to Admin > Cases > Cases.
  2. On the Custom Fields page of this section, click + Add Field. You can title this field "Brand", with a key of "brand", and type equal to List. Then, create an option per brand name. It's very important that the name of the brand matches perfectly here, or this field won't be set correctly when the user submits the contact form. Along this same line, if you ever update your brands, you need to also update this custom field to match perfectly. When you're done, just click Add.


Modify contact form code to capture brand when submitting contact form

 

Now with a custom field for brand, modify your contact form to populate this field when the user submits your contact form.

  1. Go to Channels > Support Center > Web Themes from within that section. Click onto the title of your newly created Shared Theme to edit it. When the editor opens, click onto Advanced Themes tab at the top.
  2. On the left-hand side, click into "Email (New)" to view your support center contact form code. Towards the bottom, right above {{form_end}}, add this code:
  1. Click Update.
 

Further Customizations

You can expand upon the code samples from this article to do more advanced customizations, such as brand-specific styling, showing unique headers or footers per brand, and more. Desk.com gives you a deep level of access to your support center code, but it can sometimes be overwhelming. If you ever get stuck, feel free to reach out to our Customer Wow team by emailing support@desk.com.