Comprender las rutas en plantillas de Dreamweaver

Plantillas Dreamweaver
Cuando una página HTML se guarda como plantilla, Dreamweaver crea una carpeta de plantillas al nivel de la carpeta de raíz local y se genera un archivo .dwt que se convierte en el origen para todas las páginas a las que se aplican. Cada vez que una página HTML se aplica a una plantilla, (Archivo > nuevo desde plantilla o Modificar > Plantilla > aplicar plantilla a página) esta crea un vínculo relativo a la raíz del sitio en el archivo .dwt. La razón por la que este vínculo relativo a la raíz del sitio siempre se utilizará correctamente es porque el archivo .dwt siempre estará en la carpeta Plantillas en la raíz de la estructura de la carpeta del sitio. Si el archivo .dwt se mueve desde la carpeta Plantillas, o si se mueve o cambia el nombre de la carpeta Plantillas, los vínculos se romperán. Es muy importante mantener el archivo .dwt en la carpeta Plantillas del directorio en que Dreamweaver lo crea. Para evitar confusiones, es recomendable NO guardar otros elementos de su sitio (los archivos de origen de imagen o documentos HTML) en la carpeta Plantillas.

¿Qué páginas están vinculados a los archivos de plantilla?
Cuando un archivo se aplica a una página existente o se crea uno nuevo a partir de una plantilla, se inserta el código siguiente en el origen:

<!— # BeginTemplate “/Templates/templateName.dwt” —>

Para visualizar la fuente HTML que Dreamweaver crea, elija Ventana > HTML.

La ruta anterior sustituye el código fuente HTML normal que aparecerá en una página nueva. En lugar de iniciar con las etiquetas habituales que el nuevo archivo genera, se especifica que existe un nivel dentro de la carpeta raíz local, en una carpeta denominada Plantillas, un archivo .dwt que contiene toda la información que no está dentro de las regiones editables de la página. Esta ruta envía al navegador a buscar en la ubicación adecuada el archivo que le proporcionará las propiedades de página, el diseño y los gráficos; todo el contenido que exista únicamente en el archivo .dwt. Esta es la razón por la cual los cambios fuera de las regiones editables de una página se deben realizar directamente en el archivo .dwt. Cuando se abre y revisa el propio archivo .dwt todas las páginas aplicadas a la plantilla se vinculan al archivo en la misma ubicación que antes. Todas las páginas aplicadas a la plantilla se actualizan automáticamente con la nueva información.

Relativos al documento vs. relativos a la raíz del sitio
La ruta que vincula una página HTML en una plantilla es una ruta relativa a la raíz del sitio. Se denomina relativo a la raíz del sitio, ya que comenzará en el nivel superior de la estructura de directorio (la carpeta raíz local) y luego sigue con la siguiente carpeta debajo (plantillas) y finalmente se vincula al archivo .dwt. Dreamweaver crea automáticamente una ruta relativa a la raíz del sitio a las plantillas de la carpeta Plantillas, ya que sabe exactamente dónde se ubicará la plantilla, independientemente de otras carpetas de archivos están en la estructura del sitio.

Relativo al documento crea una ruta específica de un archivo en otro. En lugar de comenzar desde el nivel superior (raíz del sitio) de la estructura de u carpeta de archivos, genera una ruta que comienza en un archivo, pasa por las carpetas de archivos (directorios) necesarias y se detiene en la ubicación del otro archivo. Es obligatorio que ambos archivos se guarden en la carpeta raíz local ANTES de crear un vínculo relativo al documento de una a otra.

Si desea poder ver las páginas en un navegador localmente, antes de haber cargado los archivos en un servidor remoto, ellos deben ser relativos al documento. Tanto los navegadores de internet Explorer como Netscape no tienen forma de entender qué carpeta de raíz local (como lo hace Dreamweaver) se ha definido, de modo que solo puede realizar el seguimiento de una ruta relativa al documento que está visualizando en ese momento. Debido a que la mayoría de los usuarios prefieren visualizar sus páginas localmente en un navegador antes de cargarlos, Dreamweaver omite ser relativo al documento siempre que esté vinculado un archivo o que se inserte una imagen. Si el archivo no se ha guardado nunca ANTES de intentar insertar una imagen o un vínculo a otra página HTML, Dreamweaver no tiene datos de referencia para la ubicación de la página actual, por lo tanto, se generará una ruta que luzca similar a esto:

file:///HardDrive/Desktop Folder/localRootFolder/subfolder/subfolder/images/content.htm

o

file:///C:/Desktop/localRootFolder/subfolder/subfolder/images/content.htm

Estas rutas son específicas de la estación de trabajo de SOLAMENTE y no funcionarán al cargar archivos en un servidor remoto.

El gráfico de abajo proporciona una explicación del gráfico de la diferencia entre relativos al documento y relativos a la raíz del sitio. En el ejemplo que se muestra a continuación, la página bio.htm tiene un gráfico denominado logo.jpg insertado en ella mediante el uso de opciones de ruta alternativas.

 

Rutas relativas al documento en la plantilla

Insertar imágenes y vínculos en el archivo.dwt directamente puede resultar muy confuso. Recuerde al trabajar en el archivo .dwt que los vínculos que se creen como relativos al documento serán exactamente eso: relativos al archivo .dwt. La ruta que se genera es específica de dicha página HTML o del origen de la imagen al archivo .dwt. Dreamweaver mantiene un registro de las páginas a las que se hace referencia que se aplica a la plantilla en directo y que ajusta automáticamente la ruta de acceso al archivo HTML al que se hace referencia para que sean correctos para la página actual. En el código fuente HTML tanto para el .dwt como para una página aplicada a la plantilla, las rutas serán distintas, y de así debe ser. Si Dreamweaver no ajustó automáticamente la ruta de la ubicación específica de cada página, la ruta de acceso relativa se rompería en todos los archivos, excepto para el archivo .dwt.

A continuación se muestra un ejemplo de la forma en que Dreamweaver podría ajustar su ruta de acceso relativa al documento:

La ruta original de la plantilla en el gráfico:

../graphics/images/banner.gif

La ruta ajustada en la página aplicada a la plantilla:

../../graphics/images/banner.gif

Dreamweaver no ajusta las rutas relativas a la raíz del sitio o absolutas (http://) de las plantillas a las páginas que se aplican a la plantilla, ya que no es necesario revisarlas.

Rutas de acceso relativas a documentos en las páginas que se aplican a la plantilla

Insertar imágenes y vínculos dentro de la región editable de la página vinculada a una plantilla funciona exactamente igual que insertar imágenes o vínculos de una página que no está asociada a una plantilla. Si se sigue el procedimiento de seleccionar archivo > nuevo de plantilla y, a continuación, archivo > guardar (para elegir una ubicación dentro de la carpeta raíz local) ANTES de que cree los vínculos con otras páginas o imágenes, Dreamweaver sustituirá el documento por el del relativo tanto en Seleccionar página HTML como en Seleccionar cuadros de diálogo de origen de imagen. Mientras que el menú emergente “relativo a” no se cambie manualmente a seleccionar raíz del Sitio, las imágenes y los vínculos estarán disponibles cuando usted obtenga una vista previa de su trabajo en el navegador de forma local.

Rutas relativas a la raíz del sitio en la plantilla

Cuando trabaje en un archivo de plantilla para crear vínculos a otras páginas o para hacer referencia al origen de imagen de gráficos, el menú emergente en seleccionar archivo HTML y en Seleccionar los cuadros de diálogo del origen de imagen le permiten elegir entre relativos al documento y relativos a la raíz del sitio. Tal y como se muestra en el gráfico anterior, la selección de La raíz del sitio crea una ruta desde la carpeta raíz local directamente hacia el archivo que se está seleccionado, independiente del archivo .dwt abierto actualmente en Dreamweaver. Uso los vínculos relativos a la raíz del sitio puede ser beneficioso cuando sea probable que el contenido en la estructura de directorios del sitio se mueva dentro de la carpeta raíz local, debido a que el vínculo permanecerá intacto aunque los archivos se muevan desde su posición original.

La ruta original de la plantilla en el gráfico:

/graphics/images/banner.gif

La ruta de la página aplicada a la plantilla:

/graphics/images/banner.gif

Dreamweaver no ajusta las rutas relativas a la raíz del sitio o absolutas (http://) de las plantillas a las páginas que se aplican a la plantilla, ya que no es necesario revisarlas. La ubicación del documento (ya sea el archivo.dwt o un archivo HTML asociado con la plantilla) es irrelevante para la ruta relativa a la raíz del sitio.

Rutas relativas a la raíz del sitio en las páginas que se aplican a la plantilla
Usar vínculos relativos a la raíz del sitio puede ser útil si el sitio es complejo, requiere un equipo de desarrolladores que trabajan juntos, o tiene una estructura de directorios del sitio que sea revisada de forma regular. Para crear un vínculo relativo al sitio, simplemente seleccione Raíz del sitio del menú emergente situado junto a las palabras “relativo a” que se encuentra en Seleccionar origen de imagen y Seleccionar cuadros de diálogo de archivo HTML.

Dado que la ruta creada comenzará a partir de la carpeta raíz local, con cualquier número de subcarpetas, y en última instancia el final de la página o la imagen a la que está vinculada, se le permite a los desarrolladores la flexibilidad de mover las páginas o los recursos de una o varias subcarpetas en la estructura de directorios del sitio sin romper los vínculos. Por ejemplo, en el gráfico anterior, si se trasladara el archivo logo.jpg desde la carpeta imágenes a la carpeta de las funciones y el vínculo fuera un vínculo relativo a la raíz del sitio, el navegador aún no tendrá ningún problema para encontrar el gráfico. Si la ruta es un vínculo relativo al documento, tanto el archivo logo.jpg como el bio.htm DEBERÁ permanecer en la estructura de la carpeta en la que vivieron cuando se creó la ruta relativa al documento. Mover cualquier archivo después de crear la ruta dará como resultado que la ruta esté dañada.

Como se mencionó anteriormente, solo los vínculos relativos al documento se pueden previsualizar localmente en el navegador. Si decide utilizar vínculos relativos a la raíz del sitio, solo hay dos formas de ver las páginas en el navegador.

La primera es cargar (colocar) los archivos en el servidor remoto y, a continuación, utilizar el navegador para ir a la página al escribir la ruta absoluta en el campo de búsqueda en el campo del localizador de URL. Con este método, se ven las páginas del mismo modo en que los demás las verán en la web. Para realizarle revisiones a las páginas, abra la copia local de los archivos, realice cambios y guarde las páginas HTML, conecte con el servidor ftp y “coloque” los nuevos archivos en el servidor remoto. Los archivos con el mismo nombre en la misma carpeta sobrescribirán las versiones anteriores del archivo en el servidor remoto.

La segunda forma de ver vínculos relativos al sitio en el navegador es utilizar un servidor web personal. Solo en Windows, esta opción se puede definir al ir a Dreamweaver mediante archivo > vista Previa en el navegador > editar lista de navegadores y previsualizar selección mediante el servidor local. La definición de esta opción le permitirá que Dreamweaver previsualice documentos mediante un servidor web personal.

Nota:Para Macintosh, un servidor web personal se establece a nivel de sistema. Compruebe los documentos del sistema para obtener más ayuda.

 

Obtén ayuda de forma más rápida y sencilla

¿Nuevo usuario?