A la darrera classe del Taller web vam aprendre a fer finestres emergents o “pop up’s” de dos tipus diferents amb les imatges.

- Finestra “pop up” amb unes mesures determinades: Obrim una nova pàgina .htm al Dreamweaver i col·loquem una imatge gran (320×480) amb marges 0 (modificar>propietats de la pàgina).  Llavors en una altra pàgina  posem una imatge més petita i a la part inferior, al vincle posem un marcador (#). Anem a la barra superior Finestra> comportaments> seleccionar imatge> signe “+”> obrir finestra del navegador> examinar> seleccionar pàgina amb la fotografia gran (en aquest cas “popup.htm”) i indicar les mesures corresponents (ample i alt de la finestra) i posem el nom genèric de la pàgina (ex: caricatura).  També ens indica si volem seleccionar alguna característica de la finestra (canvi de tamany, barra de menú, d’ubicació o de navegació). A “comportaments” surt “OnLoad” i despleguem la llista i marquem “<A>on click”, això serà el que dispari el pop up.

- Finestra “pop up” que es tanca si la cliques: Seguim els passos anteriors, però al vincle, en comptes de posar el marcador, hem d’escriure javascript:window.close(); Guardem i fem F12 a la pàgina.

També ens van ensenyar a fer mapes d’imatge que és quan una mateixa imatge té diferents enllaços que van a diversos llocs:

- Primer, posar una imatge a la pàgina del Dreamweaver, seleccionar-la i prémer un dels botons de la part inferior del disseny, depenent el que vulguem (seleccionar un quadrat, un cercle o una forma irregular). Llavors quedarà marcada en color blau la zona de link escollida dins de la imatge.

I a més a més, sabem tots els secrets de les plantilles. Generalment a tots els sites hi ha parts que són comunes a totes les pàgines del lloc (logotip, menú, banner, copyright…), sent només una part la que canvia.

- A l’hora de definir plantilles, només podrem canviar el contingut a les pàgines, mentre que la plantilla es mantindrà a totes elles (cal seleccionar l’opció d’actualitzar i així els canvis fets a la plantilla s’aplicaran a totes les pàgines quie utilitzin aquesta plantilla).

- Les plantilles les hem de guardar com a arxius de plantilla (.dwt – dreamweaver template). A les zones que volguem editar posteriorment (és a dir que siguin contingut) seleccionem amb el botó dret> plantilla> regió editable> nom (titular o contingut)> guardar.

- Per obrir una pàgina de la plantilla, fer arxiu nou> pestanya de plantilla> seleccionar la plantilla correscsponent. A partir d’aquí anar creant pàgines (guardar com a .htm) amb el contingut divers. Si volem linkar, s’ha de fer a la plantilla (està al directori “templates”) i enllaçar amb la pàgina corresponent, després actualitzar, i comprovar que funcioni bé amb l’F12.

I ara, les properes dues classes seran per fer la pràctica final: fer el web de l’hotel Miramar de Badalona, ens donaran la plantilla i haurem d’anar creant els continguts i posar en pràctica tot el que hem après! Molta sort!!

M@rt@