bom, só avisando, se você sabe sobre html e tal, sugiro que nem perca seu tempo, esse é um tuto pra quem ta fazendo um layout e só precisa de botões,etc.
Se você não sabe muito sobre html, e precisa de por seu layout e botões, está no lugar certo ;)
Bom, vamos la
Faça seu layout Como o meu de exemplo :
![[Photoshop] Criando layout sem precisar de Alguem para codificar [Ini-High] PhaQU](https://i.imgur.com/phaQU.png)
beleza, faça o layout com os botões e tudo mais...
Agora pegue a Ferramenta "Slice" e faça um "Cubo em cima de seu botão" (ps : a slice tool se localiza no mesmo lugar da Crop tool)
![[Photoshop] Criando layout sem precisar de Alguem para codificar [Ini-High] YnTTF](https://i.imgur.com/ynTTF.png)
Agora, clique com o botão direito no box do slice
Isto abrirá uma caixinha, vá em edit Slice options e bote na URL seu site desta forma (Como se chama botão 1 a segunda parte do site se chamará botão 2 ) então ficaria assim :
URL : seusite.com/botao2/index
Repita o mesmo processo com os outros botões fazendo por exemplo : seusite.com/botão3/index e tal.
Agora que feito isso, em todos os botões, vamos em FILE>Save For Web & Devices> deixe tudo como está. e bote em JPEG HIGH no lugar de GIF , aperte SAVE e salve assim :
Nome do seu arquivo
HTML AND IMAGES no FORMAT
Isso Criará uma pasta nomeada IMAGES e um arquivo .html Nomeie-o para Index
Feito tudo isso, abra o arquivo HTML com o bloco de notas.
Logo na "head" de seu HTML, terá algo como :
Agora, vá na Database de seu site, e Jogue a pasta "images" e o arquivo salvo, mas antes renomeie-o para Index
Bom, feito o upload dos dois, Você deverá ir no photoshop e criar a pagina 2 e salvar do mesmo jeito que salvou a 1.
Antes de fazer o upload da pagina 2 (BOTÃO 2) você deverá criar um diretório com o nome escolhido no inicio para o primeiro botão que no caso foi "seusite.com/botao2/index"
Então , a pasta se chamará "botao2" .
feita a "botao2" jogue a pasta images da pagina 2 e a index da pagina 2 .. faça o mesmo com todas as paginas.
feito isso, salve seu site e bla bla bla e vá testar :3
Qualquer duvida, só postar
esse tutorial é meu... Heero
Control c + Control V = morte. fikdik
Se você não sabe muito sobre html, e precisa de por seu layout e botões, está no lugar certo ;)
Bom, vamos la
Faça seu layout Como o meu de exemplo :
beleza, faça o layout com os botões e tudo mais...
Agora pegue a Ferramenta "Slice" e faça um "Cubo em cima de seu botão" (ps : a slice tool se localiza no mesmo lugar da Crop tool)
Agora, clique com o botão direito no box do slice
Isto abrirá uma caixinha, vá em edit Slice options e bote na URL seu site desta forma (Como se chama botão 1 a segunda parte do site se chamará botão 2 ) então ficaria assim :
URL : seusite.com/botao2/index
Repita o mesmo processo com os outros botões fazendo por exemplo : seusite.com/botão3/index e tal.
Agora que feito isso, em todos os botões, vamos em FILE>Save For Web & Devices> deixe tudo como está. e bote em JPEG HIGH no lugar de GIF , aperte SAVE e salve assim :
Nome do seu arquivo
HTML AND IMAGES no FORMAT
Isso Criará uma pasta nomeada IMAGES e um arquivo .html Nomeie-o para Index
Feito tudo isso, abra o arquivo HTML com o bloco de notas.
Logo na "head" de seu HTML, terá algo como :
- Código:
<head>
<title>Layout Galeria</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
</head>
Agora, vá na Database de seu site, e Jogue a pasta "images" e o arquivo salvo, mas antes renomeie-o para Index
Bom, feito o upload dos dois, Você deverá ir no photoshop e criar a pagina 2 e salvar do mesmo jeito que salvou a 1.
Antes de fazer o upload da pagina 2 (BOTÃO 2) você deverá criar um diretório com o nome escolhido no inicio para o primeiro botão que no caso foi "seusite.com/botao2/index"
Então , a pasta se chamará "botao2" .
feita a "botao2" jogue a pasta images da pagina 2 e a index da pagina 2 .. faça o mesmo com todas as paginas.
feito isso, salve seu site e bla bla bla e vá testar :3
Qualquer duvida, só postar
esse tutorial é meu... Heero
Control c + Control V = morte. fikdik
Última edição por Heero em Sáb maio 19, 2012 2:32 pm, editado 1 vez(es)
![[Photoshop] Criando layout sem precisar de Alguem para codificar [Ini-High] 2596450376](https://2img.net/u/1311/22/25/01/smiles/2596450376.gif)
![[Photoshop] Criando layout sem precisar de Alguem para codificar [Ini-High] Vote_lcap](https://2img.net/i/fa/prosilver_grey/vote_lcap.png){kind=small}
![[Photoshop] Criando layout sem precisar de Alguem para codificar [Ini-High] Voting_bar](https://2img.net/i/fa/prosilver_grey/voting_bar.png){kind=small}
![[Photoshop] Criando layout sem precisar de Alguem para codificar [Ini-High] Vote_rcap](https://2img.net/i/fa/prosilver_grey/vote_rcap.png){kind=small}
![[Photoshop] Criando layout sem precisar de Alguem para codificar [Ini-High] Top](https://2img.net/h/virteq.com/public/style_images/memory/top.png)
