En

este tema vamos a ver qu son las plantillas, cmo crearlas y cmo basar documentos en ellas. 11.1. Introduccin Cada vez que deseamos crear un sitio web, tenemos que tener muy en cuenta que las pginas deben seguir un formato uniforme. Adems del formato, es frecuente tener elementos que se repiten en cada pgina, como el logo o el men. La mayora de nosotros solemos hacer copias de los documentos ya creados, y trabajar sobre estas copias, modificando simplemente su contenido. Esta es la forma ms sencilla de tener pginas con una estructura basada en la estructura de otras ya creadas previamente. Las plantillas son una especie de copia de la pgina en la que van a estar basadas el resto de pginas del sitio web, pero que incluyen la posibilidad de establecer unas zonas editables y otras zonas que sern fijas, que no podrn ser modificadas. No es posible modificar las propiedades de una pgina que est basada en una plantilla, a excepcin del ttulo. Cuando se desea que existan pginas con, por ejemplo, diferente color de fondo, es necesario crear plantillas diferentes con los distintos colores, y basar las pginas en una u otra plantilla, segn el color de fondo que se desee para cada una. Cuando se modifica el diseo de una plantilla, se pueden actualizar todas las pginas basadas en ella. Esto nos puede ahorrar mucho trabajo. Las plantillas son archivos con la extensin DWT que se guardan en el sitio web, dentro de una carpeta llamada Templates. Por supuesto, las plantillas las podremos usar siempre que sigamos trabajando con Dreamweaver. 11.2. Crear plantillas Las plantillas pueden crearse desde cero, o a partir de una pgina ya existente. Una forma de crear una plantilla desde cero es a travs del panel Archivos, que se puede abrir a travs del men Ventana, opcin Activos.

Unidad 11. Las plantillas

Una vez abierto el panel hay que seleccionar el botn plantillas.

, para poder trabajar con las

Los botones inferiores del panel Activos son similares a los del panel Estilos CSS. El nico botn diferente es el primero, que en este caso sirve para actualizar la lista, el resto permiten crear una nueva plantilla, editar una plantilla seleccionada en la lista, o eliminarla. Para crear una nueva plantilla hay que pulsar sobre el botn . Si el botn est desactivado, pulsa con el botn derecho del ratn sobre el rea de plantilla y elige Nueva Plantilla). Cuando se pulsa ese botn aparece un nuevo documento en la lista de plantillas, al que es posible cambiarle el Nombre pulsando previamente sobre l. Para modificar una plantilla la seleccionamos de la lista y pulsamos el botn . Para eliminar una plantilla la seleccionamos de la lista y pulsamos el botn . Las plantillas se guardan en el sitio web actual, dentro de la carpeta Templates, que se crea automticamente. Para crear una plantilla a partir de un archivo existente es necesario abrir dicho archivo, y despus guardarlo como plantilla a travs del men Archivo, opcin Guardar como plantilla. En ella es necesario especificar el nombre con el que va a ser guardada la plantilla, a travs del campo Guardar como, y elegir, de entre la lista de sitios, el Sitio: en el que se va a guardar.

Al guardar la plantilla la pgina cambia de carpeta, a Templates, como ya hemos dicho. Si contena enlaces o imgenes se nos ofrecer la opcin de Actualizar vnculos. Si lo hacemos, la plantilla se ver con normalidad y podremos emplearla para crear pginas en cualquier carpeta. Si no lo hacemos, la plantilla se mostrar sin las imgenes u hojas de estilo, ya que la ruta no ser la correcta, y slo nos servir para crear pginas en la misma carpeta que el archivo desde el que creamos la plantilla. Ahora solo nos quedara cambiar los elementos variables por regiones editables. 11.3. Establecer regiones editables en una plantilla Todos los elementos de una plantilla estn bloqueados por defecto, no se pueden modificar. Es necesario establecer las zonas para que puedan ser editadas en las pginas que se basen en dicha plantilla. Para editar una plantilla hay que abrirla en Dreamweaver. Una forma de abrirla es a travs del panel Activos, pulsando dos veces sobre ella, o estando seleccionada pulsando sobre el botn como ya hemos visto. Una vez abierta la plantilla es posible establecer sus propiedades a travs de la ventana Propiedades de la pgina. Como recordars, para abrir esta ventana puedes: Pulsar la combinacin de teclas Ctrl + J. Hacer clic sobre el men Modificar y elegir la opcin Propiedades de la pgina. Pulsar con el botn derecho sobre el documento abierto en Dreamweaver, y en el men contextual que aparece seleccionar la opcin Propiedades de la pgina. Para insertar una regin editable hay que situar el puntero en el lugar en el que se desea insertar, y despus dirigirse al men Insertar, Objetos de plantilla, opcin Regin editable, o pulsar la combinacin de teclas Ctrl + Alt + V. En la nueva ventana hay que establecer un Nombre para la regin editable. Dentro de la plantilla no pueden existir dos regiones editables con el mismo nombre. Posteriormente puede modificarse el nombre a travs del inspector de propiedades de la regin editable.

Las zonas editables aparecen representadas en Dreamweaver como un recuadro con una etiqueta de color turquesa. En la etiqueta aparece el nombre de la zona editable. Dentro del recuadro es posible insertar objetos, que aparecern por defecto en aquellos documentos que se basen en la plantilla. Estos objetos, al estar dentro de la zona editable, podrn ser modificados en las pginas. La regin editable se ajustar al tamao del contenido. Por lo que aunque parezca pequea cuando an no tiene nada no limitar lo que queramos introducir. Todos los objetos que se encuentren fuera de estas zonas editables aparecern tambin en las pginas, pero no podrn ser modificados. En este caso, la imagen con el logotipo de aulaClic aparecera en todas las pginas que se basaran en esta plantilla, mientras que todo lo que insertramos dentro de la zona editableFormularioCorreoElectronico podra ser modificado.

11.4. Basar pginas en una plantilla La opcin ms simple, consiste en elegir una Pgina de plantilla al crear un Nuevo documento.

Como vemos en la imagen anterior, al seleccionar la categora Pgina de plantilla, aparece un listado con los sitios. Seleccionando el que queramos, aparecer otro listado con las plantillas del sitio, y una vista previa de la seleccionada a la derecha. Bastara con seleccionar la que queramos utilizar y pulsar en Crear. El nuevo documento estar basado en la plantilla, y solo tendremos que modificar las regiones editables. El uso de las plantillas puede resultar un poco ms complicado si queremos aplicar la plantilla sobre un documento existente. Vamos a ver cmo basar una pgina vaca en una plantilla, ya que por el hecho de estar vaca resulta ms sencillo.

Una vez abierto el documento, hay que dirigirse al men Modificar, Plantillas, opcin Aplicar plantilla a pgina.

Es preferible que antes de hacer esto nos aseguremos de que el sitio que se encuentra abierto en Dreamweaver es el mismo en el que vamos a guardar el documento, y el mismo en el que se encuentra la plantilla en la que queremos basarlo. Despus de pulsar sobre la opcin Aplicar plantilla a pgina aparece una ventana como la siguiente, en la que hay que seleccionar una de las plantillas de la lista Plantillas: del sitio.

Es recomendable activar la casilla Actualizar pgina cuando cambie la plantilla, para que la pgina se actualice automticamente en el caso de modificar la plantilla en la que se basa. A pesar de estar trabajando sobre un documento vaco, es posible que al aplicar la plantilla aparezcan nombres de regiones no coincidentes entre el documento en blanco y la plantilla. En ese caso se muestra una ventana como la siguiente.

En ella hay que establecer una correspondencia entre el nombre de la regin del documento vaco con el nombre de alguna regin de la plantilla. En este ejemplo, la regin del documento vaco que no coincida con el nombre de ninguna regin de la plantilla era la regin Document body. A travs de Mover contenido a la nueva regin: se puede seleccionar una regin de la plantilla, para establecer as la correspondencia que se necesitaba.

Despus de establecer las correspondencias necesarias, se carga la plantilla en el documento vaco.

Observa que la pgina aparece enmarcada en amarillo, y en la esquina superior derecha nos informa de que se emplea la plantilla ejemplo. En este caso no es posible cambiar el color de fondo, que est definido en la plantilla, pero s es posible cambiar todos los elementos de texto y el formulario, ya que se encuentran dentro de una zona definida en la plantilla como editable. S se podra cambiar el estilo del texto, insertar ms elementos de formulario, tablas, etc. Para que una pgina deje de estar basada en una plantilla hay que dirigirse al men Modificar, Plantillas, opcin Separar de plantilla. Cuando se separa una pgina de una plantilla, el contenido de la pgina sigue siendo el mismo que el que tena cuando an estaba basada en la plantilla, pero sin las restricciones establecidas por la plantilla, ni las ventajas al editar la plantilla original.