Visit Freshworks.com Visit Freshworks
Solved

How Do I Create A Stylesheet For My Knowledge Base?

  • 18 December 2023
  • 4 replies
  • 158 views
McGriff
Rank
Badge +2

I am not finding a way to create a CSS for my Knowledge Base. I would like to set my fonts and other settings globally. Even if I try to style within an article my code is stripped away.

How do I create a well styled Knowledge Base? 

Any assistance would be much appreciated!

 

 

icon

Best answer by McGriff 2 January 2024, 19:44

View original

4 replies

mbutler
Rank
Userlevel 3
Badge +8

Admin → Service Desk Rebranding → Customize Support Portal

This will give you the ability to customize your portal, support articles and put in custom CSS

McGriff
Rank
Badge +2

I don’t have that path available in my paid version. I can add custom CSS by editing my theme under Portal Customization. However, my custom CSS doesn’t seem to have an effect in my KB Articles.

 

For Instance, I added this code to my theme’s CSS:

.styled-text {
      font-size: 18px; /* Set the font size to 18 pixels */
      color: #333; /* Set the text color to a dark shade */
      font-family: 'Arial', sans-serif; /* Specify the font family */
      font-weight: bold; /* Make the text bold */
    }

 

Then in a “test” article’s Code View, I added the following:

<p class="styled-text">This is some styled text with a custom font size.</p>

 

I then saved the article and previewed it. I found that while it didn’t strip out my code, it didn’t have any effect on text. When I view the page source, I see the following for my paragraph:

<p class="styled-text">This is some styled text with a custom font size.</p>

 

It seems that you don’t have a “granular-level” ability to make changes to the CSS.

 

I wonder if you are only able to make changes to the “Place Holder’s” attributes?

https://support.freshdesk.com/en/support/solutions/articles/50000003753-customizing-your-customer-portal

 

Can someone comment on this topic? Have you been able to make CSS changes that will apply in KB articles?

McGriff
Rank
Badge +2

I have a few answers:

  1. You don’t have to use “Placeholders” from the drop-down list.
  2. You can’t create your own styles and use them in articles.
  3. Use the Inspector to identify “styles” and use them in the CSS page editor (.fw-content.fw-content--single-article.line-numbers).
  4. I was only able to change the font-family, font-weight, and background-color.

I am disappointed in the functionality of the customization abilities of the CSS page in the theme editor. However, from a support standpoint, I understand why FW severely limits CSS customization.

Hopefully, someone can demonstrate how they have been able to use the CSS page editor to add additional styles to their KB articles. 

mbutler
Rank
Userlevel 3
Badge +8

I have a few answers:

  1. You don’t have to use “Placeholders” from the drop-down list.
  2. You can’t create your own styles and use them in articles.
  3. Use the Inspector to identify “styles” and use them in the CSS page editor (.fw-content.fw-content--single-article.line-numbers).
  4. I was only able to change the font-family, font-weight, and background-color.

I am disappointed in the functionality of the customization abilities of the CSS page in the theme editor. However, from a support standpoint, I understand why FW severely limits CSS customization.

Hopefully, someone can demonstrate how they have been able to use the CSS page editor to add additional styles to their KB articles. 

Great post - thank you for following back up - I haven’t played with it at all other than to make my portal use my company colors and such. This is great info for my upcoming project where I’m going to try to make my KB pretty - I guess I’ll have to do that using their CSS.

Reply


Terms of UseCookie settings