Desenhe a sua loja com um tema gratuito
O seu tema decide o aspeto da sua loja — o cabeçalho, as cores, os tipos de letra, o layout e a forma como os produtos são apresentados. Não precisa de comprar um tema nem de escrever código para ter uma loja limpa e profissional. Este guia constrói uma loja com bom aspeto usando dois excelentes temas gratuitos.
Este guia pressupõe que o WooCommerce está instalado — consulte Instalar e configurar o WooCommerce se ainda não estiver.
O que um tema faz (e o que não faz)
- O tema controla a aparência — o seu logótipo, as cores, os tipos de letra e o layout geral.
- O WooCommerce controla a loja — produtos, carrinho, finalização da compra e pagamentos.
- Os plugins (como os nossos) acrescentam funcionalidades.
Pode mudar de tema a qualquer momento sem perder produtos ou encomendas, por isso fique à vontade para experimentar.
Passo 1 — Encontrar e instalar um tema
- No painel do WordPress, vá a Aparência → Temas.
- Clique em Adicionar novo tema no topo.
- Procure um tema pelo nome, passe o rato por cima e clique em Instalar e depois em Ativar.
Procure um tema pelo nome e clique em Instalar — há aqui milhares de temas gratuitos.
O ecrã de temas — instale uma vez e depois ative o que quiser usar.
A seguir percorremos dois temas gratuitos que funcionam lindamente com o WooCommerce. Escolha o caminho que melhor lhe convém — só precisa de um.
| Astra | Twenty Twenty‑Five | |
|---|---|---|
| Ideal para | O resultado polido mais rápido | Ficar 100% WordPress «nativo» |
| Edita-se com | O Personalizador (painéis simples) | O Editor do site (blocos) |
| Curva de aprendizagem | Muito suave | Um pouco mais exigente |
| Criado por | Brainstorm Force | A equipa do WordPress |
Caminho A — Astra (a forma rápida e guiada)
Astra é um dos temas gratuitos para lojas mais populares. É leve, rápido e edita-se através do prático Personalizador, que mostra cada alteração numa pré-visualização ao vivo.
Torne-o seu com o Personalizador
Depois de ativar o Astra, vá a Aparência → Personalizar. O painel da esquerda lista tudo o que pode alterar; à direita vê o seu site ao vivo enquanto trabalha.
O Personalizador: altere uma definição à esquerda e veja-a de imediato à direita.
Adicione o seu logótipo e o nome da loja — abra Identidade do site. Carregue um logótipo, defina o Título do site e a Descrição, e escolha o tamanho do logótipo.
Identidade do site é onde carrega o logótipo e define o nome da loja.
Escolha as suas cores — abra Global → Cores. Escolha uma paleta pronta ou defina as suas próprias cores de destaque, de ligações, de títulos e de texto. A cor de destaque é usada nos botões e ligações de toda a loja, por isso é a forma mais rápida de dar à loja o aspeto da sua marca.
Defina uma cor de destaque e ela aplica-se aos botões e ligações em todo o lado.
Escolha as suas fontes — abra Global → Tipografia. Escolha uma predefinição de fonte pronta, ou defina fontes e tamanhos específicos para o corpo do texto e os títulos. Uma boa tipografia deixa a loja com aspeto polido sem esforço adicional.
A tipografia controla as suas fontes em todo o site — comece com uma predefinição e ajuste se quiser.
Organize o seu cabeçalho — abra o Header Builder. Arraste elementos (logótipo, menu, pesquisa, carrinho) para a esquerda, o centro ou a direita do cabeçalho até ficar a seu gosto.
Arraste o logótipo, o menu e o carrinho para o lugar certo no Header Builder.
Quando estiver satisfeito, clique em Publicar para guardar.
A sua montra
Com o WooCommerce ativo, o Astra dá automaticamente às suas páginas de Loja e de produto um layout limpo e moderno — sem configuração adicional.
A sua página de loja com o Astra — uma grelha de produtos limpa, pronta a usar.
Uma página de produto — imagem, preço, carrinho e descrição, tudo formatado automaticamente.
Atalho opcional — Starter Templates. O Astra oferece designs prontos que pode importar em poucos cliques através de Aparência → Starter Templates. A versão atual pede primeiro para ligar uma conta gratuita. É uma forma rápida de partir de um aspeto terminado, mas é totalmente opcional — tudo o que está acima funciona sem isso.
Caminho B — Twenty Twenty‑Five (o tema de blocos oficial)
Twenty Twenty‑Five é o tema predefinido criado pela equipa do WordPress. Edita-se com o Editor do site, onde cada parte do seu site é construída a partir de blocos — os mesmos blocos que usa ao escrever uma página.
Abrir o Editor do site
Vá a Aparência → Editor. Verá um painel para Estilos, Navegação, Páginas, Modelos e Padrões, com uma pré-visualização ao vivo do seu site.
O Editor do site — o seu centro de controlo para um tema de blocos.
Mudar o aspeto com os Estilos
Clique em Estilos para mudar cores, tipografia, fundos e layout de todo o site de uma vez. Clique em Explorar estilos para experimentar variantes de estilo prontas com um clique.
Os Estilos mudam as suas cores e tipos de letra em todo o site — experimente primeiro as variantes integradas.
Editar modelos
Em Modelos, pode abrir o modelo de qualquer tipo de página — início, blogue ou produto individual — e reorganizar os seus blocos. É mais exigente do que o Personalizador do Astra, mas dá controlo total.
Os modelos permitem editar o layout de cada tipo de página, bloco a bloco.
A sua montra
O WooCommerce também funciona com o Twenty Twenty‑Five, dando-lhe uma loja limpa e minimalista que usa o estilo do próprio tema.
A mesma loja com o Twenty Twenty‑Five — minimalista e totalmente WordPress «nativo».
Qual devo escolher?
- Escolha o Astra se quer o caminho mais rápido para uma loja polida com painéis simples e guiados. Serve para a maioria de quem está a começar.
- Escolha o Twenty Twenty‑Five se prefere ficar com blocos puros do WordPress e não se importa com uma curva de aprendizagem um pouco mais acentuada.
Não há escolha errada, e mudar mais tarde é fácil.
Faça as suas imagens de produto brilharem
Seja qual for o tema que escolher, as suas fotos de produto fazem a maior parte do trabalho visual. Use imagens nítidas e consistentes — e lembre-se de que ficheiros de foto grandes tornam o site mais lento. O nosso plugin Image Optimizer comprime-as automaticamente para que a sua loja se mantenha rápida sem perda de qualidade.
Outros bons temas gratuitos
Se nenhum lhe servir, estes temas gratuitos também são excelentes para o WooCommerce e editam-se de forma semelhante:
- Storefront — o tema oficial dos criadores do WooCommerce.
- Kadence e Blocksy — rápidos, flexíveis, com os seus próprios designs iniciais.
- Neve e OceanWP — leves e fáceis para principiantes.
As competências deste guia — instalar um tema e depois usar o Personalizador ou o Editor do site — aplicam-se a todos.
Seguinte: Adicionar produtos e lançar a sua loja