UPDATE: 18 November 2023
This update includes changes to the desktop Main Menu > Sub Menu.
Before the update, the Sub Menu would display a button that matched the Main Menu button after the update, the Sub Menu button can now display a node image and text. The button can be the same size as the original version, or its height can be changed by X 2.
Version functionality is still managed via the Edit Skin Configuration window.
Output Tour below…
Version: Menu Images x1 & x2
#1. Menu with 4 Categories
#2. Mouse over Mandalay to reveal 2 Sub Categories (normal size)
#3. Mouse over Mandalay to reveal 2 Sub Categories (x2 size)
#4. Mouse over to hightlight a Sub Category and click to open the node
#5. Sub Category open to first image and thumbnails revealed
#6. Mouse over the thumbnail to show the tooltip and mouse click to open the node. The close button hides the thumbnails until a new Sub Category is selected from the Menu
Setting up the Main Image Menu
Category Buttons
To start setting up the “image menu”, specific tags must be created.
For instance, in example #1 above, there are four categories: Mandalay, Mandalay to Mingun, Mingun and Yangon.
In the Tour Browser, four nodes have individual tags starting with “th” for thumbnail they are thmandalay, thmanming, thmingun and thyangon. Filtering by using the “thmandalay” tag we can see there are two nodes with this tag.
#7. Two nodes with the tag “thmandalay”
In the Edit Skin Configuration > Menu Table > Main Image Menu the tag is assigned a Title “Mandalay” and will become the first Category Button.
#8. Edit Skin Configuration - Main Tables > Main Image Menu showing 4 Menu Categories
When there is a Mouse Over event on the “Mandalay” button the Sub Category menu will display the two nodes with the tag “thmandalay”.
#9. Mouse over Mandalay button
Sub Category Buttons
As shown above (#9) the two sub category button images have titles, “Streets of Mandalay” and “Mahar Thakya Thiha”. These titles are sourced from the nodes Properties - User Data from the data in the “Author” text field via the Placeholder $(ua)
#10 Properties - User Data for the thumbnail node
Note: In addition to the “thmandalay” tag there is another tag “Pagoda”. This tag is applied to all nodes that belong in the location Mahar Thakya Thiha and will be used to filter the nodes that appear in the thumbnails.
#11, All nodes with the tag “Pagoda”
Open Node and Display Thumbnails
Clicking on either sub-category image button will close the sub-category menu, change the node, and display (the default view) the first node in the Tour Browser associated with the Location group (Pagoda).
#12 First node of the Location group (Pagoda)
At the same time, the Thumbnail Menu and Node Title are displayed. The thumbnails displayed are based on the filter entry in the Description text field $(ud) and the node title from the entry in the Title text field $(ut).
#13 Node Title and Thumbnail filter
Lastly when you Mouse Over a thumbnail image the title of the node appears above it. This title is sourced from the entry in the Information text field via the placeholder $(ui).
#14: Title of the node
