|
|
|
|
![]() |
PatternSkin CustomizationGuidelines how to create and customize page templates. For styling your Foswiki using stylesheets, see PatternSkinCssCookbook. On this page:
First Read: How to modify PatternSkin templates
Everything you see on the common 'view' page is written by the We describe two approaches to override this template:
Which approach is best?
The template approachTo change templates you will need shell access. If you don't have this read on below in The topic template approach. The quickest way to change the view template would be to simply change the text in the template. A safer way - strongly recommended, because it will survive a Foswiki update - is to create your own custom skin. That may sound like an awful lot of work, but in reality a skin may be as much as 1 file that consists of only a few lines of code.
Example The steps you would need:
* Set COVER = myskinor write* Set SKIN = myskin,pattern
Test by appending
The topic template approach (using VIEW_TEMPLATE)
Template overrides can be written in a topic, a so-called topic template. Topic template names end with
Call this template by setting * Set VIEW_TEMPLATE = BlogPostView
We can use the same example as above. In the topic you want to use as view template, for instance %TMPL:INCLUDE{"view"}% %TMPL:DEF{"top:toolbarbuttons"}%%TMPL:P{"more_link"}%%TMPL:END%
You can also test this by appending
Reference: pattern skin template INCLUDE tree
The view foswiki css viewtopbar %SYSTEMWEB%.WebTopBar viewsidebar %WEB%.WebLeftBar viewtopicactionbuttons viewbottombar %SYSTEMWEB%.WebBottomBar
Logo
How can I change the web logo?
By default the logo at the top left of each web points to the image with name Redefine your custom preference settings in Main.SitePreferences (to keep DefaultPreferences intact): * Set WEBLOGONAME = logo.gif * Set WEBLOGOIMG = %PUBURLPATH%/%BASEWEB%/%WEBPREFSTOPIC%/%WEBLOGONAME% * Set WEBLOGOURL = %SCRIPTURLPATH{"view"}%/%BASEWEB%/%HOMETOPIC% * Set WEBLOGOALT = Home There are 2 ways to change the logo in a web: Using logo.gif: Using a new filename:
How do I set a site-wide logo?
There are a bunch of site-wide logo preference settings in Main.SitePreferences: * Set WEBLOGOIMG = %WIKILOGOIMG%
My logo does not fit the top barSee I want to change the height of the top bar
I want to change the white space above and below the logoChange the table style in topic WebTopBar?. The default top padding is 11px.
Top bar
The search box won't find topics in other websIn WebTopBar? you can find the line: <input type="hidden" name="web" value="%BASEWEB%" /> To search all webs, write: <input type="hidden" name="web" value="all" /> To search a couple of webs, for instance the webs Main and System, write: <input type="hidden" name="web" value="Main,System" /> See also: Search macro I want to change the height of the top barThis information has moved to PatternSkinCssCookbook
I want to set or change the top background image
The image at the top is called "header art" - commonly the top image found on blog sites. The image that is displayed by default is set by the preference Redefine your custom preference settings in Main.SitePreferences (to keep DefaultPreferences intact): * Set WEBHEADERART = %PUBURLPATH%/%SYSTEMWEB%/PatternSkin/Foswiki_header.gif * Set WEBHEADERBGCOLOR = somehexcolor (no quotes, for example: #ffffff)
You can also set
I want to have the web color in the top bar
Redefine * Set WEBHEADERBGCOLOR = %WEBBGCOLOR%
I want to remove the Jump and Search boxes from the top barIf you have localization enabled, you will also see a language dropdown box at the far right. You can remove these items from WebTopBar?.
I want to hide the top barUsing templates: The view template is populated with page elements using template inclusions:
%TMPL:INCLUDE{"view"}% %TMPL:INCLUDE{"viewtopicactionbuttons"}% %TMPL:INCLUDE{"viewtopbar"}% %TMPL:INCLUDE{"viewsidebar"}%
Each included template draws a part of the screen.
Another approach is to clear the contents of module
%TMPL:INCLUDE{"view"}% %TMPL:DEF{"topbar"}%%TMPL:END%
Using style sheets:
Left bar
I want to hide the side bar
Using templates: %TMPL:DEF{"sidebar"}%%TMPL:END%
Using style sheets:
Buttons
I want to hide the edit buttons from certain usersIt may defy the wiki-ness of your Foswiki installation, but in certain circumstances it could be useful to hide the edit buttons from users that are not logged in, for instance for clients that have gotten viewing rights only.
Using either a template or a topic template, 'empty' %TMPL:INCLUDE{"view"}% %TMPL:DEF{"top:toolbarbuttons"}%%TMPL:END% %TMPL:DEF{"topicaction"}%%TMPL:END% In the user page of WikiGuest, set the cover to * Set COVER = customer By default this topic is editable only by Wiki admins.
I want to remove the History button from the bottom
All action links and buttons are defined in %TMPL:DEF{"topicactionbuttons"}% %TMPL:P{"action_activatable_edit_or_create"}% %TMPL:P{"action_activatable_attach"}% %TMPL:P{"action_printable"}% %TMPL:P{"action_revisions"}% %TMPL:P{"action_backlinks_simple"}% %TMPL:P{"action_raw_or_view"}% %TMPL:P{"action_activatable_raw_edit"}% %TMPL:P{"activatable_more"}% %TMPL:END%
To hide that link, In a custom skin view template %TMPL:INCLUDE{"view"}% %TMPL:DEF{"action_revisions"}%%TMPL:END%
I want to put the bottom links as buttons at the top
The default definition in %TMPL:DEF{"top:toolbarbuttons"}%%TMPL:P{"activatable_edit_or_create"}%%TMPL:P{"activatable_attach"}%%TMPL:END%
Create a new skin by creating a file
%TMPL:INCLUDE{"view"}% %TMPL:DEF{"top:toolbarbuttons"}%%TMPL:P{"history_history_link"}%%TMPL:END%
View any topic with This will remove the Edit and Attach buttons, and place a History button at the top. You will probably not just want to have the History button there. Other button include names are: create_topic_link raw_edit_link view_topic_link activatable_attach activatable_edit_or_create more_link activatable_printable backlinks_web_link backlinks_all_link backlinks_link history_rdiff_link history_history_link raw_link
Other page parts
I want to insert text outside of the topic content
PatternSkin has 2 'buckets' to write additional content to: Both modules are wrapped in CSS containers:
To put contents before the main text, use the custom skin approach as described above. %TMPL:INCLUDE{"view"}% %TMPL:DEF{"contentheader"}%This is the text before%TMPL:END% Use the same procedure for contents to be put after the topic text: %TMPL:INCLUDE{"view"}% %TMPL:DEF{"contentfooter"}%This is the text after%TMPL:END%
I want to place the form at the top
Pattern skin has 2 buckets for the form:
%TMPL:DEF{"formtop"}%%TMPL:END% %TMPL:DEF{"formbottom"}%%TMPL:P{"form"}%%TMPL:END% You simply swap the bucket contents. Using either a template or a topic template, write in your custom template:
%TMPL:INCLUDE{"view"}% %TMPL:DEF{"formtop"}%%TMPL:P{"form"}%%TMPL:END% %TMPL:DEF{"formbottom"}%%TMPL:END% ![]() |