Difference: TWikiSkins (22 vs. 23)

Revision 2315 Feb 2013 - TWikiContributor

Line: 1 to 1
 

TWiki Skins

Changed:
<
<
Skins overlay regular templates to give different looks and feels to TWiki screens.
>
>
A skin overlays regular templates to provide specific look and feel to TWiki screens.
 
Line: 10 to 10
  TWiki uses TWikiTemplates files as the basis of all the screens it uses to interact with users. Each screen has an associated template file that contains the basic layout of the screen. This is then filled in by the code to generate what you see in the browser.
Changed:
<
<
TWiki ships with a default set of template files that give a very basic, CSS-themable, look-and-feel. TWiki also includes support for skins that can be selected to give different, more sophisticated, look and feels. A default TWiki installation will usually start up with the PatternSkin already selected. Skins may also be defined by third parties and loaded into a TWiki installation to give more options. To see how TWiki looks when no skin is selected, view this topic with a non-existant skin.
>
>
TWiki ships with a default set of template files that give a very basic, CSS-themable, look-and-feel. TWiki also includes support for skins that can be selected to give different, more sophisticated, look and feel. A default TWiki installation will usually start up with the PatternSkin already selected. Skins may also be defined by third parties and loaded into a TWiki installation to give more options. To see how TWiki looks when no skin is selected, view the current page with a non-existing skin.
 
Changed:
<
<
Topic text is not affected by the choice of skin, though a skin can be defined to use a CSS (Cascading Style Sheet), which can sometimes give a radically different appearance to the text.
>
>
TWiki topic content is not affected by the choice of skin, however a skin can be defined to use a CSS (Cascading Style Sheet) which can provide a radically different appearance to the text layout.
  Relevant links on TWiki.org:
Line: 25 to 25
 

Changing the default TWiki skin

Changed:
<
<
TWiki default ships with the skin PatternSkin activated. You can set the skin for the whole site, a single web or topic, or for each user individually, by setting the SKIN variable to the name of a skin. If the skin you select doesn't exist, then TWiki will pick up the default templates.
>
>
TWiki ships with the TopMenuSkin activated by default. You can set a skin for the whole site, a single web, a single topic, or for each user individually. This is done by setting the SKIN preferences setting to the name of a skin. If the skin you select doesn't exist, then TWiki will pick up the default templates. For example, to make the SKIN setting work across all topics and webs, put it in TWikiPreferences.
 
Added:
>
>
Skins can cascade using a skin path explained below. One skin can be based on another one, and extensions can introduce additional screen elements. For example, the TagMePlugin adds tag elements to the TopMenuSkin, and the TopMenuSkin is based on the PatternSkin, resulting in this skin path:

   * Set SKIN = tagme, topmenu, pattern
 

Defining Skins

You may want to define your own skin, for example to comply with corporate web guidelines, or because you have a aesthetic vision that you want to share. There are a couple of places you can start doing this.

The TWikiTemplates files used for skins are located in the twiki/templates directory and are named according to the skin: <scriptname>.<skin>.tmpl. Skin files may also be defined in TWiki topics - see TWikiTemplates for details.

Changed:
<
<
To start creating a new skin, copy the default TWikiTemplates (like view.tmpl), or copy an existing skin to use as a base for your own skin. You should only need to copy the files you intend to customise, as TWiki can be configured to fall back to another skin if a template is not defined in your skin. Name the files as described above (for example view.myskin.tmpl.
>
>
To start creating a new skin, copy the default TWikiTemplates (like view.tmpl), or copy an existing skin to use as a base for your own skin. You should only need to copy the files you intend to customize, as TWiki can be configured to fall back to another skin if a template is not defined in your skin. Name the files as described above (for example view.myskin.tmpl).
  If you use PatternSkin as your starting point, and you want to modify the layout, colors or even the templates to suit your own needs, have a look first at the topics PatternSkinCustomization and PatternSkinCssCookbook.
Line: 92 to 98
  ALERT! Note: Make sure templates do not end with a newline. Any newline will expand to an empty <p /> in the generated html. It will produce invalid html, and may break the page layout.
Changed:
<
<

Partial customisation, or adding in new features to an existing skin

>
>

Partial customization, or adding in new features to an existing skin

 
Changed:
<
<
You can use recusion in the TMPL:INCLUDE chain (eg twiki.classic.tmpl contains %TMPL:INCLUDE{"twiki"}%, the templating system will include the next twiki.SKIN in the skin path. For example, to create a customisation of pattern skin, where you only want to remove the edit & WYSIWYG buttons from view page, you create only a view.yourlocal.tmpl:
>
>
You can use recursion in the TMPL:INCLUDE chain (e.g. twiki.pattern.tmpl contains %TMPL:INCLUDE{"twiki"}%, the templating system will include the next twiki.SKIN in the skin path (which is explained below). For example, to create a customization of pattern skin, where you only want to remove the edit & WYSIWYG buttons from view page, you create only a view.yourlocal.tmpl:
 
%TMPL:INCLUDE{"view"}%
%TMPL:DEF{"edit_topic_link"}%%TMPL:END%
Line: 103 to 108
  and then set SKIN=yourlocal,pattern.
Deleted:
<
<
Because ClassicSkin and the default templates use the same Template definition names, you can over-ride the edit links in them (or any skin derived from them) using the same view.yourlocal.tmpl (just set SKIN=yourlocal,classic either in TWikiPreferences for globally, or a Web's Webname.WebPreferences for a particular web)
 

Variables in Skins

You can use template variables, TWikiVariables, and other predefined variables to compose your skins. Some commonly used variables in skins:

Line: 217 to 220
  You can try out all installed skins in the TWikiSkinBrowser.
Added:
>
>
 

Activating Skins

TWiki uses a skin search path, which lets you combine skins additively. The skin path is defined using a combination of TWikiVariables and URL parameters.

 
This site is powered by the TWiki collaboration platform Powered by PerlCopyright © 1999-2024 by the contributing authors. All material on this collaboration platform is the property of the contributing authors.
Ideas, requests, problems regarding TWiki? Send feedback
Note: Please contribute updates to this topic on TWiki.org at TWiki:TWiki.TWikiSkins.