KB User's Guide - SitePref Tab - CSS for Full View

This document explains how fields in the Full View Layout / CSS screen can be used to modify the look and feel of a KB site.

The Full View Layout/ CSS Screen

Navigation: KB Admin Tools > SitePref Tab > FullView Layout/CSS link > Full View Layout/ CSS screen.

Links at the Top of the Screen

There are three links at the top the Full View Layout/CSS screen. The links lead to the default CSS file of each Site Layout. In the image below, which are provided for you to reference when updating the default values. The links are circled in red.

The table below gives a description of each Site Layout and provides an example.

Site Layout Name Site Layout Description Live Site Example
Landing page base layout CSS Fixed centered search only (without content/ side modules)Used in Unified Sites like the Wisconsin Knowledgebase
Default site base layout CSS Relative width (100% width up to 3 columns) Like the UW Arrow Help KB
Default site base layout CSS Fixed width (960px with 1 or 2 columns) Like the Campus and Visitor Relations KB

Internal Site Layout/ CSS & External Site Layout /CSS

The next section of the screen includes attributes for the optional "Fixed centered search only (without content/ side modules)" landing page, as well for the two main KB site layouts with 1 to 3 columns. Each Site (Internal and External) have their own set of attributes allowing each site to look distinct from each other.

The image below shows a detail of the External "landing page" attributes. These top five attributes are only needed if the "External landing page base layout CSS:" field is set to Fixed centered search only (without content/ side modules).

The fields are named 'External site logo image path', External site logo image size', 'External landing page base layout CSS', External landing page custom CSS path', and 'External landing page background images folder path'

Below the landing page attributes are six attributes for KB sites of 1 to 3 columns.

In the image below, you will see the attributes selected for the KB User's Guide External Site.

The Update button next to the top of each Site Layout/CSS section will update any modified fields on the page (even if they were changed under the other section).

Order of Loaded CSS

Your site CSS is loaded in the order specified on this page. This means that the CSS for your base layout loads first, followed by any custom CSS file provided, followed by the contents of any custom CSS in the enabled text field.

This way, you can rely on the base layout options to supply the majority of the site CSS, then overwrite particular rules as needed to customize colors, fonts, etc.

CSS present in individual KB documents (e.g. internal style sheets added to the page or inline CSS) will be loaded last.

KB Admin Tools Custom CSS

At the bottom of the page, there is an option to enable custom CSS for the KB Admin Tools. This is particularly useful if you are relying on custom CSS entered above to style document content, as you can ensure that the same content is similarly styled when those documents are being viewed in the KB Admin Tools.

KB User's Guide - SitePref Tab |