DWUG

En la segunda parte del tutorial, veremos d? debemos instalar los archivos y c?la galer?puede actualizarse una vez creada. Seguir leyendo

La extensi?Create Web Photo Album’ incluye una serie de plantillas
predise?s. En este art?lo iremos un poco m?lejos
y crearemos un album de fotos que se adapte a una de nuestras plantillas de Dreamweaver.
Y m?a?Las modificaciones posteriores en la plantilla afectar?a los documentos generados por la extensi?!–more–>

Las versiones 2.X de la extensi?Create Web Photo Album’ incluyen
una serie de plantillas predise?s. Sin embargo, presentan 2 carencias:

• Puede que ninguno de los dise?sea parecido al que estamos usando
  en nuestro sitio
• Los retoques posteriores exigen la modificaci?e todos los documentos
  uno a uno

Nuestro objetivo por tanto ser?

• Crear una plantilla personalizada, para que la extensi?enere una
  galer?con id?ico dise?l que estamos utilizando.
• Posibilidad
  de que, al editar la plantilla (*.dwt) que tenemos, toda la galer? reciba la modificaci?n cascada.

Comencemos:

El primer paso ser?rear una plantilla de Dreamweaver. Para simplificar
utilizaremos una sencilla, pero podemos crear una tan compleja como queramos
(plantillas anidadas, regiones condicionales…). El c?o de ejemplo
(b?co) de la plantilla es ?e:

aqui va la imagen

aqui van los datos de la imagen

aqui van los botones de navegacion

(Nota: Cuando uses plantillas, utilizar rutas relativas a la raiz del sitio
en lugar de relativas al documento evita muchos errores a la hora de vincular
archivos en los documentos basados en las mismas)

Analiz?olo, veremos 3 zonas editables (aparte de las habituales ‘doctitle’
y ‘head’): Hemos llamado a estas 3 zonas ‘imagen’, ‘datosImagen’ y
‘navegacion’:

Guardamos la plantilla como ‘galeria.dwt’ y abrimos un nuevo documento basado
en ella. Debemos modificar el contenido de las areas editables y reemplazar
el texto por defecto por unas etiquetas especiales:
‘doctitle’: : imagen

‘imagen’: “>
‘datosImagen’: alto:
ancho:
peso:

‘navegacion’:

El c?o resultante es ?e:

Estas etiquetas pueden parecer extra? pero tienen su explicaci?br />

Tras ser llamado, Fireworks devuelve, adem?de las modificaciones de
la imagen, diferentes datos sobre la misma (medidas, peso, nombre, metadata…);
a ellos debemos a?r otros gestionados por Dreamweaver (n?o
de im?nes, imagen actual y titulo de la galer? por ejemplo).

¿
C?maneja Dreamweaver estos datos? Utiliza expresiones regulares (Regexps)
para sustituir en su plantilla determinadas etiquetas por los valores obtenidos
al ejecutar la extensi?Por ello, cada etiqueta tiene un significado:

LISTADO DE ETIQUETAS UTILIZABLES:
reemplazada por una tabla de thumbnails de
la galeria.

reemplazada por el titulo de la galeria.
reemplazada por el nombre de la imagen.

reemplazada por los enlaces para navegar de una imagen
a otra.
reemplazada por el n?o de orden
de la imagen

reemplazada por metadata obtenida de la imagen
reemplazada por la altura de la imagen
reemplazada por el ancho de la imagen

reemplazada por el peso de la imagen
reemplazada por la fecha de creaci?e la imagen

Resumiendo: Escribiremos cada etiqueta donde queramos que Dreamweaver
incluya su valor resultante.

Una vez a?do el nuevo contenido guardamos el documento como ‘template.html’ (importante: debe ser este nombre y no otro.)

Para crear el documento que muestre los thumbnails los pasos son casi id?icos:

1. Crear un documento basado en la plantilla.
2. Las areas editables quedar?asi:
   ‘doctitle’:
   ‘imagen’:

   ‘datosImagen’: (vac?
   ‘navegaci? (vac?

3. Guardar como ‘template-thumbnail.html’

Para terminar, si queremos utilizar botones en vez de texto para la navegaci? crearemos 4 im?nes:

• first.gif
• previous.gif
• next.jpg
• last.jpg

Ya tenemos todo lo b?co:

• 2 archivos html:
  template.html y
  template-thumbnail.html (opcional)
• 4 im?nes (opcionales):
  first.gif,
  previous.gif,
  next.gif,
  last.gif

Es decir: S?el archivo ‘template.html’ es obligatorio, todo lo dem? es opcional.

En el siguiente cap?lo, veremos d? debemos instalar estos archivos para
poder
ser utilizados.

Con la ayuda del objeto Pluma y el uso de m?aras, el recorte de objetos es una tarea sencilla Seguir leyendo

La aparici?e Macromedia Contribute 3 en espa?abre nuevas
posibilidades para la publicaci?n la web. Este libro muestra todo lo
que el usuario de Dreamweaver MX 2004 debe saber para construir websites compatibles
con Contribute. Seguir leyendo

Encontrar la respuesta correcta ya no requiere b?edas largas y complicadas Seguir leyendo

En algunas ocasiones, Dreamweaver aparentemente reemplaza comillas dobles por comillas simples en vista c?o. Sin embargo no es un error de la aplicaci?–more–>

Problema: En algunas ocasiones, al utilizar comillas dobles en nuestro c?o, Dreamweaver las ‘reemplaza’ por comillas simples:

Explicaci?/strong> no se trata de un problema de Dreamweaver, sino de la opci?learType de Windows XP, que representa en ocasiones de forma incorrecta determinados caracteres de algunas fuentes (Especialmente Courier New). Las comillas son dobles, pero en pantalla, por culpa de este problema, se ven como comillas simples.