Estoy diseñando un página web, tengo mucho contenido y me gustaría crear distintas pestañas para organizar la información. Me han dicho que en Dreamweaver CS4 hay un widget con el que puedo hacer esto fácilmente. ¿Me podéis explicar cómo se haría? Muchas gracias por anticipado.
Vamos a ver un ejemplo de cómo crear un panel con fichas:
Creamos un nueva página html, escribimos el texto que contendrá y la guardamos.
Desde la categoría Spry del panel Insertar seleccionamos la opción Paneles en Fichas de Spry.
Automáticamente se crea un panel con dos fichas:
En la parte inferior de la ventana de trabajo vemos las propiedades del panel:
Podemos personalizar el nombre de cada ficha, añadir más fichas y escribir su contenido.
Ficha1 lo cambiamos por Cine, escribiendo este texto directamente en la página web, sobreescribiendo el texto.
Hacemos lo mismo con el contenido de la pestaña, cambiamos el texto Contenido1 por el texto que vamos a mostrar en la ficha.
Hacemos lo mismo con la ficha2, en nuestro ejemplo cambiamos su nombre por Teatro. Para ver el contenido de cada ficha pulsamos el icono del ojo.
Si necesitamos añadir una nueva ficha nos situamos en el panel,
Y accedemos al panel Propiedades. Para añadir una nueva ficha pulsamos el botón +.
Se crea la ficha3, seguimos los mismos pasos que hemos explicado antes para cambiar el nombre de la ficha y su contenido.
Podemos comprobar el comportamiento del panel desde la vista en vivo, novedad incluida en Dreamweaver CS4.
Al finalizar vemos que en nuestro sitio se ha creado un nueva carpeta SpryAssets con dos archivos, uno con extensión .css y otro con extensión .js
En Dreamweaver CS4 podemos trabajar con el framework de Spry, que es una biblioteca Javascript, con la que podemos crear páginas interactivas con un diseño más atractivo. Con Spry podemos utilizar CSS, HTML y código Javascript.
Vamos a ver un ejemplo de cómo crear un panel con fichas:
Creamos un nueva página html, escribimos el texto que contendrá y la guardamos.
Desde la categoría Spry del panel Insertar seleccionamos la opción Paneles en Fichas de Spry.
Automáticamente se crea un panel con dos fichas:
En la parte inferior de la ventana de trabajo vemos las propiedades del panel:
Podemos personalizar el nombre de cada ficha, añadir más fichas y escribir su contenido.
Ficha1 lo cambiamos por Cine, escribiendo este texto directamente en la página web, sobreescribiendo el texto.
Hacemos lo mismo con el contenido de la pestaña, cambiamos el texto Contenido1 por el texto que vamos a mostrar en la ficha.
Hacemos lo mismo con la ficha2, en nuestro ejemplo cambiamos su nombre por Teatro. Para ver el contenido de cada ficha pulsamos el icono del ojo.
Si necesitamos añadir una nueva ficha nos situamos en el panel,
Y accedemos al panel Propiedades. Para añadir una nueva ficha pulsamos el botón +.
Se crea la ficha3, seguimos los mismos pasos que hemos explicado antes para cambiar el nombre de la ficha y su contenido.
Al finalizar vemos que en nuestro sitio se ha creado un nueva carpeta SpryAssets con dos archivos, uno con extensión .css y otro con extensión .js
Redactado en: Dreamweaver CS4
1 comentarios:
Gracias, me ayudó mucho
Publicar un comentario