Click the Add button and enter the label. The href and target fields are only required for leaf nodes. When you click ok it will be added to the bottom of the menu. You can then move the item into the desired position using the arrow buttons.
Select the item and click edit. You can edit the label, href and target fields. You can also set any style settings that you would like the item to have different from the general settings, for the types of values that can be entered into each field see Example style values table below.
Select the item and click delete.
Select the item you would like to move. Use the up and down arrow buttons to adjust the order it appears in the menu. Use the left and right arrows to adjust the level of the item.
Click the Properties button to open the Menu Properties editor.
There are four tabs named Main Container, Node, Sub Container and Leaf Node. The CSS settings with in each tab apply to the elements shown in the diagram below. For the types of values that can be entered into each field see Example style values table below.
CSS Property | Example Values |
---|---|
Border Width Margin Padding Width Height |
10px 10em 0.4em 10% (Not Border Width) auto (Width and Height only) |
Border Color Background Color Color |
blue #0000FF #00F rgb(0, 0, 255) rgb(0%, 0%, 0%) |
Border Style | none dotted dashed solid double groove ridge inset outset |
Background Image | url(images/background.png) |
Background Repeat | no-repeat repeat repeat-x repeat-y |
Z Index | 5 |
Icon Image Expanded Icon Image |
images/icon.png |
Font Family | Arial, Helvetica, sans-serif Times New Roman, Times, serif Courier New, Courier, mono Georgia, Times New Roman, Times, serif Verdana, Arial, Helvetica, sans-serif Geneva, Arial, Helvetica, sans-serif |
Font Size | 12pt 16px 0.8em |
Font Style | normal italic oblique |
Font Weight | normal bold bolder lighter |
Text Decoration | none underline |
Click the Save button and follow the instructions on the save window that pops up.
When you installed the menu into your web page you copied two script tags. Open your web page in a text editor and scroll down to where you pasted those script tags. To turn the editor off the second script tag's src attribute needs to be set to dmt.js and to turn it back on it needs to be set to dmt_editor.js
If you have a problem with the tree menu that you can not find an answer to in the documentation or if the documentation is unclear at any point then please send an email to support@dhtmlmedia.com