| TopMenuSkin
<--
Contributions to this skin are appreciated. Please update the skin page at
http://twiki.org/cgi-bin/view/Plugins/TopMenuSkin or provide feedback at
http://twiki.org/cgi-bin/view/Plugins/TopMenuSkinDev .
If you are a TWiki contributor please update the skin in the SVN repository.
-->
The TopMenuSkin adds pulldown menus to the PatternSkin.
Screenshot
Tob Bar and Menu Structure
NOTE: The skin is designed to incorporate the "you are here" breadcrumb into the pulldown menus: "Home" menu => "Web" menu => List of parent topics, if any (shown as "P"s) => Current topic ("View" menu).
Web-specific Menu-Bars
The TopMenuSkinDefaultWebTopMenu defines the default menu structure used in any web. A WebTopMenu topic in a web can redefine the default menu structure. If the WebTopMenu topic is missing in a web, create one with content of _default.WebTopMenu and customize it. Bullets must be of format [[...][...]] or <a href="...">...</a> , and may not contain any text next to the link.
To preserve the "you are here" breadcrumb, it is important to add additional pulldown menus after the INCLUDE of %SYSTEMWEB%.TopMenuSkinTopicMenu. The top level menu-bar should have this structure:
- INCLUDE of %SYSTEMWEB%.TopMenuSkinHomeMenu
- Current Web menu
- INCLUDE of %SYSTEMWEB%.TopMenuSkinTopicMenu
- Additional pulldown menu(s) as needed (optional)
Example WebTopBar menu structure with additional "Bugs" pulldown menu:
%INCLUDE{%SYSTEMWEB%.TopMenuSkinHomeMenu}%
* [[%BASEWEB%.%HOMETOPIC%][<img src="%ICONURL{web-bg}%" border="0" alt="" width="16" height="16" style="background-color:%WEBBGCOLOR%" /> <nop>%MAKETEXT{"[_1] Web" args="%BASEWEB{format="$current"}%"}% %ICON{menu-down}%]]
* [[%SCRIPTURLPATH{"view"}%/%BASEWEB%/WebCreateNewTopic?topicparent=%BASETOPIC%][ %ICON{"newtopic"}% %MAKETEXT{"Create New Topic"}%]]
* [[%BASEWEB%.WebTopicList][ %ICON{"index"}% %MAKETEXT{"Index"}%]]
* [[%BASEWEB%.WebSearch][ %ICON{"searchtopic"}% %MAKETEXT{"Search"}%]]
* [[%BASEWEB%.WebChanges][ %ICON{"changes"}% %MAKETEXT{"Changes"}%]]
* [[%BASEWEB%.WebNotify][ %ICON{"notify"}% %MAKETEXT{"Notifications"}%]]
* [[%BASEWEB%.WebRss][ %ICON{"feed"}% %MAKETEXT{"RSS Feed"}%]]
* [[%BASEWEB%.WebStatistics][ %ICON{"statistics"}% %MAKETEXT{"Statistics"}%]]
* [[%BASEWEB%.WebPreferences][ %ICON{"wrench"}% %MAKETEXT{"Preferences"}%]]
%INCLUDE{%SYSTEMWEB%.TopMenuSkinTopicMenu}%
* [[BugTracker][%ICON{bug}% Bugs %ICON{menu-down}%]]
* [[NewReport][Create bug report]]
* [[OpenBugs][Open bugs]]
* [[ConfirmedBugs][Confirmed bugs]]
* [[FixedBugs][Fixed bugs]]
Use Menu-Bars in Topics
A menu-bar can be added anywhere in a topic:
- Include the "TWiki.TopMenuSkin" topic - this pulls in the CSS and JavaScript needed for the menu-bar.
- Create a nested bullet list with links:
- The top level bullets define the menu-bar items. Bullets with/without links are supported.
- Second level bullets define the pulldown options within a menu-bar item.
- A second level bullet must contain exactly one link (format
[[...][...]] or <a href="...">...</a> ) without any text next to the link.
- Third level bullets are not supported.
- Enclose the bullet list with a
<div class="twTopMenuTab"> tag.
Example:
%INCLUDE{"%SYSTEMWEB%.TopMenuSkin"}%
<div class="twTopMenuTab">
* [[WebHome][%ICON{home}% Home %ICON{menu-down}%]]
* [[WebNotify][Subscribe]]
* [[WebStatistics][Statistics]]
* [[WebSearch][%ICON{searchtopic}% Search %ICON{menu-down}%]]
* [[WebSearchAdvanced][Advanced search]]
* [[SearchHelp][Search help]]
</div>
Renders as:
NOTE: The pulldown menus only work if the TWiki:Plugins/JQueryPlugin is installed and enabled.
Read-Only Skin Mode
This skin and the PatternSkin support a read-only mode. This is mainly useful if you have TWiki application pages or dashboards where you do not want regular users to change content. The read-only mode is enabled with a READONLYSKINMODE preferences setting set to 1. Details in PatternSkinCustomization#ReadOnlySkinMode.
CSS and JavaScript
This section defines the CSS and JavaScript used by the TopMenuSkin; View Raw to see the source. Some additional CSS is defined in templates/vewi.topmenu.tmpl
<---->
<-- -->
Create Your Own Look
This skin is based on PatternSkin, and the same rules for customization apply.
The TopMenuSkin disables the sidebar and activates a different top bar in twiki/templates/view.topmenu.tmpl . Details in PatternSkinCustomization and PatternSkinCssCookbook.
The top bar TopMenuSkinTopBar (with menu bar, logo and search boxes) can be cloned using same topic name and customized per web.
Add a Sidebar
If you want a sidebar in addition to the top bar, define a WEBLEFTBAR setting with the name of the topic to include as the sidebar. This can be done in a WebPreferences for the whole web or in a topic. Example:
Add Breadcrumbs
The TopMenuSkin incorporates "you are here" breadcrumbs in the pulldown menu, such as "Home > Main web > P > P > View . The P's indicate the parent topic(s). If you prefer the old verbose breadcrumbs you can enable it with the following preferences setting:
Fixed Menu-Bar
The FIXEDTOPMENU preferences setting determines if the menu-bar is fixed or auto-hidden. If set to on, the menu-bar is always visible at the top, regardless of the window scroll position. If off, the menu-bar hides when scrolled, and can be shown by hovering over - the gray TWiki icon.
Installation
This skin is pre-installed. TWiki administrators can upgrade the skin as needed on the TWiki server.
<--/twistyPlugin twikiMakeVisibleInline--> <--/twistyPlugin-->
Skin Info
- Set SHORTDESCRIPTION = Skin with pulldown menus in top bar
- Sponsor: Twiki, Inc.
|
|
< < |
|
> > |
|
|
|
|
< < |
|
> > |
|
| <--/twistyPlugin twikiMakeVisibleInline--> |
|
> > |
|
|
<--/twistyPlugin-->
Related topics: TopMenuSkinDefaultWebTopMenu, TopMenuSkinHomeMenu, TopMenuSkinTopBar, TopMenuSkinTopicMenu, WebTopMenu, _default.WebTopMenu, Main.WebTopMenu, Sandbox.WebTopMenu, Trash.WebTopMenu, TWikiSkins, TWikiSkinBrowser, UserDocumentationCategory, AdminDocumentationCategory
META FILEATTACHMENT |
attachment="fullscreen.png" attr="h" comment="" date="1346915516" name="fullscreen.png" path="fullscreen.png" size="109194" user="TWikiContributor" version="1" |
META FILEATTACHMENT |
attachment="screenshot.png" attr="h" comment="" date="1346915517" name="screenshot.png" path="screenshot.png" size="30309" user="TWikiContributor" version="1" |
|
| TopMenuSkin
<--
Contributions to this skin are appreciated. Please update the skin page at
http://twiki.org/cgi-bin/view/Plugins/TopMenuSkin or provide feedback at
http://twiki.org/cgi-bin/view/Plugins/TopMenuSkinDev .
If you are a TWiki contributor please update the skin in the SVN repository.
-->
The TopMenuSkin adds pulldown menus to the PatternSkin.
Screenshot
Tob Bar and Menu Structure
NOTE: The skin is designed to incorporate the "you are here" breadcrumb into the pulldown menus: "Home" menu => "Web" menu => List of parent topics, if any (shown as "P"s) => Current topic ("View" menu).
Web-specific Menu-Bars
The TopMenuSkinDefaultWebTopMenu defines the default menu structure used in any web. A WebTopMenu topic in a web can redefine the default menu structure. If the WebTopMenu topic is missing in a web, create one with content of _default.WebTopMenu and customize it. Bullets must be of format [[...][...]] or <a href="...">...</a> , and may not contain any text next to the link.
To preserve the "you are here" breadcrumb, it is important to add additional pulldown menus after the INCLUDE of %SYSTEMWEB%.TopMenuSkinTopicMenu. The top level menu-bar should have this structure:
- INCLUDE of %SYSTEMWEB%.TopMenuSkinHomeMenu
- Current Web menu
- INCLUDE of %SYSTEMWEB%.TopMenuSkinTopicMenu
- Additional pulldown menu(s) as needed (optional)
Example WebTopBar menu structure with additional "Bugs" pulldown menu:
%INCLUDE{%SYSTEMWEB%.TopMenuSkinHomeMenu}%
* [[%BASEWEB%.%HOMETOPIC%][<img src="%ICONURL{web-bg}%" border="0" alt="" width="16" height="16" style="background-color:%WEBBGCOLOR%" /> <nop>%MAKETEXT{"[_1] Web" args="%BASEWEB{format="$current"}%"}% %ICON{menu-down}%]]
* [[%SCRIPTURLPATH{"view"}%/%BASEWEB%/WebCreateNewTopic?topicparent=%BASETOPIC%][ %ICON{"newtopic"}% %MAKETEXT{"Create New Topic"}%]]
* [[%BASEWEB%.WebTopicList][ %ICON{"index"}% %MAKETEXT{"Index"}%]]
* [[%BASEWEB%.WebSearch][ %ICON{"searchtopic"}% %MAKETEXT{"Search"}%]]
* [[%BASEWEB%.WebChanges][ %ICON{"changes"}% %MAKETEXT{"Changes"}%]]
* [[%BASEWEB%.WebNotify][ %ICON{"notify"}% %MAKETEXT{"Notifications"}%]]
* [[%BASEWEB%.WebRss][ %ICON{"feed"}% %MAKETEXT{"RSS Feed"}%]]
* [[%BASEWEB%.WebStatistics][ %ICON{"statistics"}% %MAKETEXT{"Statistics"}%]]
* [[%BASEWEB%.WebPreferences][ %ICON{"wrench"}% %MAKETEXT{"Preferences"}%]]
%INCLUDE{%SYSTEMWEB%.TopMenuSkinTopicMenu}%
* [[BugTracker][%ICON{bug}% Bugs %ICON{menu-down}%]]
* [[NewReport][Create bug report]]
* [[OpenBugs][Open bugs]]
* [[ConfirmedBugs][Confirmed bugs]]
* [[FixedBugs][Fixed bugs]]
Use Menu-Bars in Topics
A menu-bar can be added anywhere in a topic:
- Include the "TWiki.TopMenuSkin" topic - this pulls in the CSS and JavaScript needed for the menu-bar.
- Create a nested bullet list with links:
- The top level bullets define the menu-bar items. Bullets with/without links are supported.
- Second level bullets define the pulldown options within a menu-bar item.
- A second level bullet must contain exactly one link (format
[[...][...]] or <a href="...">...</a> ) without any text next to the link.
- Third level bullets are not supported.
- Enclose the bullet list with a
<div class="twTopMenuTab"> tag.
Example:
%INCLUDE{"%SYSTEMWEB%.TopMenuSkin"}%
<div class="twTopMenuTab">
* [[WebHome][%ICON{home}% Home %ICON{menu-down}%]]
* [[WebNotify][Subscribe]]
* [[WebStatistics][Statistics]]
* [[WebSearch][%ICON{searchtopic}% Search %ICON{menu-down}%]]
* [[WebSearchAdvanced][Advanced search]]
* [[SearchHelp][Search help]]
</div>
Renders as:
NOTE: The pulldown menus only work if the TWiki:Plugins/JQueryPlugin is installed and enabled.
Read-Only Skin Mode
This skin and the PatternSkin support a read-only mode. This is mainly useful if you have TWiki application pages or dashboards where you do not want regular users to change content. The read-only mode is enabled with a READONLYSKINMODE preferences setting set to 1. Details in PatternSkinCustomization#ReadOnlySkinMode.
CSS and JavaScript
This section defines the CSS and JavaScript used by the TopMenuSkin; View Raw to see the source. Some additional CSS is defined in templates/vewi.topmenu.tmpl
<---->
<-- -->
Create Your Own Look
This skin is based on PatternSkin, and the same rules for customization apply.
The TopMenuSkin disables the sidebar and activates a different top bar in twiki/templates/view.topmenu.tmpl . Details in PatternSkinCustomization and PatternSkinCssCookbook.
The top bar TopMenuSkinTopBar (with menu bar, logo and search boxes) can be cloned using same topic name and customized per web.
Add a Sidebar
If you want a sidebar in addition to the top bar, define a WEBLEFTBAR setting with the name of the topic to include as the sidebar. This can be done in a WebPreferences for the whole web or in a topic. Example:
Add Breadcrumbs
The TopMenuSkin incorporates "you are here" breadcrumbs in the pulldown menu, such as "Home > Main web > P > P > View . The P's indicate the parent topic(s). If you prefer the old verbose breadcrumbs you can enable it with the following preferences setting:
Fixed Menu-Bar
The FIXEDTOPMENU preferences setting determines if the menu-bar is fixed or auto-hidden. If set to on, the menu-bar is always visible at the top, regardless of the window scroll position. If off, the menu-bar hides when scrolled, and can be shown by hovering over - the gray TWiki icon.
Installation
This skin is pre-installed. TWiki administrators can upgrade the skin as needed on the TWiki server.
<--/twistyPlugin twikiMakeVisibleInline--> <--/twistyPlugin-->
Skin Info
- Set SHORTDESCRIPTION = Skin with pulldown menus in top bar
- Sponsor: Twiki, Inc.
|
|
< < |
|
> > |
|
| <--/twistyPlugin twikiMakeVisibleInline--> |
|
> > |
|
|
<--/twistyPlugin-->
Related topics: TopMenuSkinDefaultWebTopMenu, TopMenuSkinHomeMenu, TopMenuSkinTopBar, TopMenuSkinTopicMenu, WebTopMenu, _default.WebTopMenu, Main.WebTopMenu, Sandbox.WebTopMenu, Trash.WebTopMenu, TWikiSkins, TWikiSkinBrowser, UserDocumentationCategory, AdminDocumentationCategory
META FILEATTACHMENT |
attachment="fullscreen.png" attr="h" comment="" date="1346915516" name="fullscreen.png" path="fullscreen.png" size="109194" user="TWikiContributor" version="1" |
META FILEATTACHMENT |
attachment="screenshot.png" attr="h" comment="" date="1346915517" name="screenshot.png" path="screenshot.png" size="30309" user="TWikiContributor" version="1" |
|
| TopMenuSkin
<--
Contributions to this skin are appreciated. Please update the skin page at
http://twiki.org/cgi-bin/view/Plugins/TopMenuSkin or provide feedback at
http://twiki.org/cgi-bin/view/Plugins/TopMenuSkinDev .
If you are a TWiki contributor please update the skin in the SVN repository.
-->
The TopMenuSkin adds pulldown menus to the PatternSkin.
Screenshot
Tob Bar and Menu Structure
NOTE: The skin is designed to incorporate the "you are here" breadcrumb into the pulldown menus: "Home" menu => "Web" menu => List of parent topics, if any (shown as "P"s) => Current topic ("View" menu).
Web-specific Menu-Bars
The TopMenuSkinDefaultWebTopMenu defines the default menu structure used in any web. A WebTopMenu topic in a web can redefine the default menu structure. If the WebTopMenu topic is missing in a web, create one with content of _default.WebTopMenu and customize it. Bullets must be of format [[...][...]] or <a href="...">...</a> , and may not contain any text next to the link.
To preserve the "you are here" breadcrumb, it is important to add additional pulldown menus after the INCLUDE of %SYSTEMWEB%.TopMenuSkinTopicMenu. The top level menu-bar should have this structure:
- INCLUDE of %SYSTEMWEB%.TopMenuSkinHomeMenu
- Current Web menu
- INCLUDE of %SYSTEMWEB%.TopMenuSkinTopicMenu
- Additional pulldown menu(s) as needed (optional)
Example WebTopBar menu structure with additional "Bugs" pulldown menu:
%INCLUDE{%SYSTEMWEB%.TopMenuSkinHomeMenu}%
* [[%BASEWEB%.%HOMETOPIC%][<img src="%ICONURL{web-bg}%" border="0" alt="" width="16" height="16" style="background-color:%WEBBGCOLOR%" /> <nop>%MAKETEXT{"[_1] Web" args="%BASEWEB{format="$current"}%"}% %ICON{menu-down}%]]
* [[%SCRIPTURLPATH{"view"}%/%BASEWEB%/WebCreateNewTopic?topicparent=%BASETOPIC%][ %ICON{"newtopic"}% %MAKETEXT{"Create New Topic"}%]]
* [[%BASEWEB%.WebTopicList][ %ICON{"index"}% %MAKETEXT{"Index"}%]]
* [[%BASEWEB%.WebSearch][ %ICON{"searchtopic"}% %MAKETEXT{"Search"}%]]
* [[%BASEWEB%.WebChanges][ %ICON{"changes"}% %MAKETEXT{"Changes"}%]]
* [[%BASEWEB%.WebNotify][ %ICON{"notify"}% %MAKETEXT{"Notifications"}%]]
* [[%BASEWEB%.WebRss][ %ICON{"feed"}% %MAKETEXT{"RSS Feed"}%]]
* [[%BASEWEB%.WebStatistics][ %ICON{"statistics"}% %MAKETEXT{"Statistics"}%]]
* [[%BASEWEB%.WebPreferences][ %ICON{"wrench"}% %MAKETEXT{"Preferences"}%]]
%INCLUDE{%SYSTEMWEB%.TopMenuSkinTopicMenu}%
* [[BugTracker][%ICON{bug}% Bugs %ICON{menu-down}%]]
* [[NewReport][Create bug report]]
* [[OpenBugs][Open bugs]]
* [[ConfirmedBugs][Confirmed bugs]]
* [[FixedBugs][Fixed bugs]]
Use Menu-Bars in Topics
A menu-bar can be added anywhere in a topic:
- Include the "TWiki.TopMenuSkin" topic - this pulls in the CSS and JavaScript needed for the menu-bar.
- Create a nested bullet list with links:
- The top level bullets define the menu-bar items. Bullets with/without links are supported.
- Second level bullets define the pulldown options within a menu-bar item.
- A second level bullet must contain exactly one link (format
[[...][...]] or <a href="...">...</a> ) without any text next to the link.
- Third level bullets are not supported.
- Enclose the bullet list with a
<div class="twTopMenuTab"> tag.
Example:
%INCLUDE{"%SYSTEMWEB%.TopMenuSkin"}%
<div class="twTopMenuTab">
* [[WebHome][%ICON{home}% Home %ICON{menu-down}%]]
* [[WebNotify][Subscribe]]
* [[WebStatistics][Statistics]]
* [[WebSearch][%ICON{searchtopic}% Search %ICON{menu-down}%]]
* [[WebSearchAdvanced][Advanced search]]
* [[SearchHelp][Search help]]
</div>
Renders as:
NOTE: The pulldown menus only work if the TWiki:Plugins/JQueryPlugin is installed and enabled.
Read-Only Skin Mode
This skin and the PatternSkin support a read-only mode. This is mainly useful if you have TWiki application pages or dashboards where you do not want regular users to change content. The read-only mode is enabled with a READONLYSKINMODE preferences setting set to 1. Details in PatternSkinCustomization#ReadOnlySkinMode.
CSS and JavaScript
This section defines the CSS and JavaScript used by the TopMenuSkin; View Raw to see the source. Some additional CSS is defined in templates/vewi.topmenu.tmpl
<---->
<-- -->
Create Your Own Look
This skin is based on PatternSkin, and the same rules for customization apply.
The TopMenuSkin disables the sidebar and activates a different top bar in twiki/templates/view.topmenu.tmpl . Details in PatternSkinCustomization and PatternSkinCssCookbook.
The top bar TopMenuSkinTopBar (with menu bar, logo and search boxes) can be cloned using same topic name and customized per web.
Add a Sidebar
If you want a sidebar in addition to the top bar, define a WEBLEFTBAR setting with the name of the topic to include as the sidebar. This can be done in a WebPreferences for the whole web or in a topic. Example:
|
|
> > |
Add Breadcrumbs
The TopMenuSkin incorporates "you are here" breadcrumbs in the pulldown menu, such as "Home > Main web > P > P > View . The P's indicate the parent topic(s). If you prefer the old verbose breadcrumbs you can enable it with the following preferences setting:
|
|
Fixed Menu-Bar
The FIXEDTOPMENU preferences setting determines if the menu-bar is fixed or auto-hidden. If set to on, the menu-bar is always visible at the top, regardless of the window scroll position. If off, the menu-bar hides when scrolled, and can be shown by hovering over - the gray TWiki icon.
Installation
This skin is pre-installed. TWiki administrators can upgrade the skin as needed on the TWiki server.
<--/twistyPlugin twikiMakeVisibleInline--> <--/twistyPlugin-->
Skin Info
- Set SHORTDESCRIPTION = Skin with pulldown menus in top bar
- Sponsor: Twiki, Inc.
|
|
< < |
|
> > |
|
|
|
|
< < |
|
> > |
|
| <--/twistyPlugin twikiMakeVisibleInline--> |
|
> > |
|
|
<--/twistyPlugin-->
Related topics: TopMenuSkinDefaultWebTopMenu, TopMenuSkinHomeMenu, TopMenuSkinTopBar, TopMenuSkinTopicMenu, WebTopMenu, _default.WebTopMenu, Main.WebTopMenu, Sandbox.WebTopMenu, Trash.WebTopMenu, TWikiSkins, TWikiSkinBrowser, UserDocumentationCategory, AdminDocumentationCategory
META FILEATTACHMENT |
attachment="fullscreen.png" attr="h" comment="" date="1346915516" name="fullscreen.png" path="fullscreen.png" size="109194" user="TWikiContributor" version="1" |
META FILEATTACHMENT |
attachment="screenshot.png" attr="h" comment="" date="1346915517" name="screenshot.png" path="screenshot.png" size="30309" user="TWikiContributor" version="1" |
|
| TopMenuSkin
<--
Contributions to this skin are appreciated. Please update the skin page at
http://twiki.org/cgi-bin/view/Plugins/TopMenuSkin or provide feedback at
http://twiki.org/cgi-bin/view/Plugins/TopMenuSkinDev .
If you are a TWiki contributor please update the skin in the SVN repository.
-->
The TopMenuSkin adds pulldown menus to the PatternSkin.
Screenshot
Tob Bar and Menu Structure
NOTE: The skin is designed to incorporate the "you are here" breadcrumb into the pulldown menus: "Home" menu => "Web" menu => List of parent topics, if any (shown as "P"s) => Current topic ("View" menu).
Web-specific Menu-Bars
The TopMenuSkinDefaultWebTopMenu defines the default menu structure used in any web. A WebTopMenu topic in a web can redefine the default menu structure. If the WebTopMenu topic is missing in a web, create one with content of _default.WebTopMenu and customize it. Bullets must be of format [[...][...]] or <a href="...">...</a> , and may not contain any text next to the link.
To preserve the "you are here" breadcrumb, it is important to add additional pulldown menus after the INCLUDE of %SYSTEMWEB%.TopMenuSkinTopicMenu. The top level menu-bar should have this structure:
- INCLUDE of %SYSTEMWEB%.TopMenuSkinHomeMenu
- Current Web menu
- INCLUDE of %SYSTEMWEB%.TopMenuSkinTopicMenu
- Additional pulldown menu(s) as needed (optional)
Example WebTopBar menu structure with additional "Bugs" pulldown menu:
%INCLUDE{%SYSTEMWEB%.TopMenuSkinHomeMenu}%
* [[%BASEWEB%.%HOMETOPIC%][<img src="%ICONURL{web-bg}%" border="0" alt="" width="16" height="16" style="background-color:%WEBBGCOLOR%" /> <nop>%MAKETEXT{"[_1] Web" args="%BASEWEB{format="$current"}%"}% %ICON{menu-down}%]]
* [[%SCRIPTURLPATH{"view"}%/%BASEWEB%/WebCreateNewTopic?topicparent=%BASETOPIC%][ %ICON{"newtopic"}% %MAKETEXT{"Create New Topic"}%]]
* [[%BASEWEB%.WebTopicList][ %ICON{"index"}% %MAKETEXT{"Index"}%]]
* [[%BASEWEB%.WebSearch][ %ICON{"searchtopic"}% %MAKETEXT{"Search"}%]]
* [[%BASEWEB%.WebChanges][ %ICON{"changes"}% %MAKETEXT{"Changes"}%]]
* [[%BASEWEB%.WebNotify][ %ICON{"notify"}% %MAKETEXT{"Notifications"}%]]
* [[%BASEWEB%.WebRss][ %ICON{"feed"}% %MAKETEXT{"RSS Feed"}%]]
* [[%BASEWEB%.WebStatistics][ %ICON{"statistics"}% %MAKETEXT{"Statistics"}%]]
* [[%BASEWEB%.WebPreferences][ %ICON{"wrench"}% %MAKETEXT{"Preferences"}%]]
%INCLUDE{%SYSTEMWEB%.TopMenuSkinTopicMenu}%
* [[BugTracker][%ICON{bug}% Bugs %ICON{menu-down}%]]
* [[NewReport][Create bug report]]
* [[OpenBugs][Open bugs]]
* [[ConfirmedBugs][Confirmed bugs]]
* [[FixedBugs][Fixed bugs]]
Use Menu-Bars in Topics
A menu-bar can be added anywhere in a topic:
- Include the "TWiki.TopMenuSkin" topic - this pulls in the CSS and JavaScript needed for the menu-bar.
- Create a nested bullet list with links:
- The top level bullets define the menu-bar items. Bullets with/without links are supported.
- Second level bullets define the pulldown options within a menu-bar item.
- A second level bullet must contain exactly one link (format
[[...][...]] or <a href="...">...</a> ) without any text next to the link.
- Third level bullets are not supported.
- Enclose the bullet list with a
<div class="twTopMenuTab"> tag.
Example:
%INCLUDE{"%SYSTEMWEB%.TopMenuSkin"}%
<div class="twTopMenuTab">
* [[WebHome][%ICON{home}% Home %ICON{menu-down}%]]
* [[WebNotify][Subscribe]]
* [[WebStatistics][Statistics]]
* [[WebSearch][%ICON{searchtopic}% Search %ICON{menu-down}%]]
* [[WebSearchAdvanced][Advanced search]]
* [[SearchHelp][Search help]]
</div>
Renders as:
NOTE: The pulldown menus only work if the TWiki:Plugins/JQueryPlugin is installed and enabled.
Read-Only Skin Mode
This skin and the PatternSkin support a read-only mode. This is mainly useful if you have TWiki application pages or dashboards where you do not want regular users to change content. The read-only mode is enabled with a READONLYSKINMODE preferences setting set to 1. Details in PatternSkinCustomization#ReadOnlySkinMode.
CSS and JavaScript
This section defines the CSS and JavaScript used by the TopMenuSkin; View Raw to see the source. Some additional CSS is defined in templates/vewi.topmenu.tmpl
<---->
<-- -->
Create Your Own Look
This skin is based on PatternSkin, and the same rules for customization apply.
The TopMenuSkin disables the sidebar and activates a different top bar in twiki/templates/view.topmenu.tmpl . Details in PatternSkinCustomization and PatternSkinCssCookbook.
The top bar TopMenuSkinTopBar (with menu bar, logo and search boxes) can be cloned using same topic name and customized per web.
Add a Sidebar
If you want a sidebar in addition to the top bar, define a WEBLEFTBAR setting with the name of the topic to include as the sidebar. This can be done in a WebPreferences for the whole web or in a topic. Example:
Fixed Menu-Bar
The FIXEDTOPMENU preferences setting determines if the menu-bar is fixed or auto-hidden. If set to on, the menu-bar is always visible at the top, regardless of the window scroll position. If off, the menu-bar hides when scrolled, and can be shown by hovering over - the gray TWiki icon.
Installation |
|
< < | Note: 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 TWiki is running. |
> > | This skin is pre-installed. TWiki administrators can upgrade the skin as needed on the TWiki server. |
|
> > | <--/twistyPlugin twikiMakeVisibleInline--> |
|
- Download the ZIP file from the Skin homepage (see below)
- Unzip
TopMenuSkin.zip in your twiki installation directory
- Install TWiki:Plugins/JQueryPlugin
and enable it using configure (if not done already)
- To turn on the skin, write in Main.TWikiPreferences:
* Set SKIN = topmenu, pattern
- Test if installed
- Note on upgrading existing TWiki:
- Note on using this skin on TWiki-5.1.1 and older:
- Note on using this skin on TWiki-4.2 and 4.3:
- This skin depends on TWiki 5.0 specific feature
%WEB{format="$current"}% to show the current web in the Web menu. To use this skin on TWiki 4.2 or 4.3, remove the parameter from the WEB variable (to show only %WEB% ), or apply patch TWikibug:Item6424 (to add the format parameter feature).
- This skin depends on TWiki 5.0 specific feature
%ADDTOHEAD{}% to add style sheets to the HTML head section. Apply patch TWiki:Support.SID-01117 to inline style sheets.
- Apply patch TWikibug:Item6430
so that Edit and Attach buttons point to the current topic instead of TopMenuSkinTopBar.
- Apply patch TWikibug:Item6438
so that breadcrumb links point to the current web instead of the TWiki web.
- Attach
to TWikiDocGraphics.
- Attach
to TWikiDocGraphics.
- If you have more than 30 webs, apply TWikibug:Item6429
to limit the number of webs shown in the "Home" menu.
|
|
> > | <--/twistyPlugin--> |
| Skin Info
- Set SHORTDESCRIPTION = Skin with pulldown menus in top bar
- Sponsor: Twiki, Inc.
|
|
> > | |
|
|
|
< < |
|
> > |
|
|
|
|
< < |
Skin Version: |
2012-09-18 |
Change History: |
<-- specify latest version first --> |
|
> > |
%TWISTY{ |
|
> > | mode="div"
showlink="Show Change History http://desperate4jesus.org/pub/TWiki/TWikiDocGraphics/toggleopen.gif"
hidelink="Hide Change History http://desperate4jesus.org/pub/TWiki/TWikiDocGraphics/toggleclose.gif"
}%
2013-02-16: |
TWikibug:Item7123 : Use TWISTY in installation instructions and change history |
|
|
|
|
> > | </> <--/twistyPlugin-->
|
|
Related topics: TopMenuSkinDefaultWebTopMenu, TopMenuSkinHomeMenu, TopMenuSkinTopBar, TopMenuSkinTopicMenu, WebTopMenu, _default.WebTopMenu, Main.WebTopMenu, Sandbox.WebTopMenu, Trash.WebTopMenu, TWikiSkins, TWikiSkinBrowser, UserDocumentationCategory, AdminDocumentationCategory
META FILEATTACHMENT |
attachment="fullscreen.png" attr="h" comment="" date="1346915516" name="fullscreen.png" path="fullscreen.png" size="109194" user="TWikiContributor" version="1" |
META FILEATTACHMENT |
attachment="screenshot.png" attr="h" comment="" date="1346915517" name="screenshot.png" path="screenshot.png" size="30309" user="TWikiContributor" version="1" |
|
| TopMenuSkin
<--
Contributions to this skin are appreciated. Please update the skin page at
http://twiki.org/cgi-bin/view/Plugins/TopMenuSkin or provide feedback at
http://twiki.org/cgi-bin/view/Plugins/TopMenuSkinDev .
If you are a TWiki contributor please update the skin in the SVN repository.
-->
The TopMenuSkin adds pulldown menus to the PatternSkin. |
|
< < | Screen Shot |
> > | Screenshot |
|
Tob Bar and Menu Structure |
|
< < |
This skin is sponsored by:

|
|
NOTE: The skin is designed to incorporate the "you are here" breadcrumb into the pulldown menus: "Home" menu => "Web" menu => List of parent topics, if any (shown as "P"s) => Current topic ("View" menu).
Web-specific Menu-Bars
The TopMenuSkinDefaultWebTopMenu defines the default menu structure used in any web. A WebTopMenu topic in a web can redefine the default menu structure. If the WebTopMenu topic is missing in a web, create one with content of _default.WebTopMenu and customize it. Bullets must be of format [[...][...]] or <a href="...">...</a> , and may not contain any text next to the link.
To preserve the "you are here" breadcrumb, it is important to add additional pulldown menus after the INCLUDE of %SYSTEMWEB%.TopMenuSkinTopicMenu. The top level menu-bar should have this structure:
- INCLUDE of %SYSTEMWEB%.TopMenuSkinHomeMenu
- Current Web menu
- INCLUDE of %SYSTEMWEB%.TopMenuSkinTopicMenu
- Additional pulldown menu(s) as needed (optional)
Example WebTopBar menu structure with additional "Bugs" pulldown menu:
%INCLUDE{%SYSTEMWEB%.TopMenuSkinHomeMenu}%
* [[%BASEWEB%.%HOMETOPIC%][<img src="%ICONURL{web-bg}%" border="0" alt="" width="16" height="16" style="background-color:%WEBBGCOLOR%" /> <nop>%MAKETEXT{"[_1] Web" args="%BASEWEB{format="$current"}%"}% %ICON{menu-down}%]]
* [[%SCRIPTURLPATH{"view"}%/%BASEWEB%/WebCreateNewTopic?topicparent=%BASETOPIC%][ %ICON{"newtopic"}% %MAKETEXT{"Create New Topic"}%]]
* [[%BASEWEB%.WebTopicList][ %ICON{"index"}% %MAKETEXT{"Index"}%]]
* [[%BASEWEB%.WebSearch][ %ICON{"searchtopic"}% %MAKETEXT{"Search"}%]]
* [[%BASEWEB%.WebChanges][ %ICON{"changes"}% %MAKETEXT{"Changes"}%]]
* [[%BASEWEB%.WebNotify][ %ICON{"notify"}% %MAKETEXT{"Notifications"}%]]
* [[%BASEWEB%.WebRss][ %ICON{"feed"}% %MAKETEXT{"RSS Feed"}%]]
* [[%BASEWEB%.WebStatistics][ %ICON{"statistics"}% %MAKETEXT{"Statistics"}%]]
* [[%BASEWEB%.WebPreferences][ %ICON{"wrench"}% %MAKETEXT{"Preferences"}%]]
%INCLUDE{%SYSTEMWEB%.TopMenuSkinTopicMenu}%
* [[BugTracker][%ICON{bug}% Bugs %ICON{menu-down}%]]
* [[NewReport][Create bug report]]
* [[OpenBugs][Open bugs]]
* [[ConfirmedBugs][Confirmed bugs]]
* [[FixedBugs][Fixed bugs]]
|
|
< < | Read-Only Skin Mode
This skin and the PatternSkin support a read-only mode. This is mainly useful if you have TWiki application pages or dashboards where you do not want regular users to change content. The read-only mode is enabled with a READONLYSKINMODE preferences setting set to 1. Details in PatternSkinCustomization#ReadOnlySkinMode. |
| Use Menu-Bars in Topics
A menu-bar can be added anywhere in a topic:
- Include the "TWiki.TopMenuSkin" topic - this pulls in the CSS and JavaScript needed for the menu-bar.
- Create a nested bullet list with links:
- The top level bullets define the menu-bar items. Bullets with/without links are supported.
- Second level bullets define the pulldown options within a menu-bar item.
- A second level bullet must contain exactly one link (format
[[...][...]] or <a href="...">...</a> ) without any text next to the link.
- Third level bullets are not supported.
- Enclose the bullet list with a
<div class="twTopMenuTab"> tag.
Example:
%INCLUDE{"%SYSTEMWEB%.TopMenuSkin"}%
<div class="twTopMenuTab">
* [[WebHome][%ICON{home}% Home %ICON{menu-down}%]]
* [[WebNotify][Subscribe]]
* [[WebStatistics][Statistics]]
* [[WebSearch][%ICON{searchtopic}% Search %ICON{menu-down}%]]
* [[WebSearchAdvanced][Advanced search]]
* [[SearchHelp][Search help]]
</div>
Renders as:
NOTE: The pulldown menus only work if the TWiki:Plugins/JQueryPlugin is installed and enabled. |
|
> > |
Read-Only Skin Mode
This skin and the PatternSkin support a read-only mode. This is mainly useful if you have TWiki application pages or dashboards where you do not want regular users to change content. The read-only mode is enabled with a READONLYSKINMODE preferences setting set to 1. Details in PatternSkinCustomization#ReadOnlySkinMode. |
| CSS and JavaScript
This section defines the CSS and JavaScript used by the TopMenuSkin; View Raw to see the source. Some additional CSS is defined in templates/vewi.topmenu.tmpl
<---->
<-- --> |
|
> > | Create Your Own Look
This skin is based on PatternSkin, and the same rules for customization apply.
The TopMenuSkin disables the sidebar and activates a different top bar in twiki/templates/view.topmenu.tmpl . Details in PatternSkinCustomization and PatternSkinCssCookbook.
The top bar TopMenuSkinTopBar (with menu bar, logo and search boxes) can be cloned using same topic name and customized per web.
Add a Sidebar
If you want a sidebar in addition to the top bar, define a WEBLEFTBAR setting with the name of the topic to include as the sidebar. This can be done in a WebPreferences for the whole web or in a topic. Example:
Fixed Menu-Bar
The FIXEDTOPMENU preferences setting determines if the menu-bar is fixed or auto-hidden. If set to on, the menu-bar is always visible at the top, regardless of the window scroll position. If off, the menu-bar hides when scrolled, and can be shown by hovering over - the gray TWiki icon. |
| Installation
Note: 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 TWiki is running.
- Download the ZIP file from the Skin homepage (see below)
- Unzip
TopMenuSkin.zip in your twiki installation directory
- Install TWiki:Plugins/JQueryPlugin
and enable it using configure (if not done already)
- To turn on the skin, write in Main.TWikiPreferences:
* Set SKIN = topmenu, pattern
- Test if installed
- Note on upgrading existing TWiki:
|
|
< < |
- Note on using this skin on TWiki 4.2 and 4.3:
|
> > |
- Note on using this skin on TWiki-5.1.1 and older:
|
|
> > |
-
- Note on using this skin on TWiki-4.2 and 4.3:
|
|
-
- This skin depends on TWiki 5.0 specific feature
%WEB{format="$current"}% to show the current web in the Web menu. To use this skin on TWiki 4.2 or 4.3, remove the parameter from the WEB variable (to show only %WEB% ), or apply patch TWikibug:Item6424 (to add the format parameter feature).
- This skin depends on TWiki 5.0 specific feature
%ADDTOHEAD{}% to add style sheets to the HTML head section. Apply patch TWiki:Support.SID-01117 to inline style sheets.
- Apply patch TWikibug:Item6430
so that Edit and Attach buttons point to the current topic instead of TopMenuSkinTopBar.
- Apply patch TWikibug:Item6438
so that breadcrumb links point to the current web instead of the TWiki web.
- Attach
to TWikiDocGraphics.
- Attach
to TWikiDocGraphics.
- If you have more than 30 webs, apply TWikibug:Item6429
to limit the number of webs shown in the "Home" menu.
|
|
< < | Creating your own look
This skin is based on PatternSkin, and the same rules for customization apply.
The TopMenuSkin disables the sidebar and activates a different top bar in twiki/templates/view.topmenu.tmpl . Details in PatternSkinCustomization and PatternSkinCssCookbook.
The top bar TopMenuSkinTopBar (with menu bar, logo and search boxes) can be cloned using same topic name and customized per web. |
| Skin Info
- Set SHORTDESCRIPTION = Skin with pulldown menus in top bar
|
|
> > | |
|
|
|
< < |
|
> > |
|
|
|
|
< < |
Skin Version: |
2011-07-28 |
Change History: |
<-- specify latest version first --> |
|
> > |
Skin Version: |
2012-09-18 |
Change History: |
<-- specify latest version first --> |
|
|
> > |
2012-09-18: |
TWikibug:Item6936 : Pulldown menu closes too early on hover if more than one menu on page |
2012-09-18: |
TWikibug:Item6934 : Option for auto-hidden or fixed top menu-bar with FIXEDTOPMENU preferences setting |
2012-09-06: |
TWikibug:Item6925 : Show TWiki help link in top-menu bar |
2012-09-04: |
TWikibug:Item6918 : New WEBLEFTBAR setting to show a sidebar |
|
|
Related topics: TopMenuSkinDefaultWebTopMenu, TopMenuSkinHomeMenu, TopMenuSkinTopBar, TopMenuSkinTopicMenu, WebTopMenu, _default.WebTopMenu, Main.WebTopMenu, Sandbox.WebTopMenu, Trash.WebTopMenu, TWikiSkins, TWikiSkinBrowser, UserDocumentationCategory, AdminDocumentationCategory |
|
< < |
META FILEATTACHMENT |
attachment="fullscreen.png" attr="h" comment="" date="1271719988" name="fullscreen.png" path="fullscreen.png" size="36985" user="TWikiContributor" version="1" |
META FILEATTACHMENT |
attachment="screenshot.png" attr="h" comment="" date="1271719875" name="screenshot.png" path="screenshot.png" size="15762" user="TWikiContributor" version="1" |
|
> > |
META FILEATTACHMENT |
attachment="fullscreen.png" attr="h" comment="" date="1346915516" name="fullscreen.png" path="fullscreen.png" size="109194" user="TWikiContributor" version="1" |
META FILEATTACHMENT |
attachment="screenshot.png" attr="h" comment="" date="1346915517" name="screenshot.png" path="screenshot.png" size="30309" user="TWikiContributor" version="1" |
|
| |
| TopMenuSkin
<--
Contributions to this skin are appreciated. Please update the skin page at
http://twiki.org/cgi-bin/view/Plugins/TopMenuSkin or provide feedback at
http://twiki.org/cgi-bin/view/Plugins/TopMenuSkinDev .
If you are a TWiki contributor please update the skin in the SVN repository.
-->
The TopMenuSkin adds pulldown menus to the PatternSkin.
Screen Shot
Tob Bar and Menu Structure
This skin is sponsored by:

NOTE: The skin is designed to incorporate the "you are here" breadcrumb into the pulldown menus: "Home" menu => "Web" menu => List of parent topics, if any (shown as "P"s) => Current topic ("View" menu).
Web-specific Menu-Bars
The TopMenuSkinDefaultWebTopMenu defines the default menu structure used in any web. A WebTopMenu topic in a web can redefine the default menu structure. If the WebTopMenu topic is missing in a web, create one with content of _default.WebTopMenu and customize it. Bullets must be of format [[...][...]] or <a href="...">...</a> , and may not contain any text next to the link.
To preserve the "you are here" breadcrumb, it is important to add additional pulldown menus after the INCLUDE of %SYSTEMWEB%.TopMenuSkinTopicMenu. The top level menu-bar should have this structure:
- INCLUDE of %SYSTEMWEB%.TopMenuSkinHomeMenu
- Current Web menu
- INCLUDE of %SYSTEMWEB%.TopMenuSkinTopicMenu
- Additional pulldown menu(s) as needed (optional)
Example WebTopBar menu structure with additional "Bugs" pulldown menu:
%INCLUDE{%SYSTEMWEB%.TopMenuSkinHomeMenu}%
* [[%BASEWEB%.%HOMETOPIC%][<img src="%ICONURL{web-bg}%" border="0" alt="" width="16" height="16" style="background-color:%WEBBGCOLOR%" /> <nop>%MAKETEXT{"[_1] Web" args="%BASEWEB{format="$current"}%"}% %ICON{menu-down}%]]
* [[%SCRIPTURLPATH{"view"}%/%BASEWEB%/WebCreateNewTopic?topicparent=%BASETOPIC%][ %ICON{"newtopic"}% %MAKETEXT{"Create New Topic"}%]]
* [[%BASEWEB%.WebTopicList][ %ICON{"index"}% %MAKETEXT{"Index"}%]]
* [[%BASEWEB%.WebSearch][ %ICON{"searchtopic"}% %MAKETEXT{"Search"}%]]
* [[%BASEWEB%.WebChanges][ %ICON{"changes"}% %MAKETEXT{"Changes"}%]]
* [[%BASEWEB%.WebNotify][ %ICON{"notify"}% %MAKETEXT{"Notifications"}%]]
* [[%BASEWEB%.WebRss][ %ICON{"feed"}% %MAKETEXT{"RSS Feed"}%]]
* [[%BASEWEB%.WebStatistics][ %ICON{"statistics"}% %MAKETEXT{"Statistics"}%]]
* [[%BASEWEB%.WebPreferences][ %ICON{"wrench"}% %MAKETEXT{"Preferences"}%]]
%INCLUDE{%SYSTEMWEB%.TopMenuSkinTopicMenu}%
* [[BugTracker][%ICON{bug}% Bugs %ICON{menu-down}%]]
* [[NewReport][Create bug report]]
* [[OpenBugs][Open bugs]]
* [[ConfirmedBugs][Confirmed bugs]]
* [[FixedBugs][Fixed bugs]]
|
|
> > | Read-Only Skin Mode
This skin and the PatternSkin support a read-only mode. This is mainly useful if you have TWiki application pages or dashboards where you do not want regular users to change content. The read-only mode is enabled with a READONLYSKINMODE preferences setting set to 1. Details in PatternSkinCustomization#ReadOnlySkinMode. |
| Use Menu-Bars in Topics
A menu-bar can be added anywhere in a topic:
- Include the "TWiki.TopMenuSkin" topic - this pulls in the CSS and JavaScript needed for the menu-bar.
- Create a nested bullet list with links:
- The top level bullets define the menu-bar items. Bullets with/without links are supported.
- Second level bullets define the pulldown options within a menu-bar item.
- A second level bullet must contain exactly one link (format
[[...][...]] or <a href="...">...</a> ) without any text next to the link.
- Third level bullets are not supported.
- Enclose the bullet list with a
<div class="twTopMenuTab"> tag.
Example:
%INCLUDE{"%SYSTEMWEB%.TopMenuSkin"}%
<div class="twTopMenuTab">
* [[WebHome][%ICON{home}% Home %ICON{menu-down}%]]
* [[WebNotify][Subscribe]]
* [[WebStatistics][Statistics]]
* [[WebSearch][%ICON{searchtopic}% Search %ICON{menu-down}%]]
* [[WebSearchAdvanced][Advanced search]]
* [[SearchHelp][Search help]]
</div>
Renders as:
NOTE: The pulldown menus only work if the TWiki:Plugins/JQueryPlugin is installed and enabled.
CSS and JavaScript
This section defines the CSS and JavaScript used by the TopMenuSkin; View Raw to see the source. Some additional CSS is defined in templates/vewi.topmenu.tmpl
<---->
<-- -->
Installation
Note: 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 TWiki is running.
- Download the ZIP file from the Skin homepage (see below)
- Unzip
TopMenuSkin.zip in your twiki installation directory
- Install TWiki:Plugins/JQueryPlugin
and enable it using configure (if not done already)
- To turn on the skin, write in Main.TWikiPreferences:
* Set SKIN = topmenu, pattern
- Test if installed
- Note on upgrading existing TWiki:
- Note on using this skin on TWiki 4.2 and 4.3:
|
|
< < |
-
- This skin depends on TWiki 5.0 specific feature
%WEB{format="$current"}% to show the current web in the Web menu. To use this skin on TWiki 4.2 or 4.3, remove the parameter from the WEB variable (to show only %WEB% ), or apply patch TWiki:Item6424 (to add the format parameter feature).
|
> > |
-
- This skin depends on TWiki 5.0 specific feature
%WEB{format="$current"}% to show the current web in the Web menu. To use this skin on TWiki 4.2 or 4.3, remove the parameter from the WEB variable (to show only %WEB% ), or apply patch TWikibug:Item6424 (to add the format parameter feature).
|
|
-
- This skin depends on TWiki 5.0 specific feature
%ADDTOHEAD{}% to add style sheets to the HTML head section. Apply patch TWiki:Support.SID-01117 to inline style sheets.
- Apply patch TWikibug:Item6430
so that Edit and Attach buttons point to the current topic instead of TopMenuSkinTopBar.
|
|
> > |
-
- Apply patch TWikibug:Item6438
so that breadcrumb links point to the current web instead of the TWiki web.
|
|
Creating your own look
This skin is based on PatternSkin, and the same rules for customization apply.
The TopMenuSkin disables the sidebar and activates a different top bar in twiki/templates/view.topmenu.tmpl . Details in PatternSkinCustomization and PatternSkinCssCookbook.
The top bar TopMenuSkinTopBar (with menu bar, logo and search boxes) can be cloned using same topic name and customized per web.
Skin Info
- Set SHORTDESCRIPTION = Skin with pulldown menus in top bar
|
|
< < |
|
> > |
|
|
|
|
< < |
Skin Version: |
2011-03-09 (v1.94) |
|
> > |
|
|
Change History: |
<-- specify latest version first --> |
|
|
> > |
|
|
|
|
< < | Related topics: WebTopMenu, TopMenuSkinDefaultWebTopMenu, TopMenuSkinHomeMenu, TopMenuSkinTopBar, TopMenuSkinTopicMenu, TWikiSkins, TWikiSkinBrowser, UserDocumentationCategory, AdminDocumentationCategory |
> > | Related topics: TopMenuSkinDefaultWebTopMenu, TopMenuSkinHomeMenu, TopMenuSkinTopBar, TopMenuSkinTopicMenu, WebTopMenu, _default.WebTopMenu, Main.WebTopMenu, Sandbox.WebTopMenu, Trash.WebTopMenu, TWikiSkins, TWikiSkinBrowser, UserDocumentationCategory, AdminDocumentationCategory |
|
META FILEATTACHMENT |
attachment="fullscreen.png" attr="h" comment="" date="1271719988" name="fullscreen.png" path="fullscreen.png" size="36985" user="TWikiContributor" version="1" |
META FILEATTACHMENT |
attachment="screenshot.png" attr="h" comment="" date="1271719875" name="screenshot.png" path="screenshot.png" size="15762" user="TWikiContributor" version="1" |
|
| TopMenuSkin
<--
Contributions to this skin are appreciated. Please update the skin page at
http://twiki.org/cgi-bin/view/Plugins/TopMenuSkin or provide feedback at
http://twiki.org/cgi-bin/view/Plugins/TopMenuSkinDev .
If you are a TWiki contributor please update the skin in the SVN repository.
--> |
|
> > | |
| |
|
> > | |
| The TopMenuSkin adds pulldown menus to the PatternSkin.
Screen Shot
Tob Bar and Menu Structure
This skin is sponsored by:

|
|
< < | |
> > | |
|
< < | |
|
NOTE: The skin is designed to incorporate the "you are here" breadcrumb into the pulldown menus: "Home" menu => "Web" menu => List of parent topics, if any (shown as "P"s) => Current topic ("View" menu).
Web-specific Menu-Bars
The TopMenuSkinDefaultWebTopMenu defines the default menu structure used in any web. A WebTopMenu topic in a web can redefine the default menu structure. If the WebTopMenu topic is missing in a web, create one with content of _default.WebTopMenu and customize it. Bullets must be of format [[...][...]] or <a href="...">...</a> , and may not contain any text next to the link.
To preserve the "you are here" breadcrumb, it is important to add additional pulldown menus after the INCLUDE of %SYSTEMWEB%.TopMenuSkinTopicMenu. The top level menu-bar should have this structure:
- INCLUDE of %SYSTEMWEB%.TopMenuSkinHomeMenu
- Current Web menu
- INCLUDE of %SYSTEMWEB%.TopMenuSkinTopicMenu
- Additional pulldown menu(s) as needed (optional)
Example WebTopBar menu structure with additional "Bugs" pulldown menu:
%INCLUDE{%SYSTEMWEB%.TopMenuSkinHomeMenu}%
* [[%BASEWEB%.%HOMETOPIC%][<img src="%ICONURL{web-bg}%" border="0" alt="" width="16" height="16" style="background-color:%WEBBGCOLOR%" /> <nop>%MAKETEXT{"[_1] Web" args="%BASEWEB{format="$current"}%"}% %ICON{menu-down}%]]
* [[%SCRIPTURLPATH{"view"}%/%BASEWEB%/WebCreateNewTopic?topicparent=%BASETOPIC%][ %ICON{"newtopic"}% %MAKETEXT{"Create New Topic"}%]]
* [[%BASEWEB%.WebTopicList][ %ICON{"index"}% %MAKETEXT{"Index"}%]]
* [[%BASEWEB%.WebSearch][ %ICON{"searchtopic"}% %MAKETEXT{"Search"}%]]
* [[%BASEWEB%.WebChanges][ %ICON{"changes"}% %MAKETEXT{"Changes"}%]]
* [[%BASEWEB%.WebNotify][ %ICON{"notify"}% %MAKETEXT{"Notifications"}%]]
* [[%BASEWEB%.WebRss][ %ICON{"feed"}% %MAKETEXT{"RSS Feed"}%]]
* [[%BASEWEB%.WebStatistics][ %ICON{"statistics"}% %MAKETEXT{"Statistics"}%]]
* [[%BASEWEB%.WebPreferences][ %ICON{"wrench"}% %MAKETEXT{"Preferences"}%]]
%INCLUDE{%SYSTEMWEB%.TopMenuSkinTopicMenu}%
* [[BugTracker][%ICON{bug}% Bugs %ICON{menu-down}%]]
* [[NewReport][Create bug report]]
* [[OpenBugs][Open bugs]]
* [[ConfirmedBugs][Confirmed bugs]]
* [[FixedBugs][Fixed bugs]]
Use Menu-Bars in Topics
A menu-bar can be added anywhere in a topic:
- Include the "TWiki.TopMenuSkin" topic - this pulls in the CSS and JavaScript needed for the menu-bar.
- Create a nested bullet list with links:
- The top level bullets define the menu-bar items. Bullets with/without links are supported.
- Second level bullets define the pulldown options within a menu-bar item.
- A second level bullet must contain exactly one link (format
[[...][...]] or <a href="...">...</a> ) without any text next to the link.
- Third level bullets are not supported.
- Enclose the bullet list with a
<div class="twTopMenuTab"> tag.
Example:
%INCLUDE{"%SYSTEMWEB%.TopMenuSkin"}%
<div class="twTopMenuTab">
* [[WebHome][%ICON{home}% Home %ICON{menu-down}%]]
* [[WebNotify][Subscribe]]
* [[WebStatistics][Statistics]]
* [[WebSearch][%ICON{searchtopic}% Search %ICON{menu-down}%]]
* [[WebSearchAdvanced][Advanced search]]
* [[SearchHelp][Search help]]
</div>
Renders as:
NOTE: The pulldown menus only work if the TWiki:Plugins/JQueryPlugin is installed and enabled.
CSS and JavaScript |
|
< < | This section defines the CSS and JavaScript. (View Raw to see the source.) |
> > | This section defines the CSS and JavaScript used by the TopMenuSkin; View Raw to see the source. Some additional CSS is defined in templates/vewi.topmenu.tmpl |
|
<---->
<-- -->
Installation
Note: 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 TWiki is running.
- Download the ZIP file from the Skin homepage (see below)
- Unzip
TopMenuSkin.zip in your twiki installation directory
- Install TWiki:Plugins/JQueryPlugin
and enable it using configure (if not done already)
- To turn on the skin, write in Main.TWikiPreferences:
* Set SKIN = topmenu, pattern
- Test if installed
- Note on upgrading existing TWiki:
- Note on using this skin on TWiki 4.2 and 4.3:
- This skin depends on TWiki 5.0 specific feature
%WEB{format="$current"}% to show the current web in the Web menu. To use this skin on TWiki 4.2 or 4.3, remove the parameter from the WEB variable (to show only %WEB% ), or apply patch TWiki:Item6424 (to add the format parameter feature).
|
|
> > |
-
- This skin depends on TWiki 5.0 specific feature
%ADDTOHEAD{}% to add style sheets to the HTML head section. Apply patch TWiki:Support.SID-01117 to inline style sheets.
|
|
Creating your own look
This skin is based on PatternSkin, and the same rules for customization apply.
The TopMenuSkin disables the sidebar and activates a different top bar in twiki/templates/view.topmenu.tmpl . Details in PatternSkinCustomization and PatternSkinCssCookbook. |
|
> > | The top bar TopMenuSkinTopBar (with menu bar, logo and search boxes) can be cloned using same topic name and customized per web. |
| Skin Info
- Set SHORTDESCRIPTION = Skin with pulldown menus in top bar
|
|
< < |
|
> > |
|
|
|
|
< < |
Skin Version: |
2010-10-03 (v1.91) |
|
> > |
Skin Version: |
2011-03-09 (v1.94) |
|
|
Change History: |
<-- specify latest version first --> |
|
|
< < |
2010-10-03: |
TWikibug:Item6588 - use gray TWiki icon in top menu bar instead of orange icon |
2010-09-23: |
TWikibug:Item6530 - add ManagingUsers to top menu of TWiki web |
2010-08-21: |
TWikibug:Item6524 - fix for no Account pulldown menu on IE7 Opera browser -- TWiki:Main.MalcolmNeumeyer |
2010-06-09: |
TWikibug:Item6485 - fix banner background image position issue on Safari |
2010-06-06: |
TWikibug:Item6482 - XHTML validation fixes; moving CSS to HTML head using ADDTOHEAD variable |
2010-06-05: |
TWikibug:Item6475 - better indication of breadcrumb in top menu using large arrows |
2010-05-26: |
TWikibug:Item6471 - show topic info in tooltip of View menu; show tooltip help in View and Edit menu items; point raw view and print version to actual topic revision |
2010-05-20: |
TWikibug:Item6455 - use %ICON{menu-down}% instead of long img tag in menu-bars |
2010-05-01: |
TWikibug:Item6437 - removed loading of jQuery Javascript library to avoid double load issue; require JQueryPlugin installed and enabled |
2010-04-26: |
TWikibug:Item6435 - doc improvements |
2010-04-21: |
TWikibug:Item6431 - fix hardcoded reference to JQueryPlugin CSS and JS; doc improvements |
2010-04-19: |
TWikibug:Item6413 - initial release (v1.0) |
|
> > |
2011-03-09: |
TWikibug:Item6659 : Customizable web-specific TopMenuSkinTopBar |
2011-01-03: |
TWikibug:Item6628 : Minor gradient fix - change action buttons area from plain white to pale gray to align with PatternSkin; adding pale shadow |
2010-12-02: |
TWikibug:Item6614 : Always show Register User link in Account menu, regardless of login status |
2010-10-03: |
TWikibug:Item6588 : Use gray TWiki icon in top menu bar instead of orange icon |
2010-09-23: |
TWikibug:Item6530 : Add ManagingUsers to top menu of TWiki web |
2010-08-21: |
TWikibug:Item6524 : Fix for no Account pulldown menu on IE7 Opera browser -- TWiki:Main.MalcolmNeumeyer |
2010-06-09: |
TWikibug:Item6485 : Fix banner background image position issue on Safari |
2010-06-06: |
TWikibug:Item6482 : XHTML validation fixes; moving CSS to HTML head using ADDTOHEAD variable |
2010-06-05: |
TWikibug:Item6475 : Better indication of breadcrumb in top menu using large arrows |
2010-05-26: |
TWikibug:Item6471 : Show topic info in tooltip of View menu; show tooltip help in View and Edit menu items; point raw view and print version to actual topic revision |
2010-05-20: |
TWikibug:Item6455 : Use %ICON{menu-down}% instead of long img tag in menu-bars |
2010-05-01: |
TWikibug:Item6437 : Removed loading of jQuery Javascript library to avoid double load issue; require JQueryPlugin installed and enabled |
|
|
> > |
|
|
Related topics: WebTopMenu, TopMenuSkinDefaultWebTopMenu, TopMenuSkinHomeMenu, TopMenuSkinTopBar, TopMenuSkinTopicMenu, TWikiSkins, TWikiSkinBrowser, UserDocumentationCategory, AdminDocumentationCategory
META FILEATTACHMENT |
attachment="fullscreen.png" attr="h" comment="" date="1271719988" name="fullscreen.png" path="fullscreen.png" size="36985" user="TWikiContributor" version="1" |
META FILEATTACHMENT |
attachment="screenshot.png" attr="h" comment="" date="1271719875" name="screenshot.png" path="screenshot.png" size="15762" user="TWikiContributor" version="1" |
|
| TopMenuSkin
<--
Contributions to this skin are appreciated. Please update the skin page at
http://twiki.org/cgi-bin/view/Plugins/TopMenuSkin or provide feedback at
http://twiki.org/cgi-bin/view/Plugins/TopMenuSkinDev .
If you are a TWiki contributor please update the skin in the SVN repository.
-->
The TopMenuSkin adds pulldown menus to the PatternSkin.
Screen Shot
Tob Bar and Menu Structure
This skin is sponsored by:

NOTE: The skin is designed to incorporate the "you are here" breadcrumb into the pulldown menus: "Home" menu => "Web" menu => List of parent topics, if any (shown as "P"s) => Current topic ("View" menu).
Web-specific Menu-Bars
The TopMenuSkinDefaultWebTopMenu defines the default menu structure used in any web. A WebTopMenu topic in a web can redefine the default menu structure. If the WebTopMenu topic is missing in a web, create one with content of _default.WebTopMenu and customize it. Bullets must be of format [[...][...]] or <a href="...">...</a> , and may not contain any text next to the link.
To preserve the "you are here" breadcrumb, it is important to add additional pulldown menus after the INCLUDE of %SYSTEMWEB%.TopMenuSkinTopicMenu. The top level menu-bar should have this structure:
- INCLUDE of %SYSTEMWEB%.TopMenuSkinHomeMenu
- Current Web menu
- INCLUDE of %SYSTEMWEB%.TopMenuSkinTopicMenu
- Additional pulldown menu(s) as needed (optional)
Example WebTopBar menu structure with additional "Bugs" pulldown menu:
%INCLUDE{%SYSTEMWEB%.TopMenuSkinHomeMenu}%
* [[%BASEWEB%.%HOMETOPIC%][<img src="%ICONURL{web-bg}%" border="0" alt="" width="16" height="16" style="background-color:%WEBBGCOLOR%" /> <nop>%MAKETEXT{"[_1] Web" args="%BASEWEB{format="$current"}%"}% %ICON{menu-down}%]]
* [[%SCRIPTURLPATH{"view"}%/%BASEWEB%/WebCreateNewTopic?topicparent=%BASETOPIC%][ %ICON{"newtopic"}% %MAKETEXT{"Create New Topic"}%]]
* [[%BASEWEB%.WebTopicList][ %ICON{"index"}% %MAKETEXT{"Index"}%]]
* [[%BASEWEB%.WebSearch][ %ICON{"searchtopic"}% %MAKETEXT{"Search"}%]]
* [[%BASEWEB%.WebChanges][ %ICON{"changes"}% %MAKETEXT{"Changes"}%]]
* [[%BASEWEB%.WebNotify][ %ICON{"notify"}% %MAKETEXT{"Notifications"}%]]
* [[%BASEWEB%.WebRss][ %ICON{"feed"}% %MAKETEXT{"RSS Feed"}%]]
* [[%BASEWEB%.WebStatistics][ %ICON{"statistics"}% %MAKETEXT{"Statistics"}%]]
* [[%BASEWEB%.WebPreferences][ %ICON{"wrench"}% %MAKETEXT{"Preferences"}%]]
%INCLUDE{%SYSTEMWEB%.TopMenuSkinTopicMenu}%
* [[BugTracker][%ICON{bug}% Bugs %ICON{menu-down}%]]
* [[NewReport][Create bug report]]
* [[OpenBugs][Open bugs]]
* [[ConfirmedBugs][Confirmed bugs]]
* [[FixedBugs][Fixed bugs]]
Use Menu-Bars in Topics
A menu-bar can be added anywhere in a topic:
- Include the "TWiki.TopMenuSkin" topic - this pulls in the CSS and JavaScript needed for the menu-bar.
- Create a nested bullet list with links:
- The top level bullets define the menu-bar items. Bullets with/without links are supported.
- Second level bullets define the pulldown options within a menu-bar item.
- A second level bullet must contain exactly one link (format
[[...][...]] or <a href="...">...</a> ) without any text next to the link.
- Third level bullets are not supported.
- Enclose the bullet list with a
<div class="twTopMenuTab"> tag.
Example:
%INCLUDE{"%SYSTEMWEB%.TopMenuSkin"}%
<div class="twTopMenuTab">
* [[WebHome][%ICON{home}% Home %ICON{menu-down}%]]
* [[WebNotify][Subscribe]]
* [[WebStatistics][Statistics]]
* [[WebSearch][%ICON{searchtopic}% Search %ICON{menu-down}%]]
* [[WebSearchAdvanced][Advanced search]]
* [[SearchHelp][Search help]]
</div>
Renders as:
NOTE: The pulldown menus only work if the TWiki:Plugins/JQueryPlugin is installed and enabled.
CSS and JavaScript
This section defines the CSS and JavaScript. (View Raw to see the source.)
<---->
|
|
< < | |
> > | <-- -->%ADDTOHEAD{ |
|
> > | "TOPMENUSKIN_CSS"
text=" |
| .twTopMenuTab
{
height: 22px;
width: auto;
color: #111111;
background-image: url(/pub/TWiki/TopMenuSkin/menu-gray-bg.png);
background-repeat: repeat-x;
overflow: hidden;
white-space: nowrap;
}
.twTopMenuTab ul
{
height: 22px;
margin: 0;
padding: 0;
list-style: none;
}
.twTopMenuTab ul li
{
float: left;
font: 13px Tahoma, Arial;
vertical-align: middle;
width: auto;
white-space: nowrap;
}
.twTopMenuTab ul li a
{
display: block;
padding: 2px 8px 3px 8px;
text-decoration: none;
color: #111111;
}
.twTopMenuTab ul li a:hover
{
background-image: url(/pub/TWiki/TopMenuSkin/menu-reverse-bg.png);
color: #111111;
text-decoration: none;
}
.twTopMenuTab ul li ul
{
margin: 0;
padding: 0;
position: absolute;
visibility: hidden;
border-top: 1px solid white;
color: #111111;
z-index: 9000;
}
.twTopMenuTab ul li ul li
{
float: none;
display: inline;
}
.twTopMenuTab ul li ul li a
{
width: auto;
background-color: #F7F8F8;
background-image: url(/pub/TWiki/TopMenuSkin/menu-pulldown-bg.png);
background-repeat: repeat-y;
padding: 3px 8px;
}
.twTopMenuTab ul li ul li a:hover
{
background-color: #AFB3C5;
background-repeat: repeat;
} |
|
< < |
<-- --> |
> > | "
}% |
|
Installation
Note: 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 TWiki is running.
- Download the ZIP file from the Skin homepage (see below)
- Unzip
TopMenuSkin.zip in your twiki installation directory
- Install TWiki:Plugins/JQueryPlugin
and enable it using configure (if not done already)
- To turn on the skin, write in Main.TWikiPreferences:
* Set SKIN = topmenu, pattern
- Test if installed
- Note on upgrading existing TWiki:
- Note on using this skin on TWiki 4.2 and 4.3:
- This skin depends on TWiki 5.0 specific feature
%WEB{format="$current"}% to show the current web in the Web menu. To use this skin on TWiki 4.2 or 4.3, remove the parameter from the WEB variable (to show only %WEB% ), or apply patch TWiki:Item6424 (to add the format parameter feature).
- Apply patch TWikibug:Item6430
so that Edit and Attach buttons point to the current topic instead of TopMenuSkinTopBar.
|
|
< < | |
> > | |
|
> > | |
|
-
- If you have more than 30 webs, apply TWikibug:Item6429
to limit the number of webs shown in the "Home" menu.
Creating your own look
This skin is based on PatternSkin, and the same rules for customization apply.
The TopMenuSkin disables the sidebar and activates a different top bar in twiki/templates/view.topmenu.tmpl . Details in PatternSkinCustomization and PatternSkinCssCookbook.
Skin Info
- Set SHORTDESCRIPTION = Skin with pulldown menus in top bar
|
|
< < |
Screenshot: |
|
|
> > |
Screenshot: |
|
|
|
|
|
< < |
Skin Version: |
2010-05-26 (v1.4) |
|
> > |
Skin Version: |
2010-10-03 (v1.91) |
|
|
Change History: |
<-- specify latest version first --> |
|
|
> > |
|
|
Related topics: WebTopMenu, TopMenuSkinDefaultWebTopMenu, TopMenuSkinHomeMenu, TopMenuSkinTopBar, TopMenuSkinTopicMenu, TWikiSkins, TWikiSkinBrowser, UserDocumentationCategory, AdminDocumentationCategory
META FILEATTACHMENT |
attachment="fullscreen.png" attr="h" comment="" date="1271719988" name="fullscreen.png" path="fullscreen.png" size="36985" user="TWikiContributor" version="1" |
META FILEATTACHMENT |
attachment="screenshot.png" attr="h" comment="" date="1271719875" name="screenshot.png" path="screenshot.png" size="15762" user="TWikiContributor" version="1" |
|
| TopMenuSkin
<--
Contributions to this skin are appreciated. Please update the skin page at
http://twiki.org/cgi-bin/view/Plugins/TopMenuSkin or provide feedback at
http://twiki.org/cgi-bin/view/Plugins/TopMenuSkinDev .
If you are a TWiki contributor please update the skin in the SVN repository.
-->
The TopMenuSkin adds pulldown menus to the PatternSkin.
Screen Shot
Tob Bar and Menu Structure
This skin is sponsored by:

NOTE: The skin is designed to incorporate the "you are here" breadcrumb into the pulldown menus: "Home" menu => "Web" menu => List of parent topics, if any (shown as "P"s) => Current topic ("View" menu).
Web-specific Menu-Bars
The TopMenuSkinDefaultWebTopMenu defines the default menu structure used in any web. A WebTopMenu topic in a web can redefine the default menu structure. If the WebTopMenu topic is missing in a web, create one with content of _default.WebTopMenu and customize it. Bullets must be of format [[...][...]] or <a href="...">...</a> , and may not contain any text next to the link.
To preserve the "you are here" breadcrumb, it is important to add additional pulldown menus after the INCLUDE of %SYSTEMWEB%.TopMenuSkinTopicMenu. The top level menu-bar should have this structure:
- INCLUDE of %SYSTEMWEB%.TopMenuSkinHomeMenu
- Current Web menu
- INCLUDE of %SYSTEMWEB%.TopMenuSkinTopicMenu
- Additional pulldown menu(s) as needed (optional)
Example WebTopBar menu structure with additional "Bugs" pulldown menu:
%INCLUDE{%SYSTEMWEB%.TopMenuSkinHomeMenu}%
* [[%BASEWEB%.%HOMETOPIC%][<img src="%ICONURL{web-bg}%" border="0" alt="" width="16" height="16" style="background-color:%WEBBGCOLOR%" /> <nop>%MAKETEXT{"[_1] Web" args="%BASEWEB{format="$current"}%"}% %ICON{menu-down}%]]
* [[%SCRIPTURLPATH{"view"}%/%BASEWEB%/WebCreateNewTopic?topicparent=%BASETOPIC%][ %ICON{"newtopic"}% %MAKETEXT{"Create New Topic"}%]]
* [[%BASEWEB%.WebTopicList][ %ICON{"index"}% %MAKETEXT{"Index"}%]]
* [[%BASEWEB%.WebSearch][ %ICON{"searchtopic"}% %MAKETEXT{"Search"}%]]
* [[%BASEWEB%.WebChanges][ %ICON{"changes"}% %MAKETEXT{"Changes"}%]]
* [[%BASEWEB%.WebNotify][ %ICON{"notify"}% %MAKETEXT{"Notifications"}%]]
* [[%BASEWEB%.WebRss][ %ICON{"feed"}% %MAKETEXT{"RSS Feed"}%]]
* [[%BASEWEB%.WebStatistics][ %ICON{"statistics"}% %MAKETEXT{"Statistics"}%]]
* [[%BASEWEB%.WebPreferences][ %ICON{"wrench"}% %MAKETEXT{"Preferences"}%]]
%INCLUDE{%SYSTEMWEB%.TopMenuSkinTopicMenu}%
* [[BugTracker][%ICON{bug}% Bugs %ICON{menu-down}%]]
* [[NewReport][Create bug report]]
* [[OpenBugs][Open bugs]]
* [[ConfirmedBugs][Confirmed bugs]]
* [[FixedBugs][Fixed bugs]]
Use Menu-Bars in Topics
A menu-bar can be added anywhere in a topic:
- Include the "TWiki.TopMenuSkin" topic - this pulls in the CSS and JavaScript needed for the menu-bar.
- Create a nested bullet list with links:
- The top level bullets define the menu-bar items. Bullets with/without links are supported.
- Second level bullets define the pulldown options within a menu-bar item.
- A second level bullet must contain exactly one link (format
[[...][...]] or <a href="...">...</a> ) without any text next to the link.
- Third level bullets are not supported.
- Enclose the bullet list with a
<div class="twTopMenuTab"> tag.
Example:
%INCLUDE{"%SYSTEMWEB%.TopMenuSkin"}%
<div class="twTopMenuTab">
* [[WebHome][%ICON{home}% Home %ICON{menu-down}%]]
* [[WebNotify][Subscribe]]
* [[WebStatistics][Statistics]]
* [[WebSearch][%ICON{searchtopic}% Search %ICON{menu-down}%]]
* [[WebSearchAdvanced][Advanced search]]
* [[SearchHelp][Search help]]
</div>
Renders as:
NOTE: The pulldown menus only work if the TWiki:Plugins/JQueryPlugin is installed and enabled.
CSS and JavaScript
This section defines the CSS and JavaScript. (View Raw to see the source.)
<---->
<-- -->
Installation
Note: 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 TWiki is running.
- Download the ZIP file from the Skin homepage (see below)
- Unzip
TopMenuSkin.zip in your twiki installation directory
- Install TWiki:Plugins/JQueryPlugin
and enable it using configure (if not done already)
- To turn on the skin, write in Main.TWikiPreferences:
* Set SKIN = topmenu, pattern
- Test if installed
- Note on upgrading existing TWiki:
- Note on using this skin on TWiki 4.2 and 4.3:
- This skin depends on TWiki 5.0 specific feature
%WEB{format="$current"}% to show the current web in the Web menu. To use this skin on TWiki 4.2 or 4.3, remove the parameter from the WEB variable (to show only %WEB% ), or apply patch TWiki:Item6424 (to add the format parameter feature).
- Apply patch TWikibug:Item6430
so that Edit and Attach buttons point to the current topic instead of TopMenuSkinTopBar.
- Attach
and to TWikiDocGraphics.
- If you have more than 30 webs, apply TWikibug:Item6429
to limit the number of webs shown in the "Home" menu.
Creating your own look
This skin is based on PatternSkin, and the same rules for customization apply.
The TopMenuSkin disables the sidebar and activates a different top bar in twiki/templates/view.topmenu.tmpl . Details in PatternSkinCustomization and PatternSkinCssCookbook.
Skin Info
- Set SHORTDESCRIPTION = Skin with pulldown menus in top bar
Related topics: WebTopMenu, TopMenuSkinDefaultWebTopMenu, TopMenuSkinHomeMenu, TopMenuSkinTopBar, TopMenuSkinTopicMenu, TWikiSkins, TWikiSkinBrowser, UserDocumentationCategory, AdminDocumentationCategory
META FILEATTACHMENT |
attachment="fullscreen.png" attr="h" comment="" date="1271719988" name="fullscreen.png" path="fullscreen.png" size="36985" user="TWikiContributor" version="1" |
META FILEATTACHMENT |
attachment="screenshot.png" attr="h" comment="" date="1271719875" name="screenshot.png" path="screenshot.png" size="15762" user="TWikiContributor" version="1" |
|

Copyright © 1999-2025 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.TopMenuSkin.