templates/ modelos templates são documentos que podem ser usados como um modelo para outras...

Download Templates/ Modelos Templates são documentos que podem ser usados como um modelo para outras páginas com o mesmo lay-out, ou seja, é uma espécie de frame

If you can't read please download the document

Upload: internet

Post on 17-Apr-2015

110 views

Category:

Documents


3 download

TRANSCRIPT

  • Slide 1
  • Templates/ Modelos Templates so documentos que podem ser usados como um modelo para outras pginas com o mesmo lay-out, ou seja, uma espcie de frame que no separa as pginas e sim as puxa de um s documento.
  • Slide 2
  • Abra um novo arquivo no Dreamweave e construa as tabelas, como no modelo abaixo, utilizando-se da opo Layout View.
  • Slide 3 SAVE AS TEMPLATE. Na opo "Site", escolha o site que voc programou como no nosso exemplo. No campo "Save As" digite">
  • Salvando Template Salve por FILE>SAVE AS TEMPLATE. Na opo "Site", escolha o site que voc programou como no nosso exemplo. No campo "Save As" digite o nome do arquivo. Observao: O Dreamweaver salva templates com a extenso.dwt sempre em uma pasta "Templates" na raiz da pasta onde voc definiu o site. Nunca delete a pasta Templates pois todo o modelo se encontra l. Com o arquivo salvo, vamos trabalhar nas reas editveis.
  • Slide 4
  • reas editveis - O que so reas editveis??? So reas que voc define no modelo que podero ser modificadas em cada HTML, ou seja, elas no ficam fixas em todas as pginas.
  • Slide 5 TEMPLATES>NEW EDITABLE REGION ou pela. Uma nova janela abrir. Digite o nome para ela. No ex"> TEMPLATES>NEW EDITABLE REGION ou pela. Uma nova janela abrir. Digite o nome para ela. No exemplo, o nome Menu"."> TEMPLATES>NEW EDITABLE REGION ou pela. Uma nova janela abrir. Digite o nome para ela. No ex" title="Grife o texto "Texto para ser trocado", v no menu MODIFY>TEMPLATES>NEW EDITABLE REGION ou pela. Uma nova janela abrir. Digite o nome para ela. No ex">
  • Grife o texto "Texto para ser trocado", v no menu MODIFY>TEMPLATES>NEW EDITABLE REGION ou pela. Uma nova janela abrir. Digite o nome para ela. No exemplo, o nome Menu".
  • Slide 6
  • Slide 7
  • Slide 8
  • Usando o Template Agora vamos utilizar o modelo para gerar um arquivo HTML. Com o Dreamweaver aberto, v em FILE>NEW FROM TEMPLATE. Na janela que abrir, selecione o nome do site que voc definiu e tambm o nome do template abaixo. Uma nova pgina se abrir com o modelo. Note que agora, existe uma "borda" creme na tela indicando que voc est usando o Template. * Repare que o cursor do mouse muda quando voc o passa sobre uma rea que no editvel, fica tipo com um smbolo de "Pare". Nas demarcaes azuis, voc poder editar porque elas foram previamente definidas como zonas editveis. Agora salve normalmente seu arquivo como html ou htm... Ao abrir, voc ver o lay-out perfeitamente, pois, ao gerar o html, o Dreamweaver pega as informaes do Modelo e as projeta no arquivo.htm ou.html.
  • Slide 9
  • Editando o Template V ao menu Modify > Templates> Open Attached Templates. A partir do painel Templates: Faa as modificaes necessrias e salve. Em seguida,atualize as pginas para usar o novo template: V para menu Modify > Templates > Updates page.
  • Slide 10
  • Efeitos no Menu - Behaviors Behaviors ou comportamento so cdigos que combinam um evento e uma ao por parte de um usurio. Para adicionar um Behavior, selecione o objeto que deseja aplicar e v para o menu Windows > Behavior. Abre-se a seguinte janela:
  • Slide 11
  • Selecione o primeiro item do menu e abra a janela Behaviors. Selecione a opo: Set Navigation Bar Image
  • Slide 12
  • Slide 13
  • Janela Pop - Up Em Behavior selecione Open Browser Window
  • Slide 14