comparte el articulo 

Creación de plantillas con Adobe Dreamweaver CS4 (segunda parte)

Actualizado el 18/08/2010 < > 0 Comentarios

Resumen: Creación de regiones repetidas, regiones opcionales y plantillas anidadas, opciones que facilitan y agilizan el trabajo de los diseñadores de páginas web.

En la primera parte de este artículo hemos visto que las plantillas de Adobe Dreamweaver CS4 pueden dividirse en regiones, las cuales pueden ser de cuatro tipos diferentes de acuerdo con la posibilidad de edición que ofrecen. Además, hemos visto la creación de regiones editables y su funcionamiento.

Regiones repetidas

Las regiones repetidas son aquellas que pueden ser utilizadas en forma reiterada dentro de una plantilla. Esto quiere decir que, si tenemos una región que utilizaremos en otras partes de la plantilla, podremos definirla como región repetida y duplicarla en el lugar que la necesitemos, ahorrando un tiempo considerable en la creación de regiones que ya fueron diseñadas.

Este tipo de elementos fue pensado (como casi todo Dreamweaver) para su utilización en maquetación  con tablas, aunque también admite otros tipos de elementos. Hay dos tipos de regiones repetidas: las regiones repetidas propiamente dichas y las tablas repetidas.

Otra característica importante de las regiones repetidas es que no necesariamente tienen por que ser editables. Sin embargo, lo más frecuente es que necesitemos que algunas partes de las regiones repetidas sean editables mientras que otras permanezcan bloqueadas. Esto es posible, ya que dentro de las regiones repetidas es posible establecer regiones editables.

Teniendo en cuenta sus características (posibilidad de duplicarse y de inserción de regiones editables), podría decirse que se trata de plantillas dentro de la plantilla.

Creación de regiones repetidas

Al igual que en el caso de las regiones editables, la selección de la región a convertir debe realizarse en la vista de diseño, por lo que todos los pasos que daremos en adelante se harán en esta vista.

En primer lugar, se debe señalar la región que utilizaremos como región repetida dentro del diseño que ya se encuentre desarrollado. Puede tratarse de un texto, una lista, títulos, imágenes o una combinación de elementos.

Luego podremos optar, al igual que en el caso de las regiones editables, por hacer clic con el botón derecho del ratón sobre la región señalada y hacer clic sobre “Plantillas / Nueva región repetida”, con lo que se abrirá un pequeño cuadro en el que deberemos introducir el nombre que le daremos a esta región para luego poder identificarla.

Creación de regiones con Adobe Dreamweaver CS4
En la vista de diseño aparecerán las regiones repetidas rodeadas de un borde celeste con una etiqueta en la que puede leerse el nombre de la región. Es importante aclarar que solo se pueden introducir letras (mayúsculas o minúsculas) y números en la formación de un nombre de región.

Título de región editable con Dreamweaver CS4

Tablas repetidas

Dentro de las posibilidades de establecer regiones repetidas, se encuentra la opción de crear tablas con filas repetidas. Al igual que en el caso de las regiones repetidas propiamente dichas, se puede optar por hacer que algunas celdas sean editables, mientras que el resto permanece bloqueado.

Para crear una tabla repetida, se pueden utilizar los mismos procedimientos que se emplean en la creación de regiones repetidas, seleccionando la opción correspondiente a las tablas. En el cuadro que se abre, deberemos definir el número de filas y columnas que tendrá la tabla, además de las características de las mismas (ancho, altura, bordes, colores, etc.), además de definir el nombre de la tabla repetida.

Tabla repetida con Dreamweaver CS4

La tabla creada de esta forma, puede ser parcialmente repetida, ya que la región repetida puede establecerse en este mismo cuadro, estableciéndose las filas inicial y final de la parte repetida de la tabla.
El color de fondo de las celdas y filas puede editarse para que se muestre con colores diferentes cuando la tabla repetida se inserta en un punto cualquiera del diseño. Para ello, bastará con editar el código en la vista de código, para lo cual se deben tener algunos conocimientos de HTML.

Regiones opcionales

La utilización de regiones opcionales es bastante más compleja, ya que incluye opciones de programación. Las regiones opcionales se establecen cuando se desea que las mismas se muestren u oculten ante determinadas circunstancias, por lo que se deben establecer algunos elementos condicionales (if, else), típicos de los lenguajes de programación.

Esto quiere decir que cuando nos encontramos diseñando, podremos definir algunos parámetros que harán que la región se muestre o permanezca oculta. Cuando más de una región opcional se vincula a un determinado parámetro, la modificación de éste puede hacer que el conjunto de regiones se muestren o se oculten.

Las regiones opcionales pueden ser de dos tipos: editables y no editables. Cuando se establece una región opcional no editables, se permite a los usuarios de la plantilla modificar los parámetros que hacen que ésta permanezca oculta o sea visible, pero sin poder editar su contenido. En las regiones opcionales editables, el usuario puede, adicionalmente, editar el contenido de dicha región.

Establecer regiones opcionales

El procedimiento para crear regiones opcionales es igual a los casos anteriores. En este caso, el cuadro que se abre cuenta con dos pestañas, que vemos en la imagen siguiente:

Regiones opcionales con Dreamweaver

Como puede verse en la parte inferior de la imagen, en la pestaña correspondiente a las opciones avanzadas pueden introducirse las variables según las cuales se visualizará  o no la región establecida.

Tanto cuando se emplea el menú desplegable del botón derecho del ratón como yendo a través del menú Insertar, pueden verse las dos opciones posibles para el establecimiento de una región opcional. Si se establece simplemente “Región opcional”, ésta no será editable, ya que para ello puede verse más abajo el ítem correspondiente a las regiones opcionales editables.

Plantillas anidadas

En ciertas ocasiones, es posible que la utilización de plantillas no sea suficiente para colaborar en el diseño de una página web, como en el caso de páginas dentro de un mismo diseño, que requieren ciertos cambios respecto de la plantilla para que su visualización sea correcta.

Para ello, Dreamweaver CS4 presenta la opción de crear una nueva plantilla basada en la plantilla original, por lo que ambas plantillas se encontrarán vinculadas entre si, aunque su utilización en el diseño de una página web sea independiente.

Las regiones editables de la plantilla original se pasarán como tales a la plantilla anidada. Todos los cambios que se realicen en la plantilla original, se actualizan automáticamente en las plantillas anidadas.

Luego de creada la plantilla anidada, la misma puede ser modificada en todo aquello que se crea conveniente. Todo aquello que permanezca sin modificaciones, será actualizado desde la plantilla original cuando se edite la misma.

Creación de una plantilla anidada

Para crear una plantilla anidada, se debe crear un documento a partir de la plantilla que será base del diseño. Para ello, se debe ir a “Nuevo” del menú principal. Cuando se abre el cuadro correspondiente, se debe seleccionar “Página de plantilla”, tras lo cual se debe seleccionar la plantilla que será base.

Luego de realizadas las modificaciones que se entiendan necesarias, se utiliza “Guardar como plantilla”. Una vez guardado el documento, se actualizan los vínculos con el diseño original, del mismo modo que lo hace cuando se abre.

Publicado el 18/08/2010, última actualización 18/08/2010.

Licencia: Contenido exclusivo de LaWebera.es. Prohibida su copia.

Autor: Andrés Fernández

URL: LaWebera.es :: Diseño Web

(Subir al texto)

Añadir Comentario

* Campos obligatorios

Meneame Bitacoras