Desenvolvimento web · estudo de caso
Motokão Moto Center
Site institucional da loja de motos: tema WordPress com conteúdo editável pela equipe, Docker e Nginx na VPS, painel fora do alcance público e cliques do Mercado Livre rastreáveis por origem.
Visão geral
A Motokão Moto Center é loja de motos, peças e oficina em Araras, no interior de São Paulo, na mesma atividade da família desde 1990. São mais de 4 mil peças em estoque, um balcão atendido por telefone e WhatsApp e uma operação no Mercado Livre que existe desde 2016.
O site é a primeira porta de entrada da loja. Ele precisa apresentar a marca em poucos segundos, provar credibilidade — história, estoque, oficina — e conduzir a conversa até os canais onde a venda realmente acontece.
O desafio
O negócio muda rápido. Campanha, preço, novidade de estoque e agora as motos elétricas viram pedido de programação toda vez que o site não consegue absorver a mudança sozinho — e é assim que um site institucional envelhece e para de refletir a loja.
Há também o risco de manutenção. WordPress continua sendo o alvo mais atacado da internet, e expor o painel de um site de loja pequena, sem equipe de TI dedicada, é aceitar uma superfície de ataque que nenhum plugin consegue zerar depois.
E um detalhe de produto muda tudo: a loja não vende com carrinho de compras. A conversa começa no site e termina no balcão, no WhatsApp ou na vitrine do Mercado Livre. O site precisa converter em conversa, não em carrinho abandonado.
A solução
Construí um tema WordPress próprio — sem page builder, sem loja virtual e com o mínimo de plugins — dividido em quatro camadas com responsabilidades claras.
O layout vive em PHP puro, o conteúdo vive em campos editáveis, a execução vive em contêineres e a segurança vive na borda. Cada camada pode mudar sem arrastar as outras junto.
Quatro camadas
| Camada | Papel | Escolha |
|---|---|---|
| Tema | Layout das seções da home e da página de motos | front-page.php e template próprio, em PHP |
| Conteúdo | Textos, estatísticas e botões editáveis | Advanced Custom Fields declarado no tema |
| Execução | Ambiente isolado e reproduzível | Docker Compose com WordPress e MariaDB |
| Borda | TLS, roteamento e restrição de acesso | Nginx na frente de todo o tráfego |
Conteúdo que a equipe edita sozinha
Os grupos de campos ficam declarados no próprio tema e são registrados a cada carregamento do WordPress, com rótulos em português e um valor padrão razoável. São mais de 170 campos organizados por seção: herói, história, serviços, diferenciais, atacado, Instagram e contato.
Trocar o slogan, o número de peças em estoque ou o texto do atacado não exige deploy. A pessoa da loja edita no painel e publica. O tema continua versionado no servidor, com cópias datadas ao lado de cada arquivo alterado, o que torna qualquer mudança reversível.
Segurança desenhada antes do plugin
A superfície de ataque foi reduzida na borda e no código, não por um plugin:
o Nginx responde por wp-login.php e wp-admin apenas ao próprio servidor: de fora da VPS, o painel simplesmente não existe;
o xmlrpc.php devolve 403 no Nginx e também é desativado dentro do tema;
cabeçalhos de descoberta — gerador, rsd, wlwmanifest, shortlink e links do REST — são removidos da página;
o único plugin ativo no site é o próprio Advanced Custom Fields.
Cliques que viram decisão
O site também funciona como medidor. Qualquer link para o Mercado Livre pode passar pela rota curta /r/ com um código próprio: o servidor registra o clique em um log dedicado e responde com um redirecionamento 302 imediato, com cabeçalhos que impedem o cache.
Assim, o QR code impresso, a bio do Instagram e um anúncio apontam para endereços diferentes da mesma vitrine — e a loja descobre de onde veio o interesse sem script de terceiro, sem cookie e sem penalizar a velocidade da página.
Vitrine que gira
A página de motos elétricas é um template dentro do tema, com um visualizador 360 graus escrito para este projeto: ao arrastar na horizontal, o visitante gira o modelo, troca a cor e alterna entre TUI Mais e TUI Pop, sem nenhuma biblioteca externa — apenas sequências de quadros em PNG e WebP carregadas sob demanda.
Cada modelo carrega os próprios dados junto ao visualizador — motor, bateria, autonomia e itens inclusos — e o botão de interesse leva direto ao WhatsApp com o contexto da página.
Performance medida na VPS
| Página | TTFB medido | Tamanho do HTML |
|---|---|---|
| Home | ~140 ms | ~41 KB |
| Motos elétricas | ~72 ms | ~36 KB |
Medição feita em setembro de 2026, servindo a partir da mesma VPS que hospeda este portfólio, com PHP 8.3 e nginx na frente. O segredo não é um truque: são poucas camadas, um único plugin ativo e nenhum construtor de páginas pesado.
Resultado
site no ar com certificado TLS válido e renovação automática;
textos, estatísticas e botões editáveis pela equipe, sem passar por deploy;
painel e xmlrpc inacessíveis de fora do servidor;
cliques de materiais diferentes rastreáveis por origem;
vitrine 360 graus das motos elétricas com atalho direto para o WhatsApp;
resposta em menos de 150 ms na home, medida na própria VPS.
Papel e tecnologia
Levei o projeto do ambiente ao ar: infraestrutura em Docker, configuração do Nginx e do TLS, tema WordPress desenvolvido do zero, grupos de campos do Advanced Custom Fields e o visualizador 360 graus em JavaScript.
A stack final ficou pequena de propósito — WordPress com PHP 8.3, MariaDB, Docker Compose, Nginx, Let's Encrypt e um único plugin — justamente para que a manutenção continue cabendo em poucas horas por mês.
Aprendizados
tema próprio com campos editáveis é mais leve e mais previsível que um construtor de páginas num site institucional;
a segurança mais barata é a que remove uma rota, não a que instala mais um plugin;
um site de loja não precisa vender: precisa conduzir bem até o balcão, o WhatsApp e o Mercado Livre;
manter a stack pequena é o que permite um negócio sem equipe de TI manter o próprio site.
O mesmo negócio ganhou outro projeto neste portfólio: o Motokão Pedidos, sistema de reposição de estoque da operação. Um cuida da vitrine, o outro cuida da compra.
Próximos passos
O que entra em seguida: cache de página na borda para reduzir ainda mais o tempo de resposta, backup automatizado do banco e dos assets do tema com verificação periódica, conteúdo editorial sobre manutenção e motos elétricas, e tokens de rastreio por canal para os materiais impressos.
