Knowledge base styles

[radko]

Hi!
Is there any way how to modify CSS of the knowledge base like used font family?
Thanks!

[roisinkirby · Accepted solution]

This conversation is around the tool as it is built currently; if you would like to upvote the ability to further customize this tool going forward, please visit our ideas forum, including this idea.

Hey @radko at this time the Knowledge Base can only be customized in the following ways:

Click the Customize tab to edit the appearance of your knowledge base:

• Navigation bar - here you can customize the way your knowledge base appears in a web browser:
  •  Favicon - the small image that appears at the top of the browser tab.
  • Company logo - your knowledge base logo image.
  • Name your knowledge base -what you want your knowledge base to be called, e.g., Help Center or Knowledge Base.
  • Company website URL - the link for your company website, this will be linked to your logo image.
  • Text link to your company website -  this text will appear in the upper-right corner of your knowledge base, linking to your Company website URL.
  
• Header - this is the content that appears in the top section of your knowledge base website:
  
  • Welcome message - this displays above the search bar on your knowledge base home page.
  • Header color - select a color bubble or use the color picker to enter or select a custom color. This color will fill the space behind the search bar.
    
  
  • Header background image - in place of a Header color, you can upload your own background image to fill the space behind the search bar. Click Browse images to choose an image from your file manager, or Upload to select a new image from your computer.
• Links - this color will be used for any text links throughout your knowledge base.
• On the left side of your Customize settings, you'll see a live preview of how your knowledge base will appear on different device types. Use the tabs to adjust the preview and see how your knowledge base will appear on different device types. This preview will update with all your changes in real time.

 

Please be advised that while there are no public roadmaps at this time this is a brand new tool that HubSpot will be constantly improving and expanding based on feedback.

[MSmith07]

The KB is a joke, it's embarassign how poorly supported this important feature is. Service should be free until they make it more useable.

[JoeMayall]

Hi folks!

If you're looking for more information about knowledge base design and layout, including custom HTML/CSS, I encourage you to check out this post from our knowledge base Product manager.

Best!

Joe

Ideas Forum Manager

[rrumpf19]

We would like to adjust the number of articles presented in each category/subcategory on the main index page. Currently there are only two articles listed before the 'view more' button.

We're working on creating a recently added or 'trending' category, but it almost defeats the purpose if users get to the index and have to dig to find the article(s) they're looking for. 

[jennysowyrda · Accepted solution]

Hi all,

If you would like to see more customization implemented in the future, I would recommend upvoting this idea in the ideas forum.

Thank you,
Jenny

[rrumpf19]

@jennysowyrda It doesn't seem like the idea you mentioned includes any insight from the Hubspot team. Could you please shed some light on when these knowledgebase features will be either prioritized, or completed? 

[jennysowyrda]

Hi @rrumpf19,

While not all ideas have comments from the HubSpot team, ideas are regularly monitored and reviewed by the HubSpot team. 

I do not have an update around if and when this idea will be completed, however the best place to share your thoughts and suggestions will be through the idea, as that is the space monitored by the product team.

Thank you,
Jenny

[RHearnRencore]

The changes that have been made to the styling of the Knowledgebase has been steps in the right direction, being able to apply a .css would be brilliant. Having more editing options on the standard template would be awesome. I would like to change the "kb-search-section" banner so that it does not take up half of the page, just being able to lower the height of this would improve the landing page tremendously.

Keep Up the good Job. Please don't stop and give us all the customizations we want.

[brianserocke]

Would really love for the ability to define custom knowledge base styles to be implemented.

It is disappointing that the knowledge base doesn't include the ability to match front-end form styling and other classes to landing pages or website pages. The knowledge base is supposed to be an extension of the company's brand and a platform for their current customers to use. Have a slightly disconnected front-end experience hurts the brand and makes the company look inconsistent.

[cwishart]

I want to customize the header and fonts to match my brand, currently there are no real customizations options. 

Please allow us to do so.

[Sneeps]

If there was a way to currently display more than two articles on the homepage of the Knowledge Base, that would be very beneficial.  I am suggesting this because we would like users to have the ability to try and find their issues from that page rather than relying so much on the search bar itself, or clicking on "See all articles".  Plus, it makes you look like you have some more content than just a few articles in general.  

[Stratshock]

This. We need the ability to edit the knowledge base template, as well as the ability to display more than two article.

[Sharni-styles]

Our company would also love to be able to customise the Knowledge Base Centre!

[mollymetzger]

I would love this functionality!! Please allow us to edit the template and CSS styles of Knowledge Base. 

Having featured images for categories or articles would be fantastic -- Even something as simple as having tiles and icons would make it look so much better. Here is an example: https://www.ebates.com/help

[Marcey]

I would love to have some HubSpot Template designs for the knowledge center!

[Sharni-styles]

Our company would also love some Hubspot Template designs!

[raylawrence]

Sure, but even te chance change to sans-serif font would go a long way.

[siddharthlatest]

Really need this feature. Cutomization with CSS would be great (along with some templates from you guys), but you need to change to using good default fonts ASAP.

[roisinkirby · Accepted solution]

This conversation is around the tool as it is built currently; if you would like to upvote the ability to further customize this tool going forward, please visit our ideas forum, including this idea.

Hey @radko at this time the Knowledge Base can only be customized in the following ways:

Click the Customize tab to edit the appearance of your knowledge base:

• Navigation bar - here you can customize the way your knowledge base appears in a web browser:
  •  Favicon - the small image that appears at the top of the browser tab.
  • Company logo - your knowledge base logo image.
  • Name your knowledge base -what you want your knowledge base to be called, e.g., Help Center or Knowledge Base.
  • Company website URL - the link for your company website, this will be linked to your logo image.
  • Text link to your company website -  this text will appear in the upper-right corner of your knowledge base, linking to your Company website URL.
  
• Header - this is the content that appears in the top section of your knowledge base website:
  
  • Welcome message - this displays above the search bar on your knowledge base home page.
  • Header color - select a color bubble or use the color picker to enter or select a custom color. This color will fill the space behind the search bar.
    
  
  • Header background image - in place of a Header color, you can upload your own background image to fill the space behind the search bar. Click Browse images to choose an image from your file manager, or Upload to select a new image from your computer.
• Links - this color will be used for any text links throughout your knowledge base.
• On the left side of your Customize settings, you'll see a live preview of how your knowledge base will appear on different device types. Use the tabs to adjust the preview and see how your knowledge base will appear on different device types. This preview will update with all your changes in real time.

 

Please be advised that while there are no public roadmaps at this time this is a brand new tool that HubSpot will be constantly improving and expanding based on feedback.

[crmal91]

This really is a feature we would like to see introduced.  The current font option looks horrendous.  We were able to change the fonts in some of the marketing products such as the blog we created.  We should be able to have the same customer facing fonts across your product suite.

[fwchris]

I just had a talk with my support agent today.

It's not only "uninspiring" as another commenter put it; it's absolutely disingenuous when we see how nicely the Hubspot articles appear right in the chat window, and in the browser and compare it to what we as paying customers get. 

I counted 3 different fonts (2 san serif and 1 serif), and the article body font looks like the default Times New Roman font. At first, I thought that my pop-up blocker had killed whatever was controlling a style sheet or something. Then I realized that there was no way to edit the font in the Knowledge Base. I'd be happy to have at the very least the  basic Hubspot font as a default available. 

It's mind-boggling how something so basic is not even offered, whereas solutions like Zendesk's Knowledge Base and Intercom's Articles (example), cover this.