* Para realizar esse tutorial é necessário ter o programa Photoshop instalado em seu computador, clique aqui para fazer download da versão trial.


* No exemplo abaixo usaremos as dimensões de uma de nossas lojas, porém para a sua loja você deve ir no admin do seu site e verificar as dimensões no banner de exemplo que já vem com a loja, clique em CMS -> Banners selecione o 1 banner e confira a largura e altura do banner padrão da sua loja, como mostrado abaixo.






Passo 1 - Primeiro vamos preparar o molde para as fotos do Banner Home (Banner principal da loja). Abra o photoshop e vá em Arquivo -> Novo edite a largura para 960 pixels e a altura para 430 pixels e clique em OK.





Passo 2 - Agora vamos importar a imagem para dentro do nosso molde e assim começar a edição do Banner, vá em Arquivo -> Abrir e procure no seu computador a foto que deseja utilizar como banner e de OK.





Passo 3 - A imagem vai abrir como um item novo, então vamos renomear ela e copiar para dentro do nosso molde.






Passo 4 - Na barra de ferramentas escolha a ferramenta Letreiro e selecione toda a imagem, após isso aperte Ctrl+C e depois abra nosso arquivo de molde e aperte Ctrl+V, o resultado vai ser igual abaixo apresentado.





Passo 5 - Já com a imagem no nosso arquivo note que ela está menor que o tamanho do banner, então temos que aumentar um pouco nossa imagem de modo que ocupe toda a área do nosso banner, selecione a camada da nossa imagem e aperte Ctrl+T, você vai notar que apareceu nas laterais da imagem uns quadrados pequenos, mova o mouse para um desses quadrados e aperte alt+shift+click e arraste sua imagem aumentando o tamanho da mesma conforme o necessário, quando estiver da forma correta aperte Enter.





Passo 6 - Pronto nossa imagem já está pronta para ser exportada e usada como banner na loja, vamos exportar a imagem em Arquivo -> Salvar para Web e Dispositivos , uma janela vai ser aberta escolha a opção JPEG e deixe a qualidade entre 90 e 100, depois disso clique em salvar e escolha o local em seu computador para salvar a imagem do banner. Pronto agora é só realizar o upload da imagem para sua loja.





Informações adicionais


Siga sempre esse método para gerar suas imagens para a loja, pois caso você escolha uma imagem com as dimensões maiores que as mostradas aqui, o sistema vai redimensionar as imagens para o tamanho correto e nesse processo as imagens podem ficar distorcidas.

Para criar o molde do banner lateral siga os mesmos passos de 1 a 6, porém utilize as dimensões que estão abaixo.