Design

Design settings determine the look and feel of the knowledge base project, including adding a favicon, choosing the layout, logo, colors, and font family settings.

Accessing Design

Go to Settings → Knowledge base site → Design

Changing the Favicon

Favicon (short for favorite icon) is a small icon, usually 16x16 pixels, used by web browsers to identify your website. The favicon appears in the browser tab for the website, the bookmarks list, and the browsing history list.

1. Go to Settings → Knowledge base site → Design
2. Hover over the default favicon and click on it
3. Now, you can add a favicon in one of two options available:
   • Using a URL: Paste the image URL from any external source and click on Insert
   • Upload an image: Choose your file from the Drive or Upload an image from your local computer storage and click Insert
4. You can see a preview of the chosen favicon on the right frame
5. Click Save

Changing the knowledge base Layout

1. Go to Settings → Knowledge base site → Design
2. Under Layout, you can find Center layout and Fluid layout
   • Center layout will fit your content more to the center in a browser window
   • Fluid layout will extend your content to the edges of a browser window. In this layout option, you can choose between Small and Medium indent.
3. Select the desired layout
4. Click Save

Adding Logo

Replace the default "YourLogo" that displays in the top left of the knowledge base by uploading your desired logo.

1. Go to Settings → Knowledge base site → Design
2. Under Logo, select the desired checkbox. You can keep an image or text as logo
   To add an image as logo:
   • Select YOURLOGO or Image. Now, you can add logo image in one of two options available:
     • Using a URL: Paste the image URL from any external source and click Insert
     • Upload an image: Choose your file from the Drive or Upload an image from your local computer storage and click Insert
   • You can see a preview of the chosen logo image on the right frame
   • Click Save

To add text as logo:

• Select the text checkbox and add the desired text

For example, you can add company name or tag line instead of a logo image.

• You can see a preview of the chosen logo text on the right frame
• Click Save

Adding logo URL

Add a clickthrough URL to your logo with the Logo URL. When a user clicks the logo, it redirects to the added logo URL.

1. Go to Settings → Knowledge base site → Design
2. Add the desired URL in the Logo URL field
3. Click Save

Changing the color theme

Add primary and secondary color to enhance the user experience in the knowledge base.

1. Go to Settings → Knowledge base site → Design
2. Primary color

• Click the Primary color palette
• Choose the desired color from the color picker or enter the desired Hex, RGB, HSL color code

The primary color will display on the top bar and logo text of the home page and documentation portal.

• You can see a preview of the chosen color on the right frame

3. Secondary color

• Click the Secondary color palette
• Choose the desired color from the color picker or enter the desired Hex, RGB, HSL color code

The secondary color will display in the drop-down and hover options.

• You can see a preview of the chosen color on the right frame

4. Click Save

Font family

You can change the fonts of your Knowledge base.

1. Go to Settings → Knowledge base site → Design
2. Under Font family, you can choose the body font and heading font. Click on the desired dropdown and a list of available font appears
3. Select the desired font. You can see a preview of the chosen font on the right frame
4. Click Save