Tutoriales y Photoshop

¿Cómo crear un menú desplegable en Dreamweaver?, para el curso de paginas web, recientemente publiqué un tutorial relacionado en el que te explicaba como crear un sencillo menú de navegación, al mismo le hice algunas modificaciones y corregimos lo de la imagen divisoria de fondo directamente en el css. En esta ocasión vamos a ver como crear un menú desplegable directamente con Dreamweaver CS4, utilizando la función SPY (Barra de Menús Spry), no omito manifestar que es un tutorial muy sencillo de seguir.

1. En dreamweaver Haz clic en la pestaña SRY.

2. Haz clic en Barra de Menús SPRY.

3. Dreamweaver te mandará a guardar el archivo (si aun no lo has hecho).

4. Luego de guardar la pagina web selecciona el tipo de menu a crear, Dreamweaver te rpesenta dos opciones y para efectos del tutorial seleccionaremos “Horizontal”.

5. Al presionar Aceptar, puedes ver como se ha insertado el Menu en la vista de Diseño de Dreamweaver.

6. Además, el panel de propiedades ha cambiado, si presionas la pestaña azul (imagen del punto 4), podrás personalizar los elementos del Menú desplegable, esta pantalla está dividida en 5 columnas, la primera corresponde al nombre del Spry (puedes dejarlo igual), las columnas 2, 3 y 4 corresponden a los distintos niveles del menú desplegable, y en la columna 5 es donde escribes los textos que aparecerán visibles para el usuario, el vínculo / titulo y destino del enlace. (Para comprender el destino del enlace te recomiendo ver como crear vinculos)

7. Si das clic a la columna 3 verás como en la columna 5 el campo texto te muestra el valor de ese campo específico, aquí es donde vas a cambiar esos valores para que el menú deplegable muestre toda tu información.

Dreamweaver te manda la advertencia que agregará a la raiz de tu sitio los archivos que ves en la imagen, además agregará una carpeta llamada “SpryAssets” que deberás subir al servidor junto con el archivo si quieres que funcione el menú desplegable en internet.

El menú ya está listo, pero ahora vamos a personalizarlo, para ello te recomiendo leer el tutorial oficial en el sitio de adobe, en este sitio encontrarás todas las instrucciones del CSS con su respectiva explicación.

Esta es solo una forma de hacer menús desplegables, de hecho es la forma más sencilla, la idea del curso de paginas web es darte a conocer las distintas alternativas que tienes para realizar una misma acción.

Además puedes descargar el archivo del tutorial desde mediafire.