Layout - Rodapé
De Melhor Loja Web
Antes de iniciarmos com a edição do rodapé, é necessário que tenha criado as seguintes páginas que são padrões para todas lojas virtuais:
- Fale Conosco
- Sobre Nós
- Política de Entrega
- Segurança e Privacidade
- Trocas - Devoluções - Garantia
Veja como criar uma página neste passo a passo:
Antes de iniciarmos, veja que este será o rodapé padrão:
Precisamos editá-lo para personalizar com os dados e páginas de sua loja virtual, como endereço, quem somos, fale conosco etc. Além de alterar os links do cabeçalho.
Veja o passo a passo a seguir para fazer este procedimento.
Observação: Este tutorial serve está baseado no modelo de layout MLW056.
Tabela de conteúdo |
Como Criar uma página?
1- Clique em Conteúdo do site e depois escolha a opção Criar uma Página.
2- Faça as configurações como a imagem abaixo e ao terminar as configurações, clique em salvar:
3- O resultado será assim:
Observação: Perceba que a página quem somos foi criada em seu site e o conteúdo divulgado exatamente como informou no editor.
4- Feito isto, copie a url gerada automaticamente, pois será necessária para editar o rodapé nos próximos passos:
Exemplo:
Após criar suas páginas, siga para o próximo passo para editar o Rodapé.
Editando o Rodapé
Para editar o "Rodapé do Layout Padrão" de sua loja virtual, siga os passos abaixo:
1- Dentro de sua administração, acesse “Layout”.
2- Escolha o Layout MLW056 e clique em "Ver/ Editar os arquivos do layout"
Observação: É importante que selecione o modelo de Layout 056, caso contrário, este passo a passo não irá funcionar.
-> Nesta etapa, você estará no modo design que permite alterar os arquivos CSS de sua loja virtual.
3- No canto superior esquerdo há a opção "Arquivos deste layout". Selecione a opção Footer.html, como a imagem abaixo mostra:
Nesta área poderemos alterar o código do rodapé da loja virtual. Siga para o próximo passo.
Todas as alterações que fizer aqui, irá alterar o rodapé de seu site. Veja na imagem que seu rodapé possui "divisões". Faremos as edições seguindo esta ordem.
1 - Institucional
Na linha 44, localize: 
Onde houver a href="#", subistitua o # pela sua url, por exemplo: http://www.testesualoja.com.br/paginas/Contato.html e logo apos o ; informe o nome da página que deve aparecer. Por exemplo: Fale Conosco.
Caso queira remover alguma página, selecione a linha do código como a imagem abaixo mostra:
2- Ajuste e Suporte
Acesse a linha 54 do código: 
Onde houver a href="#", substitua o # pela sua url, por exemplo: http://www.testesualoja.com.br/paginas/suporte.html e logo apos o ; informe o nome da página que deve aparecer. Por exemplo: Suporte.
Caso queira remover alguma página, selecione a linha do código como a imagem abaixo mostra:
3- Atendimento e Televendas
Acesse a linha 70 do código: 
Onde houver a href="#", substitua o # pela sua url, por exemplo: http://www.testesualoja.com.br/paginas/atendimento.html e logo apos o ; informe o nome da página que deve aparecer. Por exemplo: Atendimento.
Caso queira remover alguma página, selecione a linha do código como a imagem abaixo mostra:
4- Formas de Pagamento
Acesse a linha 86 do código: 
Onde houver a href="#", substitua o # pela sua url, por exemplo: http://www.testesualoja.com.br/paginas/atendimento.html e logo apos o ; informe o nome da página que deve aparecer. Por exemplo: Atendimento.
Caso queira remover alguma página, selecione a linha do código como a imagem abaixo mostra:
5- Loja Segura
Não é necessário alterar esta área.
6- Horário de Atendimento
Informe o horário de atendimento na linha 113.
Para inserir o mapa do Google, veja no próximo passo como proceder.
Editando o Rodapé dos demais modelos
Você pode a qualquer momento editar o rodapé de sua Loja, bastando para isso ter conhecimento de CSS e HTML. Acesse a administração de sua loja, clique em – Layout e prossiga com as alterações. Leia atentamente, pois qualquer alteração na programação, será de sua responsabilidade. Caso não tenha domínio do assunto, contrate alguém para lhe ajudar.
Para remover o rodapé padrão, como o abaixo, siga os seguintes passos:
1- Dentro de sua administração, acesse “Layout”.
2- Clique em Ver/Editar os arquivos de Layout
3- Leia o texto com atenção antes de prosseguir:
Como Inserir o Google Maps?
Para implementar na loja o Google Maps, siga os passos a seguir:
1- Acesse: https://www.google.com.br/maps
2- Digite o seu endereço e clique em Menu:
3- Clique em Compartilhar ou Incorporar Mapa
4- Clique em Incorporar mapa e escolha o tamanho do mapa:
5- Feito isto, copie o código e insira dentro da Tag: "iframe src="
Editar Imagens Banner Rotativo
Para trabalhar com o Banner Rotativo no modelo MLW056, inicialmente é necessário realizar o upload das imagens.
Upload de Imagens
1- Antes de começar, suba as imagens que irá utilizar. Acesse Conteúdo do site e clique em "Gerenciar Imagens":
2- Clique em "Enviar Imagens":
3- Escolha as imagens salvas em sua máquina. Observação: Para um bom funcionamento do Banner, as imagens devem ter a proporção de 1920x500.
4- Após subir as imagens, serão exibidas miniaturas como abaixo. Copie o endereço da imagem de cada uma delas. Para isto clique com o botão direito do mouse em cima da imagem em questão e selecione "Copiar endereço da imagem".
5- Salve estas urls e siga para o próximo passo.
1- Acesse "Layout" e clique no botão "Ver/Editar os arquivos de Layout".
2- Na página inicial, escolha para editar "Default.html" é página inicial padrão. Ao abrir o editor já estará nela:
3- Na linha 11, insira a url da imagem em questão na tag: img src=
4- Repita o mesmo procedimento nas linhas 15 e 19.
Obs: Edite apenas as tags img src=
Fim
Como Alterar a Imagem do Topo?
Para o modelo MLW056 há esta imagem no topo do lado esquerdo:
Para alterar esta imagem, siga os passos:
1- Acesse Conteúdo do site e clique em "Gerenciar Imagens":
2- Selecione o arquivo sprite e clique em deletar imagem:
3- Ainda em Gerenciar Imagens, clique em "Enviar Imagens" e selecione a imagem, em seu computador, que gostaria de inserir. Ao final clique em enviar.
Observação: Para ser exibido corretamente, a imagem deve ser salva com o nome de sprite.png. Recomendamos também a resolução de algo em torno de 194x55 px
Trocando os Links do Cabeçalho da página
Siga os passos abaixo para alterar os links do cabeçalho:
1- Acesse "Layout" e clique no botão "Ver/Editar os arquivos de Layout".
2- Na página inicial, escolha para editar "Header.html":
3- Acesse a linha 7 e depois de "a href=" informe seu domínio. Exemplo:
4- Acesse a linha 23 e depois de "a href=" informe seu domínio. Ainda na linha 23, depois de "span class="informe a url da sua página de contato. Deverá ficar desta maneira:
Feito isto, seu cabeçalho estará configurado.
