| | |
| |
|
|
<
< | There are several ways to change the logo in a web: |
>
> | There are 2 ways to change the logo in a web:
Using logo.gif:
|
| |
- Create a new image named
logo.gif and attach it to the web's WebPreferences topic. PatternSkin's stylesheet assumes the logo is 40px high. More about that later.
- You can also upload the image with FTP to
/pub/YourWeb/WebPreferences/.
|
|
<
< | or: |
>
> |
Using a new filename:
|
| |
* Set WEBLOGONAME = your-logo-name.gif-or-png
|
|
>
> | |
| | How do I set a site-wide logo? |
| | My logo does not fit the top bar |
|
<
< | The top bar is 64 pixels high by default. If you have a bigger logo you might want to change the height of the top bar in layout.css: |
>
> | The top bar is 64 pixels high by default.
Using templates:
Change the height of the top bar in templates/viewtopbar.pattern.tmpl: |
| | |
|
<
< | /* height of the top bar */
#patternLeftBar {
top:64px; /*C3*/
} |
>
> | %TMPL:DEF{"topbardimensions"}% |
| | #patternTopBar, |
|
<
< | #patternTopBar table.patternTopBarContents {
height:64px; /*C3*/ |
>
> | #patternClearHeaderCenter,
#patternClearHeaderLeft,
#patternClearHeaderRight,
#patternTopBarContentsOuter {
height:64px; /* top bar height; make room for header columns */
overflow:hidden; |
| | } |
|
>
> | %TMPL:END% |
| | |
|
>
> | Only change the number.
|
| | |
|
<
< | (C3 is used as reference to all occurrences with the same value)
You can change these numbers in layout.css directly, or create a new stylesheet, attach it to a topic and point USERLAYOUTURL to that topic attachment. See PatternSkinCssCookbook about creating custom styles. |
>
> | Using style sheets:
Create a new stylesheet with above definition in it, attach it to a topic and point USERLAYOUTURL to that topic attachment. See PatternSkinCssCookbook about creating custom styles.
|
| | I want to change the white space above and below the logo |
|
<
< | The logo is centered vertically be default. If you want to align it to the top, change the style in style.css.
Change:
table.patternTopBarContents td {
height:100%;
width:100%;
vertical-align:middle;
}
to:
table.patternTopBarContents td {
height:100%;
width:100%;
vertical-align:top;
}
You can also define an offset like this:
table.patternTopBarContents td {
height:100%;
width:100%;
vertical-align:top;
padding-top:12px;
}
|
>
> | Change the table style in WebTopBar. Default top padding is 11px. |
| | Top bar questions
I want to set or change the top background image |
|
<
< | The image at the top is called "header art" - after the traditional top image found on blog sites. The image that is displayed by default is set by the variable WEBHEADERART, defined in TWikiPreferences. |
>
> | 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 variable WEBHEADERART, defined in TWikiPreferences. |
| | Redefine your custom variables in Main.TWikiPreferences (to keep TWikiPreferences intact):
* Set WEBHEADERART = %PUBURLPATH%/%TWIKIWEB%/PatternSkin/TWiki_header.gif
|
|
<
< |
- Set WEBHEADERBGCOLOR = somehexcolor
|
>
> |
- Set WEBHEADERBGCOLOR = somehexcolor (no quotes, for example: #ffffff)
|
| |
You can also set WEBHEADERART per web, by defining the variable in the Web's WebPreferences. |
| |
- Set WEBHEADERBGCOLOR = %WEBBGCOLOR%
|
|
<
< | I want other items in the top bar |
>
> | I want to remove the Jump and Search boxes from the top bar |
| | |
|
<
< | In WebTopBar shows a logo, but that does not mean you cannot put other things in there. You can put a table, or divs or images. |
>
> | If you have localization enabled, you will also see a language dropdown box at the far right. |
| | |
|
<
< |
You probably don't need the following information unless you are encountering a strange problem. |
>
> | You can remove these items from WebTopBar. |
| | |
|
<
< | The WebTopBar contents is placed inside a table that is written by twiki.pattern.tmpl (the gray text is from the template): |
>
> | I want to hide the top bar |
| | |
|
<
< |
<div id="patternTopBar">
<table class="patternTopBarContents" border="0" cellpadding="0" cellspacing="0">
<tr>
<td>
<span class="patternTopBarLogo twikiLeft">
<a href="%WEBLOGOURL%"><img src="%WEBLOGOIMG%" border="0" alt="%WEBLOGOALT%"/></a>
</span>
</td>
</tr>
</table>
</div>
|
>
> | Using templates:
The view template is populated like this:
%TMPL:INCLUDE{"page"}%
%TMPL:INCLUDE{"viewtopbar"}%
%TMPL:INCLUDE{"viewtoolbar"}%
%TMPL:INCLUDE{"viewleftbar"}%
%TMPL:INCLUDE{"viewrightbar"}%
%TMPL:INCLUDE{"viewtopicactionbuttons"}%
%TMPL:INCLUDE{"viewbottombar"}%
Each included template draws a part of the screen. Omit %TMPL:INCLUDE{"viewtopbar"}% to hide the top bar, or in a view template clear it using %TMPL:INCLUDE{"viewtopbar"}%%TMPL:END%
|
| | |
|
>
> | Using style sheets:
See PatternSkinCssCookbookNoTopBar.
|
| | |
|
<
< | I want to have the language selection in the top bar |
>
> | Left bar questions |
| | |
|
<
< | If you want to have the language selection more prominent, you can put a language selection dropdown box in the top bar. Put this in WebTopBar:
<div class="twikiRight" style="margin-right:2em;">
<form id="topBarChangeLanguage" action="%SCRIPTURLPATH{"oops"}%/%WEB%/%TOPIC%" method="get">
<select name="language" onchange="document.getElementById('topBarChangeLanguage').submit()">
%LANGUAGES{format="<option $marker value='$langtag'>$langname</option>" selection="%LANGUAGE%"}%
</select>
<input type="hidden" name="template" value="oopslanguagechanged" />
<noscript>
<input type="submit" value="%MAKETEXT{"Change language"}%" />
</noscript>
</form>
</div>
|
>
> | I want to hide the left bar |
| | |
|
<
< | This will render: |
>
> | Using templates:
Omit %TMPL:INCLUDE{"viewleftbar"}% to hide the left bar, or in a view template clear it using %TMPL:INCLUDE{"viewleftbar"}%%TMPL:END%
|
| | |
|
<
< | |
>
> | Using style sheets:
See PatternSkinCssCookbookNoLeftBar.
|
| | |
|
<
< | I want to hide the top bar |
>
> | Other page parts |
| | |
|
<
< | See PatternSkinCssCookbookNoTopBar |
>
> | I want to hide the edit buttons from certain users |
| | |
|
<
< | Left bar questions |
>
> | It may defy the wiki-ness of your TWiki installation, but in certain circumstances it could be useful to hide the edit buttons from users that are not logged in, for instance for customers. |
| | |
|
<
< | I want to hide the left bar |
>
> | Create in the template directory the file view.customer.tmpl. 'Empty' topicaction and toolbar by writing in the template:
%TMPL:INCLUDE{"view.pattern"}%
%TMPL:DEF{"topicaction"}%%TMPL:END%
%TMPL:DEF{"toolbar"}%%TMPL:END%
In TWikiGuest, set the cover to
* Set COVER = customer
By default this topic is editable only by TWikiAdminGroup members. |
| | |
|
<
< | See PatternSkinCssCookbookNoLeftBar |
| | |