7/26/2019 Hacer una plantilla

1/4

DREAMWEAVER

Clase I: En esta clase aprenderemos a configurar un sitio local, pero antesdefinamos qu es un sitio web: Es un conjunto de archivos y carpetas, relacionadosentre s, con un diseo similar y un objetivo comn

!rear un sitio consiste en crear una carpeta en el disco local "os do# cumentos$%&", se guardar'n dentro de esta carpeta, mientras que las im'genes, lasanimaciones, las hojas de estilo se crear'n en nue# vas carpetas dentro de laprimera

(espus se podr'n copiar los archivos en un servidor web )sitio remoto*, lo queequivale a publicar el sitio"a p'gina inicial se debe guardar con el nombre inde+htm o in# de+html

En la actividad que debes desarrollar crearemos una p'gina web llamada

currculumvitae-

Crea en el disco local una carpeta con el nombre currculum vitae, y dentrode sta crea otra con el nombre imgenes. Copia el archivo foto.JPEG en lacarpeta imgenes y currculo.doc en la carpeta currculum vitae.

.na ve/ creada las carpetas que formar'n el sitio local, definimos el sitio en(reamweaver

Para ello ha clic en !itio " #uevo !itio $ %vanadas&efinir

0 #ombre del sitio' C())*C(+

0 Carpeta ra local -ha clic en el icono con forma de carpeta yselecciona la carpeta currculum vitae

0 Carpeta predeterminada de imgenes -carpeta imagenes

1ceptar

"a primer p'gina la guardamos con el nombre index.html2ara agregar nuevas p'ginas, ubcate en el nombre del 3itio, bot4n derecho 56uevo archivo 5 escribir el nombre sin borrar la e+tensi4n $%&"

7/26/2019 Hacer una plantilla

2/4

Crear las siguientes pginas' Perfil, E/periencia +aboral, Estudio,Computaci0n, Cursos, hobbies, idioma.

!omo en todas las p'ginas debemos insertar una tabla de 7 filas y 8 columnas,aprenderemos a crear una plantilla 9p'gina especial en la cual se crea la tablapedida, se crear'n los hipervnculos a las dem's p'ginas, y se configurar' unaregi4n 9egi4n editable; para agregar el contenido correspondiente a cada p'gina

"a guardamos como plantilla 9(reamweaver le agregar' la e+tensi4n dwt; "uegovincu# laremos la plantilla a cada p'gina

2ara ello ha/ clic en Archivo > Nuevo > Plantilla !M".2ara insertar la tabla Insertar > !a#la5 7 filas y 8 columnas 5 ancho de la tabla:7< porcentajes

!ombinaremos las celdas de la segunda columna, 2ara ello: !elecciona las celdasde la segunda columna, ha clic en Com1 binar celdas.

En las celdas de la primer columna escribe los nombres de ca1da pgina creada' inde/, Perfil, Estudios,2

$ipervnculos: "os hipervnculos son enlaces que al hacer clic en ellos nos lleva aotra p'gina o archivo

=nsertaremos hipervnculos a las p'ginas creadas- para ello:

$elecciona el texto INDE%& ha' clic en el icono& en la ventana(ro(iedades& con )orma de car(eta *ue se encuentra a la de+ recha delcuadro de texto v,nculo& ha' clic en la (-ina Index.html > Ace(tar.Reali'a el mismo (rocedimiento (ara insertar hi(erv,nculos a las restantes(-inas.

&odificaremos el color de fondo de la p'gina, para ello:.bica el cursor en un lugar libre de la p'gina, ha/ clic en 2ropiedades de la p'gina,

en la ventana propiedades, selecciona el color >cccc??&odificamos, ahora, el color de fondo de la tabla, para ello, seleccio# namos latabla, esto lo podemos hacer ubicando el cursor en alguna celda, clic en Modi)icar

7/26/2019 Hacer una plantilla

3/4

5

> !a#la > $eleccionar !a#la

$elecciona como color de )ondo /00cc11& 2 como color de #orde /001100 3Modi)icar(reviamente el tama4o de #orde a 56

2or ltimo, ubicamos el cursor en la segunda columna para crear una regi4neditable, que contendr' el contenido variable de cada p'gina

a' clic en Insertar > 7#8etos de Plantilla >Rei9n edita#le& en la

ventana *ue se a#re as,nale el nom#re contenido;.

.na ve/ lista la plantilla la debemos guardar dando el nombre, por ejemplo,

7/26/2019 Hacer una plantilla

4/4

plantilladwt 9"as plantillas tienen la e+tensi4n dwt y al crearlas se creaautom'ticamente la carpeta %emplates;

"uego debemos vincular la plantilla a cada p'gina, para ello:

Nos u#icamos en cada (-ina& clic en Modi)icar >Plantilla > A(licar (lantillaa la (-ina& seleccionar la (lantilla 2 listo.

.na ve/ guardados todos los cambios, con la tecla