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.