In Help Center settings, you’ll find lots of customization options to help you brand your Help Center and control how it appears for your customers. Here’s how to configure and preview changes to a Help Center in real-time.
General settings
Manage the set up of Languages, Privacy, Domains, Analytics, Integrations, and Publishing from ⚙️ Settings in the General tab.
If you use Multi Help Center, you can configure the Settings for each Help Center separately.
Supported languages
To choose a Default language, go to Settings > General > Supported languages and select your default language, then click Save and set live.
Once you choose your Default language, the user interface of your Help Center will read in the language you set. This will change the language of your:
Search prompt on your homepage.
Article count, author and last modified date.
Reactions prompt on your articles.
‘We run on Intercom’ logo and more.
Note:
You can also support multiple languages in your Help Center.
If you’d like to change the language of the Messenger, you need to do this separately in your Messenger Settings.
Website publishing
When you're ready to go live, this is where you can publish and turn on your public Help Center website.
Domains
Use your default domain
When you publish a Help Center, we make your content available through an Intercom domain by default. So, first make sure your Help Center is turned on.
Then go to Settings > General > Domains to get your default Help Center URL. Your app name will form part of your URL. For example, if your app name is ‘ExampleApp’ your URL would look like this:
You can edit the app name part of your URL (e.g. exampleapp) to whatever you like.
Set a custom domain
If you’d prefer to make your content available through your own domain, you can set up a custom domain.
Go to your DNS provider (e.g. GoDaddy, Cloudflare, DNSimple or Route53, etc.) and create a CNAME record with a target host of custom.intercom.help. We’ve created this guide to help you or your engineer set this up.
Note:
Both subdomains (e.g. help.exampleapp.io) and subpaths (e.g. exampleapp.io/help) are supported.
DNS changes can take up to 72 hours to take effect but they typically happen much faster.
Then go to Settings > General > Domains to enter your domain URL and click Save and set live.
You can also choose to disable search engine indexing and keep your articles private.
Content
To manage how content appears inside your Help Center homepage, collections, articles, header and footer, go to the Help Center ⚙️ Settings and open the Content tab.
If you use Multi Help Center, you can configure the Settings for each Help Center separately.
Header
Logo
From Settings > Content > Header, upload a high-resolution version of your logo. This shows on the left-hand side of your header image, and in grayscale at the bottom of the page.
Recommended ratio: 5:1. 1MB max, 720px maximum width/height.
Header links
From Settings > Content > Header, you can also add multiple links to other websites such as your blog or community.
Welcome message
From Settings > Content > Welcome message, you can add user attributes to the welcome message on your Help Center homepage. It will include the user attribute if the user is logged in or a fallback value if not.
Note:
The user attributes will only be present if the customer has set the user data in some way. Example: Via the javascript API, Setting up logged in users, etc.
The welcome message can be configured in up to 38 languages.
Layout
Collections
From Settings > Content > Layout, choose between 1, 2, or 3 columns layout.
Then select a Collections card style:
Classic - The current collection card style.
Visual - Uses a bigger space for icons and images.
Compact - Shows the most important information using minimum space.
When you click on a card style, a preview will automatically be shown on the right.
All card styles are responsive and look great at any resolution, including mobile.
Further customize your Collection card style from the Styling tab.
Articles
If you do enable Articles on the homepage, you can also select the locale for those articles, give this section a Title, and then Select articles to display. You can select up to 12 published articles in your Help Center.
Note:
For each locale, you can select only published articles that have the translation in that language.
Articles with audience targeting rules applied can be selected and shown here but will only appear to the customer if they match the audience rules.
The preview will only display the article links for the default locale.
Order
To display Articles above or below your Collections on the homepage, simply use the drag and drop to reorder them.
Authors
From Settings > Content > Authors, you can choose to show or hide the article author in your Help Center homepage and article page.
Content descriptions
From Settings > Content > Content descriptions, choose to show or hide Content descriptions on the Collections page. Hiding descriptions makes it easier to scan through your articles, showing descriptions helps customers understand what to expect inside that collection.
Table of contents
From Settings > Content > Table of contents, choose to automatically show a table of contents on each article using any H1 or H2 headings in your articles.
Related Articles
From Settings, go to Content > Related Articles, where you can choose to display up to 5 related articles below each article in your Help Center.
Footer
From Settings > Content > Footer, you can add your logo and multiple links to your website, social media channels and contact information in the footer of your Help Center.
If you add social media links, they'll appear as clickable icons.
You can also add your contact information (phone number and/or address) to the footer.
Social media images
Favicon
From Settings > General > Social media images, you can upload a high-resolution favicon. This favicon appears before the title on your customers’ browser tab.
Recommended ratio: 1:1. 150KB max, 588x588 maximum.
Social media image
You can also upload a high-resolution social media image. The social media image appears when your Help Center or articles are shared on Facebook, Twitter, or any other social media platform.
Recommended ratio: 1.91:1, 2MB, 1200 x 630 dimensions.
Styling
Change the color and style of your Help Center to suit your brand from ⚙️ Settings in the Styling tab.
If you use Multi Help Center, you can configure the Settings for each Help Center separately.
Header
Sub-header
From Settings > Styling > Header, choose to show or hide the Sub-header. If shown, the sub-header will contain the logo and header links. It can be customized independently of the header with a background and font color of your choice.
The sub-header will push other content down as opposed to sitting on top of other content.
Background color
You can also style the main header background, gradient and text. The background color you choose will be applied to these items:
Avatar's icon color (when no image is available).
Links in articles.
Your header color and gradient, or image upload.
Fade background (if using a color gradient).
Text color
The text color you choose will be applied to:
Links in the header.
Text in the Search bar.
Header image recommended ratio: 5:2. 2MB max, 3000px maximum width/height. This appears at the top of your homepage and on each page of your Help Center - so add a strong image that represents your brand.
Fade background appears only on the Help Center homepage.
Height
Choose an overall height for the Help Center header on the homepage. Minimum height of 245 pixels and a maximum height of 600 pixels.
Search Bar
From Settings > Styling > Search Bar, choose from three different Search Bar sizes, and then select the alignment:
Vertical - left or center.
Horizontal - top, center, or bottom.
You can also select a Corner radius for the search bar. Minimum of 0 pixels and a maximum of 30 pixels.
Font
From Settings > Styling > Font, choose from a list of curated fonts for use in your Help Center:
Primary font - Used in Welcome Message, titles and headings.
Secondary font - Used for descriptions, article body text and all other text
Available Font Options
Bitter
Inter
Lato
Lora
Montserrat
Open Sans
Oswald
Playfair Display
Poppins
Noto Sans
Noto Serif
Raleway
Roboto
Roboto Mono
Roboto Slab
Note:
Selected font does not apply to the Messenger, which will always use the system font.
The font we used previously proxima nova has been removed as of June 2023; you can use Montserrat or Open Sans to achieve a similar look.
Shared Elements
Go to Settings > Styling > Body to change the body background Color and all the Help Center pages (home, collection, article, search, error pages, etc.) will adapt accordingly.
Then set an Action color that contrasts well with the body background as it will be used in buttons, links and other elements.
Action color will not update for icons uploaded in JPEG/PNG/GIF format.
Here, you can also choose your Collection card design:
Use bordered or floating card design.
Control the radius of card designs.
Collections
From Settings > Styling > Collections, you use icons, images or text only for your collection cards.
If using icons, you're able to change the following colors:
Icon color: Select the color using the color picker or enter a hex code.
Icon background:
Color - Select the color using the color picker or enter a hex code.
Image - Upload an image.
Gradient - Create a gradient using up to three colors using the color picker or enter a hex code.
If using images, this will fill the collection card background, so it works really well with the visual template.
Individual collection cards can also be styled by choosing the collection from a dropdown.
Styles can still be applied to all collections by choosing the All collections option from the dropdown, this will overwrite any individual styles.
Note:
Icon color can only be changed on default icons or custom icons you've uploaded in SVG format.
Background color is optional and can be switched off.
Footer
In Settings > Styling > Footer, you can change the Background Color and Text Color in your Help Center footer.
Preview
It’s easy to visualize your branded Help Center and see any changes you've made in real-time before setting them live, using the Preview for Homepage, Collections and Articles.
You can also select different resolutions for Mobile, Tablet and Desktop screens.
💡Tip
Need more help? Get support from our Community Forum
Find answers and get help from Intercom Support and Community Experts