sexta-feira, 24 de abril de 2009

Fazendo seu Próprio template

Um Super Novidade: Como Criar Seus Proprios Templates. Veja a tutorial e Tente fazer .. ;)

http://euclideschuma.files.wordpress.com/2007/09/silver2_3.jpg
Inicio: Baixe o PhotoShop, que Tem aqui no Blog Do Joao Vitor pra Baixar. E Baixe Também o Front Page.

1-
Escolhi um wallpaper para iniciar meu layout, para quem ainda está começando nessa área recomendo começar por eles, que são super fáceis de lidar. Quem não vai fazer com wallpaper o procedimento É O MESMO. Clique aqui para ver a imagem que vou usar

2- Com a imagem já aberta no photoshop começarei criando um efeito 'esticado' na figura. Para faze-lo é só selecionar (com a ferramenta de seleção) a parte que deseja esticar e apertar control + T como eu fiz abaixo:

3-
Vou criar os retângulos, onde ficarão os posts e o perfil. Clico na ferramenta Rectangle Tool ou simplesmente teclo a letra "U", escolhi a cor azul, clico nos lugares onde quero fazer os retângulos e desenho. Para aparecer um pouco do fundo vá em opacidade e diminua de 100% para 75% por exemplo. Veja aqui o modelo. O meu ficou assim.

4-
Apertando a tecla "T" escreverei em cima dos retângulos "Posts" e "Perfil".

5- A imagem do layout está pronta, aproveite para colocar brushes, efeitos, etc.. Quando terminar aperte a tecla "M" (Rectangular Marquee Tool) e selecione a metade de cima do layout, como eu fiz aqui. Aperte Shift + Control + C (para copiar), depois Control + N (para abrir um novo arquivo) e Control + V (para colar), vá em File > Save for Web > Save > Coloque o nome que desejar e salve. Feche esse novo arquivo e volte para a tela do layout inteiro, clique com o botão direito em cima da parte selecionada e vá até 'Select Inverse', o processo é o mesmo da parte de cima, aperte Shift + Control + C (para copiar), depois Control + N (para abrir um novo arquivo) e Control + V (para colar), vá em File > Save for Web > Save > Coloque o nome que desejar e salve. Feche esse novo arquivo e volte para a tela do layout inteiro, selecione um pedaço do fundo (da ponta direita a ponta esquerda), igual eu fiz aqui. Aperte Shift + Control + C (para copiar), depois Control + N (para abrir um novo arquivo) e Control + V (para colar), vá em File > Save for Web > Save > Coloque como fundo e salve.

6-
Abra o Front Page, clique com o botão direito no fundo branco e vá até "Page Properties" (Propriedades da Página) > Background (Fundo), marque a opção Background Picture (Figura de Fundo), clique em "Browse..." (procurar) e selecione a imagem que você salvou como fundo, clique na aba "Margins" (Margens) e marque os dois quadrinhos, dê Ok. Utilize essa ferramenta para inserir as duas figuras do layout, clique nela, procure pela figura de topo e dê ok, clique mais uma vez, procure pela segunda parte e dê ok novamente.

7-
Seu layout está quase pronto! Agora só falta definir as layers.. Em baixo do layout escreva "Posts", dê enter e escreva "Perfil". Selecione a palavra posts, vá em View (exibir) > Toolbars (barra de ferramentas) > Positioning (Posição), irá aparecer uma nova barra, mas se "Positioning (posição)" já estiver marcada a barrinha já vai estar lá. Clique aqui para ver a barrinha.

8-
Clique no quadradinho amarelo que está nessa barrinha e arraste a palavra "Posts" que você tinha selecionado para o lugar aonde ficarão seus posts, regule a largura, tamanho, etc. Faça o mesmo com a palavra "Perfil", selecione, clique no quadrinho amarelo e ponha aonde quer que fique.

9-
Quando tudo estiver no seu lugar certinho, selecione a palavra posts, clique na aba "html" e cole as tags do seu blog.

>> Clike aqui para Pegaar Tags para Template de Blogger. Boa Sorte ..

Créditos: Joao Vitor

0 comentários: