The website provides various menus to assist visitors in navigating around the site. Managing these menus is one of the most complex aspects of maintaining the site, so these guidance notes are necessarily quite detailed. Because of the complexity, the task of menu management has been reserved for Site Administrators.

Design

A menu is a list of links to pages on the website. Three types of menu are provided (see examples below):

  • A Section Menu which allows a visitor to navigate instantly to any of the top-level sections into which the website is divided (Village Maps, Events & Venues etc.). This is displayed on every page on the site;
  • A Local Menu which allows a visitor to navigate to other pages with content closely related to the page currently being viewed; the Local Menu displayed is therefore context dependent – when looking at a Biodiversity page it will list Biodiversity pages and when looking at a Living in Sutton Poyntz page it will list other Living in Sutton Poyntz pages;
  • A Site Map which can be accessed quickly from any page, and provides a list of all pages in the website.

For the Section Menu and Local Menu there are two flavours of the menu, depending on whether the website is being viewed in a narrow or wide window. In a narrow window (or narrow device), both menus are displayed as drop-down lists at the top of the screen; when clicked or hovered on, a single level of page links opens up. In a wide screen, the Section Menu displays down the left side of the screen, and the Local Menu displays across the top of the screen; both menus expand when an item is clicked or hovered on to display a second lower level of page links.


Menus in wide screen

Menus in narrow screen

Site map

Local menu compression

It was thought helpful to compress some of the Local Menus, when compared with the full menu in the Site Map. This compression is done in two ways, both of which are illustrated in the example illustrated to the right:

  • Firstly, the Local Menus sometimes need shorter names for links, for example “Scarecrow Competition” has had to be abbreviated to “Scarecrow Comp.” to fit the space available;
  • Secondly we have sometimes found it convenient to concatenate levels of the hierarchy in the Local Menu, for example the pages below “Scarecrow Competition”, which have full names in the Site Map such as “Scarecrows in 2010”, have been put in the same level, with abbreviated names such as “- - 2010”.

The effect of this will be seen further on; it means effectively that two lists of page links are required, one uncompressed for the Site Map and one compressed for the Local Menus.

Implementation

The details of what page links are included in the displayed menus therefore depend both on what page is currently being viewed and on the width of the device or window. An added complexity is the need, just described, for two set of page links. These are the factors that make the implementation of these page links quite complex.

The mechanism needs knowledge of three factors:

  • When a particular menu should be displayed (i.e. on what pages the menu is needed);
  • Where a menu should be displayed (i.e. the position on the screen); and
  • What the menu should contain (i.e. what page links should be displayed).

In addition, there is the question of How the menu should be displayed (i.e. how it should be formatted on the screen), but that is controlled by the Template, so is outside the scope of this part of the tutorial.

The mechanism that Joomla provides uses three types of data structure to manage all this:

  • Positions – These are logical locations within the window where menus are displayed, and are defined permanently in the site Template. Seven positions are defined:
    • Two positions for the Section Menu - main-menu, which puts the Section Menu on the left side of wide screens, and main-menu-sm at the top for narrow screens;
    • Two positions for the Local Menu - top-menu which puts the Local Menu at the top of wide screens, and sub-menu-sm which puts the Local Menu at the top right for narrow screens; and
    • Three positions (sitemapmain, sitemapacknowedgements and sitemapguidance) for the Site Map - these display page lists for the main site, for some Acknowledgement pages, and for the Guidance pages;
  • Joomla menus – These contain the actual lists of page links, arranged as logical hierarchies, sometimes with a level zero header which is not displayed, then a number of level 1 links, each with level 2 links below (and sometimes with yet more levels below that). The name Joomla actually uses for these is just "Menus", but that term can cause confusion with the menus actually displayed on the screen, so we will use the term Joomla menu;. At present, there are quite a large number of Joomla menus, but the intention is that there will eventually only be six:
    • Main Menu - the list of main website pages, as displayed on the Site Map and the Section Menu;
    • Main Menu compressed - a second list of main website pages, with page titles compressed where necessary and with some reductions in the depth of the page hierarchy; this is used to generate the Local Menus;
    • Acknowledgements Menu - a list, only displayed on the Site Map, of a few pages in the Acknowledgements section;
    • Admin Menu - a list of a small number of pages (such as Contact Us and Error 404) which are not actually listed anywhere in the site;
    • Guidance for Authors Menu - the list of Guidance for Authors pages, as displayed on the Site Map;
    • Guidance Menu compressed - a second list of Guidance pages, with some titles and nesting compressed.
  • Modules – These are what link the when, the where, and the what described above; a Module links a Joomla Menu (in whole or just a selected part) with a Position, and also lists the pages on which this Module is active (i.e will be displayed). The Joomla Menu defines the what, the Position defines the where, and the list of pages defines the when.The Modules divide into a few groups:
    • One Module, Extended Menu, links the Joomla Menu Main Menu to the Position main-menu in order to display the Section Menu for wide screens;
    • One Module, Compressed Menu, links the Joomla Menu Main Menu to the Position main-menu-sm in order to display the Section Menu for narrow screens;
    • Three Modules are used to create the Site Map lists; Main Menu for Sitemap (which links Main Menu to sitemapmain), Acknowledgements Menu for Sitemap (which links Acknowledgements Menu to sitemapacknowledgements), and Guidance Menu for Sitemap (which links Guidance for Authors Menu to sitemapguidance);
    • Quite large number of Modules are needed to generate the Local Menus for wide screens, corresponding to the different logical groups of pages. Note however that no webpage displays more than one of these Modules;
    • An even larger number of Modules are needed to generate the Local Menus for narrow screens. Because these narrow screen menus do not expand, it is often necessary to display more than one such Module on a web page, as in the example illustrated to the right.

An example may perhaps help. A Module called Village maps topmenu associates levels 1 and 2 of the Joomla menu Main menu compressed with the Position top-menu; this Module is defined to be active for all pages in the Village Maps section.


Local Menu for Village Maps (with the Getting Around sub-section expanded)

Managing the menus

When a new webpage is created, we need to do two things:

  • Firstly, to add the new page to the appropriate Joomla Menus so that the a link to the page can be displayed in the menus shown on other pages; and
  • Secondly to decide what Local Menu(s) should be displayed on the new page itself.

To add the new page to the menus, its logical position in the site hierarchy first needs to be decided. The page needs to be added at the appropriate place in the appropriate Joomla menus: the Main Menu and Main Menu compressed (if it is one of the main website pages), the Acknowledgements Menu (if it belongs to that small group of pages), or to the Guidance for Authors Menu and the Guidance Menu compressed (if it is a Guidance page). This on its own is sufficient to ensure that the new page is displayed in the appropriate part of the Site Map, and also (if appropriate) in the Section Menu. It is often sufficient to ensure that the new page is displayed in appropriate Local Menus, but there are cases where more work needs to be done.

This can happen when the new page creates either a new branch in the page tree, or an extra level in the page tree. Under those circumstances it is sometimes necessary to create one or two new Local Menu Modules, for wide and/or narrow screens, in order to display links to the new page in pages that are logically related. It is not easy to give clear guidance about when this might be necessary, and just how the new Module should be structured; the best thing is to see what happens without a new Module, and if this does not work well to look for an appropriate solution.

So that the new page itself displays an appropriate Local Menu, one or more Module will need to be edited, adding the new page to the list of pages on which that Module is displayed.

An example

The best way of illustrting the process is probably by means of an example. This example is taken from the Village Events sub-section of the Events & Venues section of the website, and considers what needed to be done when the Scarecrow Competition page was divided to create a number of sub-pages for various years of the Competition. Before this, the nearby contents of the Main Menu was as follows:

  • Events & Venues
    • Village calendar
      • Using the calendar
    • Weekly events
    • Village events
      • Scarecrow competition
      • Plant sale
      • Cream Teas
      • Barbecue
      • ...
    • News
      • ...
    • Street Fayre ...

(To be completed ...)

Detailed guidance

The task of managing menus is fairly complex, and has been reserved to System Administrators. If as an author you want a new page added to the appropriate menus (or want a new menu to be created), please contact one of the Administrators. The following Guidance pages are intended to assist Administrators in doing this:

  • Joomla Menus. The most common operation will be to add a new page to these menus, but it will sometimes be wished to change the logical order of pages or to delete a page.
  • Modules: From time to time, when the logical hierarchy of pages in the website becomes more complex, it becomes necessary to create a new Module in order to display a new Local Menu for one or both of wide and narrow windows.