Criar o Design de um WebSite é uma das melhores partes de um Projeto Web. O problema é quando você tem que implementar mudanças em seu maravilhoso Design. Imagine que seu projeto tenha ao todo 150 páginas , quanto tempo demoraria para atualizar os 150 arquivos ? Com o auxilio das Templates (Modelos) , você usará poucos minutos.

Depois que uma nova página é criada a partir de um Template, o novo documento continua anexado ao modelo original, ao menos que seja especificamente separado ou desanexado. Se você alterar o Template original, todos os documentos criados a partir dele são atualizados automaticamente.

Ao se criar um template , toda a página é bloqueada. Seções bloqueadas de um Template não podem ser alteradas em um documento variado desse Template. É fundamental ao se criar um Template , definir um tipo de Região que pode ser alterada. Abaixo as Regiões possíveis de um Template:

Regiões Editáveis - área e todo o código, pode ser alterada (área de conteúdo) ;
Atributos Editáveis - dentro de uma tag bloqueada, você pode determinar certos atributos para se tornarem editáveis ;
Regiões Opcionais - conteúdo pode ou não ser exibido ;
Regiões de Repetição - certasáreas de um objeto bloqueado (tabela por exemplo) podem ser repetidas em um documento derivado de um Template.

Todas as Regiões precisam ser definidas no Template.

Criando Templates

Aconselho a você quando for criar seus Templates , seguir essas etapas:
1° etapa - finalize uma única página que contenha todos os elementos que você quer incluir no Template ;
2° etapa - utilize marcadores onde for possível (texto ou imagem). Eles o lembrarão quais elementos devem incluídos ;
3° etapa - finalize e insira o máximo que puder seu Template. Por exemplo, se em todas sua páginas um rodapé estará presente , termine-o ;
4° etapa - inclua informações <meta>. Os Sites de pesquisa usam as tags <metas> para fazer um levantamento do conteúdo de sua página.

Você pode criar seus Templates, indo em Menu Arquivo > Salvar como Modelo. O DW então cria uma pasta denominada Templates e o arquivo com a extensão ".dwt'.

Veja o exemplo do site da Macromedia:

Imagem do IPB

Note que temos 4 áreas distintas no Site: Menu , Flash , Conteúdo e Lateral.
Vejamos agora o esboço dessa página:



Ao converter nosso esboço em um template , todas as áreas são bloqueadas. Temos então que criar nossas Regiões Editáveis. Em nosso exemplo teremos duas Regiões Editáveis: Conteúdo e Lateral. para determinar uma Região Editável:

1. selecione o texto, objeto ou área na página que deseja converter em uma região editável ;
2. escolha Menu Insert > Template Objects > Editable Region

Imagem do IPB
figura 02

o DW exibe a caixa de mensagem "New Editable Region" , nomei-e sua região. O DW destaca a seleção criada.

Imagem do IPB
figura 03

Você pode criar uma Região Editável e após editá-la , torná-la uma Região Bloqueada. Para tal , coloque o cursor na Região Editável que deseja bloquear , vá no Menu Modify > Templates > Remove Template Markup.

Agora que já aprendemos como criar nossas áreas editáveis , vamos aprender a incluir conteúdo nas mesmas. Você deve ir no Menu File > New > Aba Templates ,

Imagem do IPB
figura 04

Em "Templates for:" escolha o site que esta trabalhando no momento , ao lado determine a sua Template (modelo) e em Preview veja sua Template. Clique em "Create" para criar um novo arquivo que poderá ser editado (em suas Regiões Editáveis). Salve-o com o nome que desejar. Se quiser manter o vínculo com a Template , deixe marcado a opção: "Update page when template changes". Note que nesse novo arquivo criado , as regiões Bloqueadas não podem ser editadas.

Você pode editar seus Templates também pelo botão "Templates" na barra Objects Common.

Imagem do IPB
figura 05

Em novas matérias , abordarei recursos mais avançados de uma Template , tais como: Criando e configurando atributos editáveis , explorando e modificando regiões de repetição etc... , mais isso é assunto para outras matérias.

Você gostou? Comente no fórum!

Comentários:

Olhos Espanhois disse:

Eu estaba lendo mas ajudaria se pudem arrumar as fotos pra que eu posso visualizar melhor

Ver o restante dos comentários no fórum (e aproveitar pra comentar também !).

Mais recentes em HTML e Editores Visuais

Remover quebras de linha de um código-fonte
Por Manito - Juntar todo código em uma linha!...
O que são tags?
Por Raphael Leão - O que são tags? - tags são os comandos do html. um...
Guia prático de html 2007 (atualizado e revisado)
Por Tiago Souza - Aborda html, xhtml, css, padrões web, web standards, dicas, etc...
Tabela de acentos e caracteres especiais
Por marcinha - Entities e ascii em html...
Elementos e atributos html em desuso segundo w3c
Por luishenrique - <style type="text/css"> - table.elementos,...

Ver mais Artigos de HTML e Editores Visuais.

Ver e retirar outras dúvidas no fórum Webly.

Alguns Direitos Reservados | RSS | O Fórum

Webly Portal e Fóruns - Internet + Humana | Design by ArthurHenrique.com