Crear una Plantilla Web

Una Plantilla és un document 'mestre' per definir d'una manera fàcil de la nostra Web. Anirem per parts per entendre'ns millor val?

Imaginem que estem creant el disseny d'una nova web, estem creant el primer document, el index.htm de la pàgina.

Tal com hem anat veient en els tutorials anteriors .. haurem inserit les taules, creant el disseny gràfic de la web, inserit els botons amb els seus corresponents efectes (botons, amb imatges de substitució) logo, imatge de títol, peu de pàgina, etc .. etc ..

En el head, hem inserit i als Metes i links que necessitem ... aquesta llest, per pujar al servidor i començar a crear després els següents documents com pàgines amigues, recursos, i totes aquelles opcions que tinguem pensat que necessitem.

Més o menys estarà així:

Veure Aquí

I clar, aquest serà el disseny de tota la web, o de la majoria de documents que anirem creant. Així que en comptes de guardar-lo com index, ho farem com a projecte, o disseny, (tant és fer servir la ñ doncs no el farem servir a la xarxa)

Jo ho guardés com proyectoweb.htm. Més tard ho deixi en una carpeta on tindré tots els documents originals, per si un dia passa alguna badada i he d'arreglar ;)

Amb aquest document obert anem a: Arxiu / Desar com a plantilla

1

Ens apareixerà un quadre de diàleg, on hem posar-li un nom per guardar:

2

Ens demanarà si volem actualitzar els vincles .. i li direm que si.

A la columna de la dreta, on veiem el Lloc amb les seves carpetes i documents, veurem que s'ha creat una nova carpeta, Templates, i dins aquesta la plantilla que acabem de crear. Veure que l'extensió és. DWT:

3

No treure les plantilles de la carpeta Templates ni guardar-hi fitxers que no siguin plantilles, és a dir res que no tingui l'extensió,. DWT. Tampoc hem de treure la carpeta Templates de la carpeta arrel local. (Carpeta del Lloc)

Si ho fem es produiran errors en les rutes de les plantilles i tota la feina haurà estat inútil. Ja hem creat la nostra primera plantilla. Però no hem acabat encara. Fins ara hem conservat l'estructura del portal amb tres cel · les:

5

Però si volem eliminar la columna de la dreta:

5

Quan la tinguem seleccionada, premem la fletxa Supr i la eliminem.

O bé ... veiem que caldria afegir una fila a la taula dels menús, com m'ha passat a mi se m'havia oblidat posar l'enllaç a Inici. Una forma d'afegir files i columnes és des Modificar:

6

I des d'aquí, podem afegir tant files com columnes, amunt o avall d'on tinguem el cursor del ratolí:

8

Una vegada que tinguem al nostre gust el document, seguim. Amb el cursor situat a la cel · la on aniran els continguts: Anar a Insereix / Objectes de Plantilla:

9

ens apareixerà una finestra per posar un nom a aquesta regió editable:

10

I en el document, veiem un requadre

11

Abans de guardar-la, podem ampliar el quadre de Continguts fins que cobreixi tot l'espai, mes que res per facilitar després el treball en inserir els continguts i fins i tot podríem esborrar el text:

11

Ara si ja acabem, guardarem la plantilla i la tanquem. Com ja he dit, ha d'estar a la carpeta Templates, que s'haurà creat en crear la plantilla, que en aquesta carpeta no ha d'haver cap altre tipus d'arxius, només si creem més plantilles per a aquest lloc, es guardaran allà.

Ara cada vegada que haguem de crear un nou document, per aquesta Web, ho farem sobre aquesta plantilla; Anar a Arxiu / Nou ...

12

I acceptem. Tindrem ara un nou document

14

A la part dreta superior, podem comprovar que estem usant la plantilla correcta:

14

I ja és hora de començar a crear el primer document, no es com ho fareu vosaltres, però amb l'enrenou que tinc al servidor mostrant exemples, estatuts, abans i després ... el millor és que creï una carpeta dins del lloc, per no trepitjar cap altre document que ja tingui creat. Crec una carpeta que es diu portal, dins d'ella, guardés tots els documents ja creats des de la plantilla del portal:

15

busco aquesta nova carpeta 'portal' i el guardo com index.

Ja hem fet el index. Després ho farem amb els altres, la pàgina d'amigues, per posar els banners dels nostres amics, les seves adreces, tutorials, etc, etc ...

Tots, amb el mateix procés: Nou de Plantilla per a 'El meu primer lloc' 'ejemplo_web' en el meu cas. O bé, guardant aquest mateix document, ja que encara no tenim contingut ... amb el nom corresponent fins acabar totes les opcions de menú. Per cert ... recordar si vau crear vincles en crear els botons, perquè funcionin bé, hem de guardar els documents amb els mateixos noms ;)

Si no els recordeu, un truc està en buscar en el codi ;)

I vau veure, tot el que abans tenia diferents colors, en el codi, ara, llevat de la zona o regió editable (Continguts) està d'un color gris, en vista disseny, si volem canviar una imatge .. el cursor es converteix en un signe de prohibit!! Tot està correcte així, tenim tot el disseny protegit ;)

Si mai, necessitem actualitzar un vincle, o canviar una imatge, afegir un enllaç, etc ... Anar a Arxiu / Obrir i buscar la carpeta Templates, o bé des del panell de la dreta

14

obrim la plantilla i modifiquem el que calgui, després la guardem, ens demanarà llavors si volem actualitzar tots els documents creats a partir d'ella:

18

Diem que si, ja que si tenim un altre disseny, amb altres continguts ... haurem fet una altra plantilla, ja que en un mateix lloc podem crear diverses plantilles. I només afectés al que hàgim modificat, evidentment no tocarem per res les regions editables amb els continguts o ens els cargaríamos també ... Es tracta només del que en els documents no podem modificar, tot allò que en els documents, no ens deixa i ens surt el signe de prohibit.

Podrem veure una finestra que en funció de la quantitat d'arxius que hi hagi al lloc anirà més o menys ràpid, al final apareixerà un diàleg que ens mostra el següent:

19

Si algun document no l'hagués actualitzat, ens ho diria. Tanquem i tot a punt! Usar les plantilles, ens estalviés un munt de treball, ja que només hem creat un sol document i sobre el, els altres, que en modificar la plantilla i actualitzar tots els altres ... és una feina que ens evitarem ...

I veureu que no és per gens difícil. Només una mica de pràctica ;)

I si a la primera no surt, val més que esborrem fins i tot la carpeta Templates, com el document el tindrem llest i guardat, començar de nou i segur que aquest cop si sortirà!

Veure ara el meu Portal Aquí

Crear ara la plantilla del vostre portal i crear les pàgines que desitgeu inserir en el, com pagines amigues, contacte, tutorials, etc, etc ... Recordeu que si en crear els botons quan vam fer la substitució d'imatges, vam posar ja el vincle a un títol , aquest ha de ser el mateix.

De no haver-los posat, també podeu crear-les, i vincular en l'Inspector de Propietats com amb un altre document o arxiu.

Respondre