Uma linha no <head> do tema e pronto. O mK Fashion+ tem módulo dedicado à Magazord que lê o SKU da derivação selecionada, adiciona pela API de carrinho da própria plataforma e ainda captura a receita na página de confirmação do pedido, sem pixel extra.
No <head> do tema da loja, em todas as páginas.
<script src="https://unpkg.com/mk-sdk-git@1/dist/mk-sdk.js"
data-mk-project="SEU_PROJECT_ID"
data-mk-product="mk-fashion"
async></script>Troque SEU_PROJECT_ID pelo identificador do seu projeto. O atributo async garante que a tag não bloqueia o carregamento da página, e @1 fixa a major da versão: você recebe correção sem risco de um release novo mudar a loja sem aviso.
A metaKosmos cria o projeto e envia o identificador. Ele é o único valor que muda na tag, e não é segredo: vai no HTML público da loja.
Com um usuário e senha de API gerados no painel da Magazord, o catálogo é importado: produtos, derivações, preços, marca, categorias, estoque e as fotos reais de cada derivação. A re-sincronização roda em horário configurado por projeto, sem ninguém reimportar nada.
A tag precisa valer em todas as páginas, não só na de produto: é assim que o funil inteiro, da visita à compra, é medido. Se a sua operação usa gerenciador de tags, configure o disparo para todas as páginas.
Com o projeto configurado, o botão de provar aparece sozinho ao lado do comprar, nos produtos que têm provador. Troque a derivação, abra o provador, escolha um tamanho, adicione e confira o contador do carrinho no topo.
A confirmação do pedido é o que fecha a medição de receita. Um pedido de teste confirma valor e número do pedido ponta a ponta. A agregação do painel roda de hora em hora, então o número aparece na hora seguinte, não na mesma.
Na Magazord a galeria real não está no detalhe do produto, está ligada a cada derivação. O conector busca as imagens por derivação, então o provador recebe a foto da cor certa em vez das imagens de conteúdo da descrição.
A adição usa a rota de carrinho da própria Magazord com o código da derivação escolhida, e confere a resposta antes de dar a operação por concluída. Não é clique simulado em botão.
A página de confirmação da Magazord não publica os dados de compra no dataLayer. O adapter lê o valor pago e o número do pedido direto da página, então a receita chega ao painel sem instalar mais nada.
O número do pedido é um número grande e sem centavos, e uma leitura ingênua o confundiria com um valor. O adapter só aceita como receita valores em formato monetário de verdade, com centavos.
Como a adição acontece por API, o contador do topo não se atualiza sozinho: ele é renderizado no carregamento da página. O adapter incrementa o contador na hora e depois reconcilia com a contagem real, então o cliente vê que algo aconteceu.
O código lido é o da derivação atualmente selecionada e acompanha a troca na página. O provador abre a peça que está na tela, não o produto-pai.
Depois de adicionar, o SDK abre o carrinho-rápido do cabeçalho em vez de levar o cliente para a página de carrinho. O provador segue aberto para a avaliação.
A integração tem duas metades, e elas resolvem problemas distintos.
O catálogo é servidor com servidor. Com um usuário e senha de API gerados no painel, a metaKosmos lê a API REST da Magazord e importa produtos, derivações, preços, marca, categorias e estoque. A re-sincronização é agendada por projeto.
Aí mora uma particularidade da plataforma que vale conhecer: a galeria de fotos não vem no detalhe do produto. As imagens de verdade ficam relacionadas a cada derivação, e a descrição costuma trazer só imagens de conteúdo. O conector busca a mídia por derivação justamente por isso, senão o provador receberia banner de marketing no lugar da foto da peça.
A loja é a tag no tema. Ela roda no navegador do cliente final, reconhece a página de produto, injeta o botão e adiciona ao carrinho. As duas metades se encontram no código da derivação.
O mk-sdk é um script único que roda em todas as páginas da loja. Ao carregar, ele identifica a Magazord pelos próprios recursos que a plataforma serve na página e passa a usar o módulo dedicado a ela.
A partir daí, tudo que o provador precisa vem da página: o código da derivação selecionada e o caminho de adicionar ao carrinho.
Na Magazord, o que tem código, preço e estoque é a derivação. Um produto em várias cores e tamanhos é um produto-pai e várias derivações.
O adapter lê sempre o código da derivação selecionada, que a plataforma atualiza quando o cliente troca a variante na página. É esse código que o catálogo do provador usa, então o cadastro acompanha o jeito que a sua loja já nomeia as peças.
Medir compra é onde a maioria das integrações falha em silêncio: o provador funciona, a loja vende, e o painel mostra receita zero. Quando isso acontece, qualquer cálculo de retorno sobre o investimento fica impossível.
Na Magazord, a página de confirmação não publica os dados da compra no dataLayer, que seria a fonte mais cômoda. Em vez de exigir um script extra da loja, o adapter lê o valor pago e o número do pedido direto do conteúdo da página de confirmação.
Há um cuidado específico aí: o número do pedido é um inteiro longo e passaria por valor numa leitura ingênua. Por isso só entra como receita o que estiver em formato monetário com centavos, e o maior valor do resumo é tomado como total pago.
Na Magazord, o carrinho e a confirmação do pedido ficam os dois sob o mesmo caminho de checkout. Uma classificação genérica marcaria a página de confirmação como início de checkout, e a compra nunca seria contada como compra.
O SDK trata os dois caminhos separadamente de propósito. É o tipo de detalhe que não aparece em teste rápido e só se manifesta como receita faltando semanas depois.
O caminho completo é validado em loja Magazord em produção: adição pela API, leitura do total do carrinho e captura de valor e número do pedido na confirmação.
Para conferir na sua loja antes de qualquer alteração, existe uma extensão de navegador que injeta o SDK em qualquer site e mostra a detecção de plataforma, o código resolvido e o fluxo de carrinho. Dá para validar a integração inteira sem tocar no tema.
Sim, com módulo dedicado. O SDK reconhece a loja sozinho e usa a API de carrinho da própria plataforma, além de capturar a receita na página de confirmação do pedido.
Não. É uma linha no <head> do tema, válida para todas as páginas. Nada é instalado na loja.
Não. Diferente de outras plataformas, na Magazord a mesma tag cobre a confirmação do pedido: o adapter lê o valor pago e o número do pedido direto da página.
Pelo código da derivação, não pelo código do produto-pai. É o mesmo código que a sua loja já usa para a variante de cor e tamanho.
Não. Com um usuário e senha de API gerados no painel da Magazord, o catálogo é importado com produtos, derivações, preços, marca, categorias, estoque e as fotos de cada derivação, e re-sincronizado em horário configurado.
Sim. Como a adição é por API, o contador do topo não se atualizaria sozinho, então o SDK o incrementa na hora e depois confere com a contagem real do servidor.