Implementation advice
Changing primary navigation pop up menu width
Unlike the script used prior to CUE Template 2.0, the pop up menus will not grow in width to accommodate menu items. Rather, the menu items will wrap. It is therefore likely one of the first things you will want to do is adjust the pop up menu widths. This also provides a simple introduction to generating CSS from the configuration file.
The optimal width for each pop up menu may well be different as the menu items will of course differ. To set individual pop up menu widths you can assign a style to the relevant UL element. Give the UL element an id and then assign a width to that id in your style sheet.
Example:
<ul id="firstsubmenu">in your html; and
#firstsubmenu { width: 7em; }
in your style sheet.
To adjust the default width for all menus you edit udm-custom.js and then use this to generate new styles for udm-style.css.
Step 1: consult udm-custom-with-comments.js to determine the relevant value to edit. The width of the menus is determined by the sixth element in the um.menus array. It is set to 4.75em by default.
Step 2: Edit this value within the udm-custom.js file.
Step 3: When you have made the change and saved udm-custom.js, open css-generator.html in a browser. Click the "Generate CSS" button. Your new CSS will appear in the main output window.
Step 4: Copy and paste the generated CSS into the udm-style.css file below the /*Generated CSS - do not edit this directly*/ comment.
Note that css-generator.html uses udm.custom.js, udm-control.js and udm-style.js. If you move any of these files css-generator.html will not work unless you update the paths in it's source.