Forums/Documentation/CSS cookbook (Zendesk Classic)

Formatting the forum content headings

Anton de Young
posted this on August 08, 2011 14:15

The content in the forums is formatted separately from the main content area. This example describes how to do the following CSS customizations:

  • Set the font size and color for heading 2 and 3 in the forums
  • Set the font hover color for hyperlinks and add an underline

For more information about getting started with CSS customization in Zendesk, see How to brand your Web portal.

Before

forums_before.png

After

forums_after.png

CSS code

This code sets font properties for headings 2 and 3 in the forums. Heading 2 is used for categories and heading 3 is used for forum titles.
/* Set the formatting for .frame.colums */
/* This is the container for forums */
 
/* Set category heading size and color */
.content .frame.columns h2, .content .frame.columns h2 a {
  font-size: 20px;
  color:#6F7866; /* gray */
}
 
/* Set category heading hover size and color */
.content .frame.columns h2 a:hover {
  font-size: 20px;
  color:#669900; /* green */
  text-decoration:underline;
}
 
/* Set the font color of h3 active links */
.content .frame.columns h3, .content .frame.columns h3 a {
  color: #6F7866; /* gray */
} 
 
/* Set the font hover color of h3 active links */
.content .frame.columns h3 a:hover {
  color: #669900; /* green */
  text-decoration:underline;
}
 

Comments

User photo
Karl Simms
chameleonsupport

i know this over a year old hopefully reviving here, but... is it possible to style each individual form topic? ie have a diffrent background-color for each element?

November 22, 2012 07:12
User photo
Justin Seymour
Zendesk

Hey Karl: 

Not that I know of, but I don't want to tell you no just yet. It's possible that some custom code exists, though, I don't have any snippets in my party bag. 

November 24, 2012 11:45