Shopify e o desafio do tamanho
Shopify é a plataforma de e-commerce mais usada no mundo e tem presença forte no varejo de moda brasileiro, especialmente em marcas direto-ao-consumidor (DTC) e operações enxutas. Apesar do ecossistema maduro de apps, a recomendação de tamanho continua sendo um problema lateral: a maioria das lojas oferece apenas uma tabela estática em modal, e a devolução por tamanho segue alta.
A boa notícia é que Shopify oferece três caminhos limpos para integrar um provador virtual sem depender de fila de aprovação na App Store. O Provou foi desenhado para essa flexibilidade: uma única linha de script, peso de 18 KB gzip, renderização em Shadow DOM e zero impacto em CSS ou JavaScript do tema.
Este guia cobre cada caminho, mais a importação de tabelas, o ajuste de PDP, performance e checklist de testes. Em menos de dez minutos, você sai do zero ao widget rodando em homologação.
Antes de começar: o que você precisa
- Plano Shopify ativo (Basic, Shopify, Advanced ou Plus). Todos suportam as instruções abaixo.
- Acesso de admin à loja (você precisa ler e gravar tema).
- Cadastro Provou ativo (use o cadastro gratuito, 14 dias sem cartão).
- Slug da sua loja no Provou (ex.:
marca-x), copiável no painel. - Suas tabelas de medidas em CSV ou um feed Google Merchant Center configurado.
Tempo estimado: 8 a 12 minutos para a instalação básica. Mais 30 a 60 minutos para a importação completa de tabelas se a loja tem muitos SKUs.
Passo a passo: onde colar o snippet
O snippet base do Provou é uma linha:
``html <script src="https://cdn.provou.app.br/v1.js" data-store="sua-loja" async></script> ``
Substitua sua-loja pelo slug copiado do painel. A partir desse ponto, três caminhos viáveis no Shopify.
Caminho 1: edição direta do theme.liquid
- No admin: Online Store > Themes > Customize > Edit code.
- Abra
layout/theme.liquid. - Cole o snippet imediatamente antes da tag
</head>(ou logo após a abertura de<body>, se preferir defer). - Salve.
Este caminho funciona em todos os temas (Vintage e Online Store 2.0). Vantagem: simples, instalação por loja toda. Desvantagem: edita arquivo do tema, que pode ser sobrescrito em updates manuais do tema base.
Caminho 2: App Embed Block (Online Store 2.0)
Em temas baseados em Online Store 2.0 (Dawn e descendentes), você pode usar App Embeds para evitar editar theme.liquid diretamente. O Provou expõe um app embed simples:
- No customizer do tema, abra Theme settings > App embeds.
- Ative o embed do Provou e cole seu slug.
- Salve e publique.
Este caminho preserva a integridade do tema entre updates e permite ativar/desativar pelo customizer sem tocar código.
Caminho 3: Custom Pixel para eventos
Para lojas que querem repassar eventos do widget (carregamento, abertura, recomendação) ao GA4 ou Meta Pixel sem depender do gerenciador de tags da página, é possível usar um Custom Pixel.
- Settings > Customer events > Add custom pixel.
- Cole um pixel mínimo que escuta eventos do widget e os repassa via
analytics.publish. - Granular ao nível de evento.
Este caminho é complementar (não substitutivo). Você ainda precisa de um dos dois caminhos anteriores para o widget renderizar.
Importação de tabelas de medidas
O Provou aceita três fontes:
- Upload CSV: o caminho mais simples para lojas com até alguns milhares de SKUs. Estrutura mínima: SKU, nome, modelagem, medidas por tamanho. Veja o guia de tabela de medidas.
- Google Merchant Center: se sua loja já alimenta GMC para Shopping ads, o Provou consome o feed e mantém sincronizado. Recomendado para catálogos grandes.
- Sitemap: para lojas que mantém especificações detalhadas em página de produto, o Provou pode varrer o sitemap e extrair medidas estruturadas (Microdata, JSON-LD).
No Shopify, a fonte mais comum é o CSV, exportado a partir do admin (Products > Export). Você complementa com colunas de medidas. Para Shopify Plus, o Catalog API permite automatizar.
PDP customizadas: ajustes de layout
O widget renderiza um botão "Provador virtual" próximo ao seletor de tamanho. Em temas Dawn, a posição padrão funciona. Em temas customizados ou themes pagos (Impulse, Empire, Symmetry, Flow), você pode ter que ajustar:
- Container alvo: o widget injeta no
<body>por padrão, mas o botão pode ser ancorado em qualquer container via atributodata-anchor. - Z-index: temas com modais customizados podem precisar ajustar para evitar sobreposição.
- Cor de marca: por padrão o widget herda variáveis CSS do tema; você pode forçar paleta via
data-theme="dark"oudata-theme="light".
A documentação completa de ancoragem e personalização está no painel da demo ao vivo.
Performance e Core Web Vitals
Shopify pontua agressivamente em Core Web Vitals (LCP, INP, CLS). Adicionar scripts de terceiros é sempre risco. O Provou foi engenheirado para zero impacto:
- 18 KB gzip: peso total do bundle.
- Carregamento async: não bloqueia o parse do HTML.
- Shadow DOM: render isolado, sem reflow do DOM principal.
- Lazy init: o widget só hidrata quando o usuário interage com o seletor de tamanho ou clica no botão.
- CDN edge: o script é servido de edges no Brasil para latência baixa.
Em testes via Lighthouse Mobile e PageSpeed Insights, lojas Shopify que instalam o Provou mantém scores idênticos pré e pós-instalação. Não há degradação de LCP nem CLS.
Como testar antes de publicar
- Use uma cópia do tema (Themes > Actions > Duplicate) para fazer alterações.
- Aplique senha temporária à loja (Online Store > Preferences > Restrict access) durante a homologação.
- Cole o snippet apontando para a demo do Provou ou para seu cadastro em modo sandbox.
- Teste navegação completa: home, listagem, PDP, carrinho.
- Abra DevTools, aba Network, e confirme que
v1.jscarrega 200 OK. - Verifique no painel do Provou se eventos chegam (widgetloaded, widgetopened, recommendation_computed).
- Se ok, publique o tema modificado.
Em qualquer momento você pode desativar o widget pelo painel (kill switch) sem editar código.
Resultados esperados
Lojas Shopify que instalam o Provou observam, em média:
- 18% de aumento de conversão em PDP após 30 dias.
- 42% de redução de devoluções por tamanho em janelas de 60 a 90 dias.
- Sub-200ms de latência mediana da recomendação.
- 0 mudança em Core Web Vitals.
Os números variam por modelagem, ticket médio e mix de catálogo. Para um cálculo personalizado, consulte o guia de ROI.
Para começar, abra o cadastro gratuito, instale o snippet em menos de cinco minutos, importe sua tabela e veja o widget rodando. Não há cartão, não há contrato. Se preferir comparar com outras plataformas, veja os guias de VTEX, WooCommerce e Magento no blog.
Métricas e analytics em Shopify
Depois que o widget está rodando, a próxima decisão é como medir o impacto. O Provou expõe cinco eventos no window.dataLayer (widget_loaded, widget_opened, chart_viewed, recommendation_computed, widget_closed) que você pode encaminhar a GA4, Meta Pixel, Klaviyo, Pinterest ou qualquer destino via Shopify Customer Events.
A instrumentação mínima recomendada acompanha:
- Taxa de exposição: visitantes da PDP que viram o botão do widget. Esperado: 100%, dado que o widget renderiza em todas as PDPs com tabela vinculada.
- Taxa de abertura: visitantes que clicaram no botão. Indicador de descoberta. Esperado: 8% a 18% da PDP.
- Taxa de completude: usuários que preencheram as quatro medidas e receberam recomendação. Esperado: 70% a 85% dos que abriram.
- Taxa de adoção da recomendação: usuários que selecionaram o tamanho recomendado pelo widget. Esperado: 65% a 80% dos que completaram.
- Conversão pós-widget: taxa de compra entre os que receberam recomendação. Compare com a taxa de compra dos que não usaram. Esperado: lift de 2 a 4 pontos percentuais.
Em Shopify Plus, a integração com Polaris Custom Events permite cruzar uso do widget com Customer Lifetime Value (CLV), retorno de cliente e cohort por categoria. Em GA4, configure o evento recommendation_computed como conversão secundária para acompanhar no funil de aquisição.
A maior parte das marcas que medem ativamente conseguem mostrar ROI positivo em 30 a 45 dias. Para o detalhe financeiro paralelo, consulte o guia de ROI.
Casos comuns em DTC e multimarca Shopify
Lojas Shopify de moda dividem-se em três perfis principais que cobrem 80% dos casos no Brasil:
Marcas DTC verticalizadas (jeans, alfaiataria, esportivo, beachwear). Caracterizam-se por catálogo enxuto (200 a 1.500 SKUs ativos), modelagem própria e identidade visual forte. Para esse perfil, o Provou rende mais quando a tabela é cuidadosamente padronizada (veja o guia de tabela de medidas). A recomendação por peça aproveita a modelagem proprietária, e a redução de devolução tipicamente fica acima de 35% em 90 dias.
Multimarcas Shopify (boutiques que vendem várias marcas, brechós digitais, marketplaces de nicho). Catálogo amplo (2.000 a 15.000 SKUs), modelagem heterogênea (cada marca tem sua tabela), maior tolerância a "tamanho aproximado". O desafio aqui é normalizar tabelas heterogêneas. A recomendação típica é começar com as marcas mais vendidas (top 20% do catálogo, geralmente 80% da receita) e expandir.
Marcas plus size e inclusivas em Shopify. Catálogo médio, alta sensibilidade a representatividade e modelagem. O Provou funciona muito bem aqui porque trabalha com medidas reais e não força sistemas de tamanhos genéricos. Veja o post sobre plus size para detalhes específicos.
Em todos esses casos, a instalação técnica via theme.liquid ou App Embed é idêntica. O que muda é o trabalho de catálogo. Para começar, abra o cadastro gratuito e veja a demo ao vivo.
Shopify entrega ao lojista de moda todo o necessário para subir uma loja sem dor. Acrescentar um provador virtual é um ajuste pequeno na PDP, com efeito desproporcionalmente grande em conversão e operação.