Quick Tips: Criação e Utilização de Templates no Dreamweaver CS4 - Parte I

Nesta sequência de artigos  veremos como criar e trabalhar com um template para todas as outras páginas, ou seja, padronizando o nosso projeto com a herança visual do template. Para isso utilizaremos um projeto em HTML feito no Adobe Dreamweaver CS4, vale lembrar que a grande  maioria dos procedimentos aqui utilizados também se aplicam a outras versões do programa, com tênues mudanças, é claro.

Dentre as vantagens  em se trabalhar com templates vale destacar , sem dúvida alguma,  a economia de tempo que o desenvolvedor terá no projeto como um todo, pois, elementos  comuns como por exemplo : o título da página, menu principal, rodapé, e todo e qualquer elemento que se repita nas páginas seguintes serão criados uma única vez e herdados posteriormente com apenas alguns cliques.

Inicialmente, devem-se observar atentamente quais são, de fato, os elementos comuns às paginas, visto que, tais elementos, uma vez adicionados ao template, não são passíveis de edição nas páginas subsequentes, portanto, a colocação de anúncios, fotos e textos de conteúdo pode trazer complicações no desenvolvimento do seu projeto. Vale ressaltar que é sempre importante observar a organização do  seu projeto, se  está devidamente salvo e , é claro,  carregado na IDE do Dreamweaver.  

Rompida esta fase, vamos à confecção do template:

1-      Crie a sua página principal com os elementos devidos, vá no menu INSERT --> TEMPLATE OBJECTS  --> MAKE TEMPLATE

Na janela que se abrirá você deverá selecionar o site em que está trabalhando. Você pode ainda adicionar uma descrição ao template. Feito isso, clique em OK.

2-      Agora iremos definir a área editável da página, ou seja, a região passível de edição nas “páginas-filhas” do template, onde iremos adicionar o conteúdo específico de cada página.

Para isso, vá, novamente, no menu INSERT -->TEMPLATE OBJECTS  marcando agora a opção EDITABLE REGION . Você poderá definir então o nome da região  e em seguida ela será exibida na  tela.

 Salve o seu projeto. Você verá que na pasta de destino o Dreamweaver cria uma pasta TEMPLATES com o arquivo  “.dwt”,  onde você poderá ,futuramente, acessar o HTML que foi criado e gerar as páginas com  toda a herança visual.

Muito bem, já temos a nossa página principal pronta! Agora basta acessar o menu FILE --> NEW --> marcar a guia PAGE FROM TEMPLATES  e então selecionar o seu template. Pronto, você só terá que adicionar o conteúdo da pagina a ser criada, todo o restante já será pré-definido pelo Dreamweaver, poupando o seu precioso tempo.

Muito bem pessoal, fico por aqui neste primeiro artigo e espero que tenha sido útil a todos vocês. No próximo encontro aprenderemos um pouco mais sobre a personalização dinâmica da página.

Agradeço pela a atenção e espero por vocês em breve,  um grande abraço e bons estudos!

Jefferson Araújo

Contato: tecjefferson@hotmail.com.