Pattern skin provides a CSS based default look and feel - flexible and W3C
compliant. Its layout and color scheme are designed to provide a nice, clean and productive editing environment
Select a theme to change the look, or tune the entire appearance with CSS or templates.
Browse available themes
You may quickly change the appearance of this skin by setting a theme.
Pattern skin has quite some flexibility out of the box. Try one of the provided themes or use them as inspiration for your own theme.
Other styling options
Set these variables site wide in Main.Site Preferences
Click to enlarge:
Click to view full screenshot
Information for site administrators
Creating your own look
If you want to make more changes than the themes on this page allow, you have the option to change CSS files and templates to make changes (small or large).
Pattern Skin Customization
- how to configure page elements.
Style sheet customization
Pattern Skin Css Cookbook
- how to customize the visual style.
The original Photoshop files of the skin graphics (mainly background images) are attached to Pattern Skin Graphics
Top, Bottom and Left Bar customization
Most will customise top, bottom, and left bars.
System.WebTopBar defines the content of the top bar. If this topic does not exist the topic
System.WebTopBarExample will define the top bar. Foswiki does not ship with a
WebTopBar topic so by creating this topic as a copy of
WebTopBarExample and customizing the copy, you will not later risk that upgrading Foswiki will overwrite your top bar. The top bar is common for all webs.
System.WebBottomBar defines the content of the bottom bar. If this topic does not exist the topic
System.WebBottomBarExample will define the bottom bar. Foswiki does not ship with a
WebBottomBar topic so by creating this topic as a copy of
WebBottomBarExample and customizing the copy, you will not later risk that upgrading Foswiki will overwrite your bottom bar. The bottom bar is common for all webs.
WebLeftBar defines the content of the left bar. Each web has its own
WebLeftBar. If this topic does not exist the topic
WebLeftBarExample will define the left bar. Foswiki does not ship with
WebLeftBar topics so by creating these topics as copies of
WebLeftBarExample and customizing the copies, you will not later risk that upgrading Foswiki will overwrite your left bars. You can choose to display the
WebLeftBar on the right side of the screen.
See these topics for more information: Web Left Bar Cookbook
, Web Left Bar Example
, Web Left Bar Login
, Web Left Bar Personal Template
, Web Left Bar Search
, Web Left Bar Webs List
, Web Top Bar Example
, and Web Bottom Bar Example
You do not need to install anything on the browser to use this skin. The following instructions are for the administrator who installs the skin on the server where Foswiki is running.
PatternSkin is included with Foswiki by default. Use the following instructions only if you are upgrading PatternSkin.
- Download the ZIP file from the Skin Home page (see below)
PatternSkin.zip in your Foswiki installation directory
- Test if installed
- For skin activation see System.Skins
To set pattern skin as default (site wide) skin, use these settings in Main.Site Preferences
- Global skin styles. To change the look of the site, point these variables to custom CSS attachments.
- Set FOSWIKI_LAYOUT_URL = /pub/System/PatternSkinTheme/layout.css
- Set FOSWIKI_STYLE_URL = /pub/System/PatternSkinTheme/style.css
- Set FOSWIKI_COLORS_URL = /pub/System/PatternSkinTheme/colors.css
- Themes that add upon the global skin styles. Choose from the Theme Browser at Pattern Skin.
- Set PATTERNSKIN_THEME_VARIANT = /pub/System/PatternSkinTheme/variant_foswiki_noframe.css
- Set PATTERNSKIN_COLUMNS = /pub/System/PatternSkinTheme/column_left.css
- Overriding styles that add upon the global and theme styles. Enabled by default but empty to prevent browsers from fetching %USERLAYOUTURL%-style URLs.
- Set USERLAYOUTURL =
- Set USERSTYLEURL =
- Set USERCOLORSURL =
- Set WEBHEADERART =
- Set WEBHEADERBGCOLOR =
If you have set the SKIN setting to
and you still don't see the layout as on the screenshot
, a few settings in may have been disabled.
Check these preference settings
- FOSWIKI_LAYOUT_URL = /pub/System/PatternSkinTheme/layout.css
- FOSWIKI_STYLE_URL = /pub/System/PatternSkinTheme/style.css
- FOSWIKI_COLORS_URL = /pub/System/PatternSkinTheme/colors.css
- SKIN = macospolplatform
don't give a value or point to non-existing files, check in Default Preferences
and in Site Preferences
that the following preferences do exist and that they are set to on:
* %SYSTEMWEB%.PatternSkin settings:
* Set FOSWIKI_LAYOUT_URL = %PUBURLPATH%/%SYSTEMWEB%/PatternSkinTheme/layout.css
* Set FOSWIKI_STYLE_URL = %PUBURLPATH%/%SYSTEMWEB%/PatternSkinTheme/style.css
* Set FOSWIKI_COLORS_URL = %PUBURLPATH%/%SYSTEMWEB%/PatternSkinTheme/colors.css
customization of these values should be done in Main.Site Preferences
If this still does not work, contact the administrator who installs skins.
For further troubleshooting and feedback, go to http://foswiki.org/Support/PatternSkin
All PatternSkin topics
|| © Arthur Clemens
|| Preview with this skin
| Base Name:
|| 9926 (2010-11-09)
| 09 Nov 2010:
|| v.5.4.2: Remove redundant files from repository. v.5.4.1: Revert usage of
$percent back to
| 19 Aug 2010:
|| v.5.4 - Version for Foswiki 1.1.
| 31 Jul 2010:
|| v.5.3.1 - Documentation updates
| 27 May 2010:
|| v.5.3 - Added "flexible width" column styles.
| 05 Apr 2010:
|| v.5.2 - Visual update.
| 04 Apr 2010:
|| v.5.1 - Added Foswiki site skin as theme, including horizontal navigation topic; see Pattern Skin Horizontal Navigation Example.
| 04 Apr 2010:
|| v.5.0 - Changed themes from single css file to file collections to preserve older appearance and to provide bigger restyling within a theme.
| 12 Mar 2010:
|| v.4.0.9 - Fixes printing in Firefox 3.6.
| 23 Feb 2010:
|| v.4.0.8 - Signature format can be set in preference
| 17 Jan 2010:
|| v.4.0.7 - Repeat search phrase in search box. Version for Foswiki 1.0.9
| 07 Dec 2009:
|| v.4.0.6 - Remove spurious newline from attachagain template. Add support for new option to work around IE8 bug with slow/erratic textareas. Fix printing in Safari (thanks Foswiki:Main.MichaelMoss). Remove bogus info on setting view template on topic creation (thanks Foswiki:Main.MartinKaufmann). Make action buttons easier to skin. Fix textareabuttons not displayed when NOWYSIWYG=1.
| 29 Sep 2009:
| 07 Sep 2009:
|| v.4.0.4 - Consolidated versions in trunk and release branch. Version for Foswiki 1.0.7.
| 26 Jul 2009:
|| v.4.0.3 - Fixes a couple of minor template/css bugs.
| 18 Jan 2009:
|| v.4.0.2 - Fix printing with theme
| 17 Jan 2009:
|| v.4.0.1 - Fix reading of WEBHEADERART variable.
| 30 Nov 2008:
|| v.4.0.0 - Foswiki 1.0.0 RELEASE VERSION
| 03 Aug 2008:
|| v.3.0.1 - TWiki 4.2.1 (Edinburgh) RELEASE VERSION
| 13 Jul 2007:
|| v.3.0.0 - TWiki 4.2.0 (Edinburgh) RELEASE VERSION
| 15 Jan 2006:
|| v.2.0.6 - TWiki 4.1.0 (Edinburgh) RELEASE VERSION
| 26 Sep 2006:
|| v.2.0.5 - Fixed form background colors
| 22 Jul 2006:
|| v.2.0.4 - Refactored info in colors.css; fixed textarea color
| 26 Jun 2006:
|| v.2.0.3 - TWiki 4.0.3 (Dakar) RELEASE VERSION
| 31 Jan 2006:
|| v.2.0.0 - TWiki 4.0.0 (Dakar) RELEASE VERSION
| 28 Aug 2004:
|| v.1.0.9 - TWiki 3.0 (Cairo) RELEASE VERSION
| 08 Aug 2004:
|| Initial version (v1.0.0)
|| Foswiki:Extensions/TwistyPlugin (automatically provided with Foswiki)
| Skin Home:
Leave remarks, suggestions and other feedback in http://foswiki.org/Support/PatternSkin