By default, your knowledge base will include two items in your top navigation:
- A Contact Us link
- A Login/Logout link (if you have this option selected)
On pages besides the homepage, you'll also see a search bar up there:
You can customize this top navigation a bit to add a link to your own help desk, company intranet, or to match links on your main website.
To do so:
- Go to Settings > Style.
- In the area below the preview pane, be sure Custom HTML is selected.
- In the Custom HTML dropdown, select Top Navigation.
- Scroll to the bottom of the HTML and find the section with the navbar-right class:
- Each of the list items here is one of the elements of your top navigation. The list items at the top will appear furthest to the left; the items at the bottom will appear furthest to the right. To add a list item, add appropriate HTML into the correct spot on the list. If you're adding a hyperlink and you don't have custom HTML or Custom CSS to explicitly style those links differently, add the
hg-header-linkclass to the hyperlink so it displays the same size and color as your other top navigation links. If you have custom HTML or styles, you'll need to check those styles to add the appropriate classes. Here's some sample code for you to start with:
<li><a class="hg-header-link" href="https://www.knowledgeowl.com/terms-and-conditions" target="_blank">Terms</a></li>
- If you're using the sample code above, replace the href with the link you'd like. To open in a new tab, use target="_blank"; to open in the same tab, remove the target entirely.
- You can Preview Changes to see the new top navigation element in action.
- Be sure to Save once you've gotten the link to look how you'd like.
Here, I've added a hyperlink to our terms and conditions. Notice that it uses the hg-header-link class:
And here's how it will look in my knowledge base: