Primeiramente, porque usar templates???
Bem é muito simples, imagine um Site na seguinte estrutura, 5 páginas, sendo uma home e 4 páginas de conteúdo, o layout do site é o seguinte:
Quando o site está protinho vem o cliente e fala assim "Tem como você colocar mais uma página.", ai você fala que sim, com raiva do cliente que não tinha te avisado dessa página antes, e parte para fazer a alteração, como proceder? Salva uma das páginas e altera o layout, dai passa página por página mudando o menu página por página. Bem convenhamos que isso não é muito produtivo né???? imagine o tempo que você vai gastar para fazer uma alteração que parece ser simples??? Qual a solução para isso???
Templates
1 - Primeiro vamos criara um site dentro do Dreamweaver.
Vai abrir a tela como abaixo, no nome do site coloque TesteTemplate e vá para o próximo passo
Como nós vamos montar um site em HTML mesmo selecione "Não, eu não quero usar nenhuma..." e avance
Aqui você vai colocar o caminho do site no seu computador, por exemplo em c:\testeTemplate e avance
Essa tela é para configuração do servidor, selecione "None" e avance e ná póxima tela conclua.
Perfeito, criamos um SITE de gerenciamento dentro do dreamweaver
2 - Agora vamos começar a criar o template das páginas na estrutura da primeira imagem que está nesse tutorial.
No menu File, New, selecione Blank Template, no Tipo selecione HTML
Criou uma página comum, nela vamos adicionar uma tabela de 2 linhas e uma coluna, vá no Menu Insert, Table em Rows coloque 2 e Columns 1
Criado a tabela quebre a segunda linha em duas colunas, posicione o cursor dentro da segunda linha, vé em Modify, Table, Split Cell, na tela que se abrir selecione Columns e Digite na caixa de texto 2
Monte como na imagem abaixo, deixando a parte de cima como Faixa, o meio como conteudo e na lateral esquerda crie 3 link, um com o endereço pagina1.html outro com o endereço pagina2.html e o último como pagina3.html
Agora vamos inserir as partes editáveis no tamplate, normalmente o que muda na página é apenas o título e conteúdo, então vamos inserir duas parte editáveis uma para o título e outra para o conteúdo.
Posicione o cursor do mouse no local da tabela que você deixou para o conteúdo, vai em Insert, Templates Objects, Editable Region, coloque o nome de edtTitulo, insira outro Editable Region abaixo do título com o nome de edtConteudo. Deve ficar como a imagem abaixo
Com o template criado vamos criar as páginas com base nesse template.
Vá em File, New selecione Page from template, selecione o Site TesteTemplate, selecione o padrao.
Quando você confirmar irá criar uma página igual ao template que você tinha criado anteriormente, qual a diferença??? Se reparar você só consegue alterar os campos que você escolheu, no caso o edtTitulo e o edtConteudo, se tentar mover/excluir/alterar qualquer outro elemento da página ele não deixa. Altere o Título para Página 1 e o conteúdo também, salve à como pagina1.html
Crie mais duas página seguindo esse mesmo processo, salve uma como pagina2.html e a outra como pagina3.html.
Certo, agora vamos abrir a página no browser e verifique se está funcionando direitinho.
Agora vamos fazer o seguinte vamos adicionar um novo link para uma nova página.
Então vá ao dreamweaver novamente, certifique-se que você está no site correto (TesteTemplate), File, New, Page from template, selecione o TesteTemplate, selecione padrao e confirme. Modifique o Título para Página 4 e altere o conteúdo, salve ela como pagina4.html.
Feito a página 4 vamos agora colocar o link para a página 4, abra o template padrao e adicione o link para a página4.html
Quando você mandar salvar ele vai perguntar se você quer alterar as página, confirme.
Navege pelo site novamente, você vai perceber que ele já criou os links em todas as página, poupando você ter que entrar página por página para incluir o link.
Terminado o exemplo, agora é só brincar com o template alterando cores, etc.
Espero ter ajudado.
7 comentários:
Graças a Deus, um tutorial que explica realmente o 'passo a passo' de como criar um template, tá de parabéns. Obrigadão!
oi meu nnome é Dine ,será que poderia me ajudar????sou pessima nesse negocio de net mais queria fazer um blog bem bonitinho com slides,letrinhas legais pois vou usar para trabalho ,,,e preciso muito !!!! mais nao consigo fazer tenho um mais esta horrivel queria deixa-lo bem legal vc pode me ajudar????? meu email é dineamarelo@hotmail.com...vou te agradecer pra sempre!!!
Eaiiii, Doug quero ver mais artigos no seu Blog, principalmente em Flash e Dreamwearver.
Falooo. RAFA (SI)
Parabéns pelo post!
Sou uma besta no que se refere ao dreamweaver, se não fosse este tutorial eu levaria séculos para aprender!
Gostaria de saber que tem como criar um template(desenho de um blog) no Dreamweaver e depois hospeda-lo no BlogBlogs. Para não ter que usar os temas proposto pelo BlogBlogs
Desculpa digitei BlogBlogs na postagem a cima, na verdade é blogspot.
Parabéns pelo post, é ótimo muito bem explicado, me ajudou muito.
Deus te abençoe!
Abraço!
Postar um comentário