A Provedly carrega nas lojas Shopify por um embed de app do tema, que você ativa no editor de temas, e não por uma tag de script injetada no seu tema. O embed sobrevive a trocas de tema, pode ser ligado e desligado sem mexer em código e é o método para o qual a Shopify agora direciona os apps. Este post explica a diferença, o que ela significa para a velocidade da página e a única situação em que uma tag de script simples ainda é a ferramenta certa.
Duas formas de um app chegar à sua loja
Historicamente, os apps da Shopify adicionavam JavaScript a uma loja chamando a ScriptTag API. O app registrava uma URL, e a Shopify injetava em todas as páginas um <script> apontando para ela. Funcionava, e é assim que muitos apps antigos de pop-up de vendas ainda operam.
As extensões de app de tema chegaram depois. O app entrega um pequeno pacote que fica disponível dentro do editor de temas em App embeds. O lojista o ativa, e o próprio tema o carrega na renderização. A Shopify descontinuou a abordagem ScriptTag para apps novos em temas Online Store 2.0, e espera-se que os apps migrem para extensões.
| Embed de app do tema | Tag de script (legado) | |
|---|---|---|
| Como você ativa | Botão no editor de temas | O app liga durante a instalação |
| Visível no editor de temas | Sim, com configurações | Não |
| Sobrevive à troca de tema | Sim, reativando no tema novo | Geralmente, mas pode ficar órfã |
| Pode deixar código para trás ao desinstalar | Não | Às vezes |
| Recomendação atual da Shopify | Sim | Descontinuada para apps novos |
Por que o embed é melhor para o lojista
Você controla. O botão fica junto das outras configurações do tema. Se quiser pausar a prova social por um dia, desliga e salva. Não precisa desinstalar o app, perder os seus dados nem esperar o suporte.
É visível. Tags de script são invisíveis para o lojista. Mais de um dono de loja já descobriu um app esquecido ainda carregando código meses depois de ter parado de pagar por ele. Um embed aparece no editor com o nome do app.
Respeita os limites do tema. O embed da Provedly renderiza dentro de um Shadow DOM. O CSS do seu tema não consegue mudar o estilo da notificação por acidente, e o CSS da notificação não vaza para a sua vitrine de produtos. Tags de script também podem fazer isso, mas os embeds tornam esse o padrão.
Desinstalação limpa. Quando você remove o app, o embed some. Não sobra nenhum trecho em theme.liquid para procurar e apagar.
O que isso significa para o desempenho
O embed carrega um script de cerca de 6 KB com gzip, de forma assíncrona, depois do conteúdo principal da página. O widget então espera o atraso configurado (3 segundos por padrão) antes de mostrar qualquer coisa. Os Core Web Vitals não são afetados de forma relevante por um script adiado desse tamanho, e o Shadow DOM evita qualquer recálculo de layout dos elementos do seu tema quando uma notificação aparece.
A ressalva honesta é que qualquer script adicionado tem algum custo. Se você roda uma dúzia de apps que adicionam 6 KB cada, isso se acumula. Mantemos o nosso pequeno e com uma única requisição.
De onde vêm os dados é outra questão
O método de carregamento diz respeito a como o widget chega à página. Ele não diz nada sobre se as compras exibidas são reais. Um embed pode mostrar um número de "pessoas vendo" digitado à mão tão facilmente quanto uma tag de script.
O embed da Provedly só marca compras como verificadas quando elas chegaram pelo webhook de pedidos assinado da Shopify. Todo o resto é rotulado: "Sample" para linhas adicionadas à mão, "Imported" para registros via CSV e API. O contador de visitantes é uma contagem real dos visitantes na página nos últimos 90 segundos e se esconde abaixo de um mínimo em vez de inflar o número. Para o argumento completo sobre por que essa distinção importa, leia /pt/blog/shopify-sales-pop-real-orders.
Quando uma tag de script ainda faz sentido
A tag de script da Provedly existe para sites que não estão na Shopify: WordPress, Webflow, lojas próprias, um app Next.js, qualquer coisa que permita adicionar uma linha à página. É o mesmo script de ~6 KB, com o mesmo Shadow DOM e a mesma segmentação por URL e por dispositivo.
Na Shopify especificamente, há um cenário em que você pode recorrer a ela: um tema vintage, anterior ao Online Store 2.0, que não suporta embeds de app. Se o seu editor de temas não tem a seção App embeds, essa é a sua situação. Você pode colar o script da Provedly no theme.liquid antes da tag de fechamento </body> e ele vai funcionar. Saiba que uma atualização do tema pode sobrescrevê-lo, e que você vai precisar removê-lo à mão se deixar de usar a Provedly.
A nossa recomendação nesse caso é planejar a atualização do tema. Além dos embeds de app, os temas 2.0 trazem seções em todas as páginas e melhor desempenho, e a maioria dos lojistas em temas vintage está deixando valor na mesa por motivos que não têm nada a ver com prova social.
Conferindo qual você tem
Abra o editor de temas. Se a barra lateral esquerda tem um painel App embeds e a Provedly aparece nele, você está no embed. Se não, procure "provedly" no theme.liquid para ver se existe um script manual. Uma loja nunca deve ter os dois; se tiver, você vai ver notificações duplicadas, e a solução é remover o script manual e manter o embed.
O /pt/blog/shopify-setup-guide mostra passo a passo como ativar o embed.
Perguntas frequentes
Troquei de tema e as notificações pararam. Perdi os meus dados?
Não. Os embeds de app são uma configuração por tema, então você precisa ativar a Provedly no editor do tema novo. Os seus widgets, compras e página de verificação continuam iguais.
Posso pré-visualizar o embed primeiro num tema não publicado?
Sim. Abra o tema não publicado no editor, ative o embed e use a pré-visualização do editor. Ele só chega aos compradores reais quando você publicar esse tema.
O embed adiciona algum cookie?
O widget mantém um identificador de visitante próprio (first-party) para aplicar os limites por sessão e atribuir os pedidos assistidos pela prova dentro de uma janela de 30 dias. Ele não carrega rastreadores de terceiros.
Ative o embed no seu editor de temas hoje; o plano Free em /pt/pricing basta para começar.