Montar a página inicial por blocos

Onde: Conteúdo → Home.

A página inicial é montada por blocos empilhados. Você escolhe quais entram, em que ordem, e sobe e desce cada um.

Se você não montar nada, a home usa o arranjo padrão da plataforma — que já é um arranjo bom. Mexer é opcional.

Os blocos

• Banners — as artes grandes do topo. Um só, vários um embaixo do outro, lado a lado, ou em carrossel.
• Produtos — uma vitrine, que pode ser os mais vendidos, os mais novos, os em promoção ou uma categoria escolhida.
• Categorias — os caminhos do catálogo, com foto e quantos produtos cada uma tem. A contagem se desliga em Mostrar quantos produtos. Em Formato você escolhe lista de atalhos, grade ou carrossel (as categorias passando); em Estilo das categorias, o desenho de cada uma: cartão com foto e nome embaixo, foto redonda sem cartão, foto inteira com o nome por cima, pílula com foto pequena e nome ao lado, ou só a foto e o nome. O estilo vale para a grade e o carrossel.
• Marcas — a fileira de logotipos. Só faz sentido se você revende marcas conhecidas. Em Estilo das marcas você escolhe o desenho: cartão com o logotipo e o nome embaixo, só o logotipo num cartão branco, só o logotipo solto, sem moldura e sem nome, logotipo solto com o nome embaixo, logotipos soltos em cinza que ganham cor ao passar o mouse, logotipo num círculo, ou pílula com logotipo pequeno e nome ao lado. Os soltos ficam melhores com logotipo de fundo transparente (PNG ou SVG): logotipo com fundo branco próprio mostra esse branco.
• Chamada — um bloco de texto com até dois botões. Para a promoção da semana, o anúncio da coleção, o convite ao clube. No Estilo: Primeira tela, ela vira a abertura grande da home, na cor da loja: frase de cima, título, dois botões, as garantias (“Frete para todo o Brasil; Compra segura”, separadas por ponto e vírgula) e uma imagem ao lado.
• Por que comprar aqui — até quatro motivos para escolher a sua loja, cada um com ícone, título e texto. Já vem escrito; troque pelo que é verdade no seu negócio.
• Fale com um especialista — um convite para tirar dúvidas antes de comprar, com a foto de quem atende. O botão leva ao WhatsApp cadastrado em Aparência → Atendimento, ou ao link que você escrever. Sem nenhum dos dois, o bloco não aparece.
• Benefícios — os ícones de frete grátis, parcelamento, troca fácil, compra segura. Podem vir um cartão para cada, ou uma faixa só, branca e com divisórias. No celular, eles vêm um por linha, com o ícone à esquerda; para pôr dois por linha, use Faixa de benefícios no celular, em Aparência → Celular. O estilo (faixa só ou um cartão para cada) vale para a loja toda e fica em Estilo dos benefícios, em Aparência → Vitrine; no bloco da home dá para escolher outro só para ela. Com Subir sobre o banner de cima ligado, essa faixa sobe um pouco por cima do fim do banner, como um cartão flutuando. Para isso, ponha o bloco logo abaixo do banner.
• Artigos do blog — os últimos textos publicados, em cartões com a capa, a data, o tempo de leitura e “Ler artigo”. Com a página do blog configurada, o título ganha o “Ver todos”.

As cores de cada bloco

Abra o bloco: depois dos campos dele vem Cores, fundo e borda. Ali ficam a Cor de fundo (chapada, ou em degradê com a Segunda cor), a Cor do texto, a Imagem de fundo, a Borda e a Cor da borda. Em Fale com um especialista e em Por que comprar aqui, que são desenhados em cartões, há também a Cor do cartão.

O fundo pinta a faixa inteira do bloco, de uma ponta da tela à outra; a cor do cartão pinta só o cartão. A cor do texto vale para títulos e textos — botões e preços continuam com as cores da loja, que é por onde o cliente a reconhece. Campo vazio quer dizer “como o resto da loja”. Para mudar as cores da loja inteira, o lugar é Aparência → Estilo.

Uma ordem que funciona

1. Banner ou Chamada em Primeira tela — diz o que você vende, logo de cara.
2. Benefícios — responde “posso confiar?” logo de cara. Os textos se editam em Aparência → Vitrine → Benefícios: título até 40 caracteres e descrição até 80, com a conta embaixo do campo, para caberem nas três colunas sem ficar compridos.
3. Produtos em destaque — dá o que clicar antes de o cliente pensar em sair.
4. Categorias — para quem quer navegar em vez de escolher.
5. Chamada — a promoção ou o convite.
6. Por que comprar aqui — responde “por que esta loja e não outra?”.
7. Mais vendidos — a prova social de que outras pessoas compram aqui.
8. Fale com um especialista — para quem ainda está em dúvida.
9. Artigos do blog, se você escreve.

A primeira tela

O que aparece antes de rolar precisa responder três perguntas em segundos: o que essa loja vende, por que eu confiaria nela, e o que eu clico agora.

Erros comuns: banner bonito que não diz o que a loja vende; primeira tela só com banner, sem nenhum produto; carrossel de oito banners que ninguém espera terminar.

Banners

Onde: Conteúdo → Banners.

Cada banner tem Tipo — “Imagem com texto” ou “Somente imagem”, que usa a arte inteira sem texto por cima — e Onde aparece: topo da home, meio da home, antes do rodapé, ou uma das três faixas extras.

Prefira “Imagem com texto” quando puder: o texto fica legível em qualquer tela e não estica junto com a imagem. Arte com texto embutido some no celular.

Para vários banners passarem um de cada vez, vá em Conteúdo → Home e, no bloco Banners, escolha Formato: Carrossel. Com Passar sozinho ligado, eles trocam a cada seis segundos e param quando o cliente passa o mouse ou toca na tela. No celular é o mesmo carrossel, arrastado com o dedo, e cada banner usa a sua Imagem (celular) quando você cadastrou uma. Com um banner só, não há carrossel: ele fica parado.