r2 - 01 Apr 2006 - 05:55 - Main.TWikiContributor | r1 - 01 Feb 2006 - 12:01 - Main.TWikiContributor | ||||
---|---|---|---|---|---|
PatternSkin CSS Cookbook |
PatternSkin CSS Cookbook |
||||
Questions and answers on how to customize the default look of TWiki for your own needs, using style sheets. For configuring page elements, see PatternSkinCustomization. |
Questions and answers on how to customize the default look of TWiki for your own needs, using style sheets. For configuring page elements, see PatternSkinCustomization. |
||||
Introduction |
Introduction |
||||
PatternSkin uses 3 style sheets (attached to PatternSkin): |
PatternSkin uses 3 style sheets (attached to PatternSkin): |
||||
|
|
||||
When customizing your TWiki installation, you can either choose to completely rewrite all css styles, or to selectively override some styles. The latter option is by far less time consuming, but all depends on your graphical wishes. |
When customizing your TWiki installation, you can either choose to completely rewrite all css styles, or to selectively override some styles. The latter option is by far less time consuming, but all depends on your graphical wishes. |
||||
When you need lots of graphic changes: Rewriting CSS |
When you need lots of graphic changes: Rewriting CSS |
||||
|
|
||||
* Set TWIKILAYOUTURL = %PUBURLPATH%/%TWIKIWEB%/YourNewTopic/layout.css * Set TWIKISTYLEURL = %PUBURLPATH%/%TWIKIWEB%/YourNewTopic/style.css * Set TWIKICOLORURL = %PUBURLPATH%/%TWIKIWEB%/YourNewTopic/colors.css |
* Set TWIKILAYOUTURL = %PUBURLPATH%/%TWIKIWEB%/YourNewTopic/layout.css * Set TWIKISTYLEURL = %PUBURLPATH%/%TWIKIWEB%/YourNewTopic/style.css * Set TWIKICOLORURL = %PUBURLPATH%/%TWIKIWEB%/YourNewTopic/colors.css |
||||
When you need small adjustments: Adding to existing CSS |
When you need small adjustments: Adding to existing CSS |
||||
With CSS you cannot remove already defined classes, you can only add to it, or overwrite existing styles. |
With CSS you cannot remove already defined classes, you can only add to it, or overwrite existing styles. |
||||
|
|
||||
* Set USERLAYOUTURL = %PUBURLPATH%/%TWIKIWEB%/YourNewTopic/layout.css * Set USERSTYLEURL = %PUBURLPATH%/%TWIKIWEB%/YourNewTopic/style.css * Set USERCOLORSURL = %PUBURLPATH%/%TWIKIWEB%/YourNewTopic/colors.css |
* Set USERLAYOUTURL = %PUBURLPATH%/%TWIKIWEB%/YourNewTopic/layout.css * Set USERSTYLEURL = %PUBURLPATH%/%TWIKIWEB%/YourNewTopic/style.css * Set USERCOLORSURL = %PUBURLPATH%/%TWIKIWEB%/YourNewTopic/colors.css |
||||
|
|
||||
* Set USERSTYLEURL = %PUBURLPATH%/%TWIKIWEB%/YourNewTopic/style.css |
* Set USERSTYLEURL = %PUBURLPATH%/%TWIKIWEB%/YourNewTopic/style.css |
||||
Instead of setting these variables in TWiki.TWikiPreferences, you can set these in your home topic, or in any other topic. Setting style URL variables in: |
Instead of setting these variables in TWiki.TWikiPreferences, you can set these in your home topic, or in any other topic. Setting style URL variables in: |
||||
|
|
||||
User styles are always loaded after TWiki styles. |
User styles are always loaded after TWiki styles. |
||||
The rest of this topic shows examples of small CSS changes. |
The rest of this topic shows examples of small CSS changes. |
||||
Recipes |
Recipes |
||||
Hide the left bar |
Hide the left bar |
||||
See example at: PatternSkinCssCookbookNoLeftBar |
See example at: PatternSkinCssCookbookNoLeftBar |
||||
Use different fonts |
Use different fonts |
||||
See example at: PatternSkinCssCookbookFonts |
See example at: PatternSkinCssCookbookFonts |
||||
No top bar |
No top bar |
||||
See example at: PatternSkinCssCookbookNoTopBar |
See example at: PatternSkinCssCookbookNoTopBar |
||||
Centered page |
Centered page |
||||
See example at: PatternSkinCssCookbookCenterPage |
See example at: PatternSkinCssCookbookCenterPage |
||||
Centered page (with a border around the page) |
Centered page (with a border around the page) |
||||
See example at: PatternSkinCssCookbookCenterPageBorder |
See example at: PatternSkinCssCookbookCenterPageBorder |
||||
Setting EditTablePlugin styles |
Setting EditTablePlugin styles |
||||
See example at: PatternSkinCssCookbookEditTableStyle |
See example at: PatternSkinCssCookbookEditTableStyle |
||||
r2 - 01 Apr 2006 - 05:55 - TWikiContributor | r1 - 01 Feb 2006 - 12:01 - TWikiContributor | ||||
Topic PatternSkinCssCookbook . { View | History | Interweave | r4 < r3 < r2 < r1 | More } |
Revision r2 - 01 Apr 2006 - 05:55 - TWikiContributor Revision r1 - 01 Feb 2006 - 12:01 - TWikiContributor |
This site is powered by the TWiki collaboration platform. All material on this collaboration platform is the property of the contributing authors. All material marked as authored by Eben Moglen is available under the license terms CC-BY-SA version 4. |