template personalizado

Out

09Out

Fazendo seu template personalizado:

55 comentários
Como fazer seu próprio template?
Bem vamos começar criando ele em um programa adequado e fácil de manipular.
Como por exemplo o Fireworks se você não tiver.
Baixe ele aqui :
Download Fireworks MX 2004
Clique na imagem para amplia-la




1º -Vamos abrir o fireworks,lá em file abrir uma nova (new) então uma nova imagem de tamanho 779 x 600 (este é o tamanho que uso para fezer lay) mais se preferir pegar um wallpaper por exemplo que tem o tamanho de 800x600 e trabalhar nele tudo bem.





Eu fiz upload de uma imagem que salvei em meu computador para fazer o lay.
Usei o conta gotas para usar as mesmas cores da imagem para combinar, como mostra a imagem.
Como você poderá verificar na imagem fui trabalhando com as formas disponiveis no fireworks para tá fazendo meu lay.





2º Depois do lay pronto você vai lá em exportar preview e salva como gif depois de salva em seu computador, você vai lá e abre a imagem do seu lay novamente no fireworks para recortar a linha como na imagem, Voce de preferencia vai lá no meio onde esta os posts e perfil e recorta um pedaço como disse para fazer a linha, ctrl+C você copia o pedaço abre new em file e cola esse pedaço que você acabou de copiar e vai abrir com o tamanho exato do pedaço copiado, e ai você salva como gif no mesmo processo do lay.( observe que no fireworks você precisa encaixar a imagem direitinho para não sobrar se não dá dieferença) procure vizualizar em 50% que dá para ver a imagem toda na tela.





3º o Lay ficou assim imagem acima:( refiro-me a ele como topo ainda)




Agora depois do topo e a linha pronto você vai posta-lo em seu hosting as imagens, pega os endereços das imagens e coloca nos lugares indicados nos códigos se for no blogger, blogspot, etc, você posta sem publicar e só pega o endereço.
Agora Vamos as medidas do Lay:
Como mostra na imagem acima você vai pegar uma linha no fireworks apenas para tá colhern as medidas e verificando abaixo no mesmo onde tem W que indica largura de qualquer forma no fw e o H que indica altura.
Essas tags abaixo você encontrarar nos códigos do seu HTML que poderá ser as medidas do perfil ou dos posts.
<div id="Layer1" style= "position:absolute; left:127px; top:410px; width:174px; height:68px;">
O left é a distância até o perfil ou os posts
top é a distância do topo.
width é o tamanho do perfil ou posts.
Quanto aos códigos Html para tá explicando passo a passo ficaria muito extenso o tutorial, então eu darei os códigos prontos para todos os provedores que faço lay.
As primeiras medidas que se encontram nos códigos referem-se ao perfil, e as ultimas aos posts ok!



Faça download dos códigos do provedor desejado abaixo:


clique e faça download clique e faça downloadClique e faça downloadclique e faça download

Clique e faça download