Top Panel Menu

Last modified by Clemens Robbenhaar on 2022/02/28 00:29

cogAdd an expandable top menu panel easily customizable to display a main summary
TypeXAR
CategoryUI Extension
Developed by

Pascal Bastien

Active Installs8
Rating
1 Votes
LicenseGNU Lesser General Public License 2.1

Installable with the Extension Manager

Description

Provides an application to display a customizable and expandable top menu panel.
To fill the menu content simply create children pages with naming convention.
When this extension is installed, a standard user can customize easily the menu by creating pages and filling links entries (bulletted list).

See a menu behavour example:

Demo_Top_Panel_Menu.gif

Extension content

This extension is completed with 2 tabs and a few links, but you are invited to modify them and add another tabs.

Customize your menu

The menu documentation is displayed in CustomExtension.TopPanelMenu.Top panel menu documentation.WebHome page.

Important elements of menu to add and/or modify are:

  • tabs (Tab-xx)
    and the expanded menu, when clicking on a tab, displays:
  • one or more columns (Col-xx)
  • and 1 to several links (or text) groups: (Listitem-xx)

All code is in CustomExtension.TopPanelMenu.Content.WebHome and the children pages contain the list of shortcuts (Listitem-xx).

To add a tab in menu (Tab-xx), you have to create a children page, in /CustomExtension/TopPanelMenu/Content/ location, named "Tab-xx" (xx is usually a number to sort tabs) and the page title, the tab label to displayed.

To add a column (Col-xx) in the expanded menu, you have to create a children page, in /CustomExtension/TopPanelMenu/Content/Tab-xx/ location, named "Col-xx" (xx to sort columns). The title does not matter here  eg CustomExtension.TopPanelMenu.Content.Tab-01.Col-01.WebHome page.

To add a shortcut group ( Listitem-xx ), simply create a children page of /CustomExtension/TopPanelMenu/Content/Tab-xx/Col-xx/WebHome with the name "Listitem-xx" ( xx to sort groups) and the page title, the title of the links group, eg CustomExtension.TopPanelMenu.Content.Tab-01.Col-01.Listitem-01.WebHome

Finally links are added to this last page as a bulleted list.

To delete a links group, a column or a tab, simply delete the page concerned and its childrens pages.

If you want move a group of links, a column or a tab, just move the page and its childrens pages (uncheck redirection) taking care to move it to the correct location ( tree: Content-> Tab- xx-> Col-xx-> Listitem-xx ) and name the page correctly: Tab-xx, Col-xx, Listitem-xx

To navigate in the different pages to create / modify the menu, it is wise to use the breadcrumb.

Here is the correspondence between the name of the page and the menu displayed.
MenuAndPageName.png

New in 1.1

If you are in a sub wiki, you can also choose to reuse the navigation from the main wiki by setting a checkbox and save the new settings. In that case the navigation entries for the sub wiki will be displayed greyed out on the overview page.

subwiki-use-mainwiki-navigation.png

This only works if you do not have users only available in the subwiki that cannot see the main wiki, however.

tested on

  • XWiki 9.11.4
  • XWiki 10.11.3
  • XWiki 12.10.8
  • XWiki 13.8

Prerequisites & Installation Instructions

  • install this extension via the extension manager of the XWiki administration (preferred) or import the application-toppanel-menu-1.1.xar extension file
  • after a refresh of xwiki in your browser, you can see this 2 examples Tab in the menu:
    2Tabs.png
  • now you can customize your menu.

This application is composed by:

  • the application root: CustomExtension.ToppanelMenu
    • Main summary, the summary table (displayed in the menu and in a flat way)
    • Menu content, location of menu content, aka all children page (Tab-xx,Col-xx,Listitem-xx)
    • Style, location of CSS styling
      • Flat, CSS styling of the menu in flat way
      • NavBar, CSS styling of the expandable menu
    • Top panel menu documentation, displayed menu documentation
    • Translations, menu translation
    • AfterHeaderUIX, UIX extension point (see object editor for code)

Only for Version 1.0

  • edit /skins/flamingo/global.vm xwiki package file
    include these 5 lines just before foreach ( instruction:
## Include custom top panel menu
#if ($xcontext.user != 'XWiki.XWikiGuest' && $doc!="CustomExtension.TopPanelMenu.Content.WebHome") ## displayed only when a user is log on
  $xwiki.includeForm("CustomExtension.TopPanelMenu.Content.WebHome")
#end
##
 #foreach ($uix in $services.uix.getExtensions('org.xwiki.platform.template.header.after', {'sortByParameter': 'order'}))

Release Notes

v1.1.1

  • fix bug making the "home" link in domain bases sub wikis broken

v1.1

  • uses an UIX Extension and makes the patch to global.vm unnecessary
  • allows to reuse the navigation from the main wiki in a subwiki

Upgrading from 1.0

  • while upgrading via the Extension Manager it will tell you that it is going to remove the old version and install the new version. That is the expected behavior in this case. You can continue without having to worry that it will remove your menu entries.
  • if the upgrade process really asks you about to overwrite changes to any of the Tab-NN, Col-NN or Listitem-NN pages, choose to keep your own version. (The extension will still work afterwards, despite of what the selection in the upgrade process suggests.)
  • the upgrade process might finally ask you to delete an unused WebPreferences page. Usually the "right" solution should be preselected (i.e. remove it if it is unmodified, keep it if locally modified). If in doubt, keep the page.
  • please remove the patch for the file skins/flamingo/global.vm on the file system after the upgrade, or you will get the navigation displayed twice
  • if you have done customisations of the patch, like displaying the navigation to anonymous users, you will need to carry over these customizations to the wiki page .../view/CustomExtension/TopPanelMenu/AfterHeaderUIX - use the Object editor to modify the Executed Content section of the corresponding object of type XWiki.UIExtensionClass. (There should be only one of these objects.)
Tags:
    

Get Connected