For menus that do not need a dropdown and have all pages nested under the same parent, please use Subnav Simple (Version 1) - Shortcodes
For a group of resources or links that will only appear on one page, please use a Multi-Link Panel.
This advanced subnav has the advantages of a dropdown system and can add external site links but is limited to two subnav menus per website.
Design Options
It is recommended to use this subnav in the right hand side of the page and limit the menu width to 1/3 the width of the page.
For this block type, there are 3 primary designs,
1. Panel Outline
This option has a black outline around the subnav
2. Panel (Basic)
This option has a tan background color
2. No wrapper
This option has neither a background color or border
Create/Update a Menu
This feature utilized the menu system in WordPress. This can also be referenced in WordPress documentation of the menu system.
1. Click the Customize button on the admin bar. (If you do not see this, it is because you need to contact a member of the digital experience team or webteam@uthscsa.edu to update the menu.)
2. Next click Menus
3. In this example, we already have 1 subnav created as seen below. To create a new menu, click the Create New Menu button.
4. Label the menu and add an appropriate title. By default, this title name will appear on the subnav but can be overwritten or hidden for through the block type settings. Once the Menu name is filled out, check the box for the open menu location you would like to use. Please note that if a subnav is already being used, it will show the subnav name to the right of the checkbox as seen underlined below. Make sure to use the empty subnav menu location or delete the previous subnav. Lastly, click Next
Adding Internal Links to the Menu
1. To add content to the menu, click on the pages tab to see all pages in WordPress or use the search feature to find content on a larger site.
Adding External Links to the Menu
1.To add links that do not exist on the site, use the Custom Links tab
Creating Drop-down menu items
1.To create a drop down menu, use the Custom Links tab and set the URL to #. Setting the URL to # will prevent the dropdown item from down to a page and will be used to toggle the dropdown instead.
2. Next, drag the items in the appropraite order. Menu items that appear tabbed will be drop down enable and should only go 2 levels deep.
Changing menu Item titles
By default, all menu items will update when the page title is updated. In some cases, the page title is too long and something shorter may be needed to manually change the menu title.
1. To update the title of a menu item, click the page arrow toggle on the item that needs to be updated. Then update the text on the navigation label.
Block Type Usage
One the menu has been created, you can add the block type to a page and select the menu number you assigned in the block type.
Shortcode attributes
These shortcode attributes that can be used to customize the feature.
- menu_callback - This tells what menu is being loaded onto the page.
- Options (Must be one of the following)
- uth_primary_subnav : This is the first menu you should use for subnav's
- uth_secondary_subnav : This is the second menu you should use for subnav's
- Default: uth_primary_subnav - the level will only need to be overwritten on the parent page (home) of the subsite
Example of shortcode usage (With Screenshots)
Example URL: https://lsom.uthscsa.edu/pediatrics/education/residency/
This is a screenshot example of the subnav with an expanded dropdown option. The following code is used in a text block to generate the menu.
[UTH_subnav_v2]
Alternatively, you can use this code to load the second subnav on a page.
[UTH_subnav_v2 menu_callback="uth_secondary_subnav"]
Limitations
- Menu items can only be updated by the webteam@uthscsa.edu or a member of the digial experience team.
- There can only be 15 advanced subnavs per site.