Leve a Vizzoro para seu website.

Comece aqui

A Vizzoro permite que clientes coloquem um material real do seu catálogo na foto do próprio ambiente. Sua equipe gerencia os produtos no app Vizzoro. Seu website carrega o visualizador por um pequeno SDK JavaScript.

Instale o SDK

Adicione este código uma vez na página em que o cliente poderá abrir o visualizador. A chave pública foi criada para uso no navegador.

<script src="https://vizzoro-app.web.app/sdk.js" data-key="vz_pk_..."></script>
<script>
  Vizzoro.start({
    category: "floor",
    productId: "PRODUCT_ID",
    locale: "pt"
  });
</script>

Substitua PRODUCT_ID pelo ID do documento do produto no catálogo Vizzoro. Use o mesmo domínio que foi autorizado no app.

Referência do SDK

Vizzoro.start abre um visualizador acessível em tela cheia. Uma nova chamada substitui o visualizador atual.

Vizzoro.start({
  category: "floor",
  productId: "PRODUCT_ID",
  locale: "pt",
  onLeadCapture: ({ productId, jobId }) => {
    console.log("Visualization completed", productId, jobId);
  }
});

Chaves e domínios autorizados

Uma chave pública Vizzoro pode ficar no código do navegador porque tem uma finalidade limitada. Ela abre o visualizador apenas em um domínio aprovado.

• Crie chaves somente depois de adicionar todos os hostnames de produção e homologação.
• A Vizzoro valida a chave e o domínio do website sempre que o visualizador é aberto.
• Nunca coloque credenciais de serviço ou chaves não publicáveis no website.
• Crie uma chave nova e remova a anterior quando um domínio mudar de proprietário.

Use em uma página de produto

Coloque a chamada Vizzoro.start dentro do botão ou interação que o cliente usa para visualizar um material. Use o ID do produto exibido naquela página.

Solução de problemas