Páginas web 
- Instalación y ejecución de DHTML Menu
- Crear el menú de navegación
- Exportar el código javascript del menú
- Integrar el menú en las páginas HTML
PDF
Crear el menú de navegación
1. Abre DHTML Menu.
2. En la pestaña Menu Designer (Diseñador del Menú) vamos a crear la estructura del menú. En este caso vamos a crear un árbol con esta estructura:
Capítulo 1 (sin enlace)
- Texto: Página 1. Enlace: pagina0101.html
- Texto: Página 2. Enlace: pagina0102.html
Capítulo 2 (sin enlace)
- Texto: Página 1. Enlace: pagina0201.html
- Texto: Página 2. Enlace: pagina0202.html
- Texto: Página 3. Enlace: pagina0203.html
- Texto: Página 4. Enlace: pagina0204.html
Capítulo 3 (sin enlace)
- Texto: Página 1. Enlace: pagina0301.html
- Texto: Página 2. Enlace: pagina0302.html
3. Pulsa en el botón Add Root Item (Añadir Elemento Raíz) e introduce como “Capítulo 1” como Text (Texto) y borra el contenido de la casilla Link.
4. Repite el paso 3 para crear otros dos elementos raíz más: Capítulo 2 y Capítulo 3.
5. Clic en la entrada Capítulo 1 del arbol de menú Your Menu (Tu Menú) para seleccionarlo.
6. A continuación pulsa en el botón Add Sub Item (Añadir Sub Elemento). Introduce “Página 1” en el cuadro Text (Texto) y como “pagina0101.html” en Link (Enlace).
7. Como ahora tenemos seleccionado el elemento Página 1 ahora pulsamos en el botón Add Sibling (Añadir hermano) para crear otro elemento al mismo nivel. En este caso el texto es “Página 2” y el enlace “pagina0102.html”.
8. Repite el paso 7 para crear otro elemento con texto “Página 3” y enlace “pagina0103.html”.
9. Selecciona la entrada Capítulo 2 y pulsa en el botón Add Sub Item (Añadir Sub Elemento) para crear un elemento de texto “Página 1” y enlace “pagina0201.html”.
10. Repite el paso 7 para crear …
- Texto: “Página 2”. Enlace: “pagina0202.html”
- Texto: “Página 3”. Enlace: “pagina0203.html”
- Texto: “Página 4”. Enlace: “pagina0204.html”
11. Repite el paso 10 y 11 para crear las entradas correspondientes del Capítulo 3:
- Texto: “Página 1”. Enlace: “pagina0301.html”
- Texto: “Página 2”. Enlace: “pagina0302.html”
12. El árbol resultante del menú se puede ver en el cuadro Your Menu (Tu Menú).
13. Clic en la pestaña Menu Colors (Colores del Menú).
14. En este panel puede configurar el color de fondo, de la fuente y del borde de los botones del menú principal (Main Menu Colors) y de los submenús (Sub Menu Colors).
15. Clic en la pestaña Options (Opciones).
16. En el panel Options se pueden configurar múltiples detalles del menú. Los más importantes son:
- Menu Type (Tipo de Menú): Horizontal o Vertical. En este caso vamos a seleccionar Horizontal.
- SubMenus UnFold On (Activación del despliegue de los submenús): OnMouseOver o OnClick. Permite definir el evento de usuario que desplegará un submenú: OnMouserOver – cuando el usuario sitúe el puntero del ratón sobre la opción de menú – o bien OnClick – sólo cuando pulse sobre él. En este caso dejamos la opción por defecto: OnMouserOver.
- Menu Item Font (Fuente del Elemento de Menú). Permite definir la fuente, tamaño y efectos (negrita/cursiva) del texto que se mostrará en los botones del menú. En este caso dejamos las opciones por defecto.
- Menu Arrows (Flechas de Menú). Selecciona la opción No Arrows (Sin flechas).
17. Si deseas ver el aspecto que tendrá tu menú pulsa en el botón Preview (Vista previa).
18. Para guardar las opciones de configuración del menú y poder editarlas en otro momento es conveniente pulsar en el botón Save Menu … (Guardar Menu)
19. En el cuadro de diálogo Guardar como introduce el nombre del archivo. Por ejemplo mimenu.mnu. La extensión de archivo *.mnu es específica de Menu Builder.
20. Si cierras Menu Builder y lo vuelves a abrir se puede recuperar la configuración definida utilizando el botón Open Menu … (Abrir Menu).