Todas as coleções
Shopify
Como configurar o Checkout da Yampi na Shopify?
Como configurar o Checkout da Yampi na Shopify?

Passo a passo de como instalar o Checkout transparente da Yampi em sua loja da Shopify.

Atualizado há mais de uma semana

A Shopify é uma plataforma de lojas virtuais que oferece uma variedade de recursos, onde você pode, inclusive, instalar o nosso Checkout transparente, que é líder nacional em vendas e assim alavancar suas conversões, melhorando a experiência de compras dos consumidores na etapa final da sua jornada.

Nesse artigo, vamos mostrar como funciona a integração e todo o passo a passo pra você configurar o Checkout em sua loja da Shopify .

💡 Atenção

Embora a inclusão do domínio não seja obrigatória na Yampi, caso você utilize seu domínio próprio na Shopify, é necessário cadastrar também em nosso painel, acessando Configurações Domínios. Isso evita problemas na integração e no redirecionamento do checkout.

Como funciona a integração Yampi + Shopify?

A Yampi será o Checkout da sua loja, ou seja: A partir do momento de instalação, o checkout nativo da sua loja será substituído pelo Checkout da Yampi, e os pedidos serão realizados através da nossa página de finalização.

A integração pode:

  • Receber Produtos (Apenas recebemos do Shopify, não enviamos);

  • Enviar Pedidos (Apenas enviamos os pedidos para lá, não recebemos);

  • Receber atualizações de rastreio;

  • Receber atualizações de preço e alteração dos produtos;

Todos os meios de pagamento e afiliações que irão processar o pagamento deverão ser configurados do lado da Yampi, bem como cupons e promoções configurados.


Como instalar o Checkout da Yampi na Shopify?

Pra instalar o checkout da Yampi em sua loja Shopify, é necessário seguir esses passos:

Passo 1 - Criar o app personalizado;

Passo 2 - Configurar os escopos (permissões) do App;

Passo 3 - Instalar o aplicativo e obtenha os tokens de acesso à API;

Passo 4 - Instalar o Checkout.

Passo 1 - Criar o App privado

1. Acesse o painel administrativo da Shopify;

3. Clique em “Desenvolver apps”.

4. Clique “Criar um app”.

⚠️ Se está criando um app pela primeira vez, é necessário "Permitir o desenvolvimento de apps personalizados" na tela a seguir.

5. Preencha os campos a seguir. Em seguida, clique em ''Criar app''.

  • Nome do App: Você pode colocar o nome que preferir. Sugestão: Checkout Yampi

  • Desenvolvedor do app: Selecione o usuário que deseja atribuir a função. O desenvolvedor do aplicativo pode ser o proprietário da loja ou qualquer conta de equipe ou colaborador com a permissão Desenvolver aplicativos.

Passo 2 - Configurar os escopos (permissões) do App.

1. Clique em "Configurar escopos do API Admin";

2. Selecione os escopos (permissões) de API abaixo. Lembre-se que você deve inserir apenas as que mencionamos, permissões incorretas podem causa incompatibilidade na integração;

É necessário que você atribua as permissões ”Read and Write” aos itens:

  • Pedidos (Orders);

  • Produtos (Products);

  • Temas (Themes).

3. Clique em "Salvar".

Passo 3 - Instalar o aplicativo e obtenha os tokens de acesso à API

1. Vá em "Credenciais de API”→ "Instalar App";

2. Você receberá suas credenciais de acesso à API, que deverão ser utilizadas no próximo passo.

⚠️ Atenção: O Token é revelado apenas uma vez. Ele concede acesso à API para dados confidenciais da loja. Após revelar o token de acesso, anote ou registre o token em algum lugar seguro para que você possa consultá-lo novamente.

Passo 4 - Instalar o Checkout

2. Preencha os campos a seguir.

⬇️ Clique na setinha de cada um pra abrir o conteúdo*

Pular carrinho

Selecione essa opção se deseja pular o carrinho de compras e ser redirecionado para o checkout.

Regra de estoque

Selecione se deseja dar baixa ou não no estoque do Shopify. Para mais informações, leia esse artigo: Como funcionam as regras de estoque - Shopify

URL da loja

Preencha a URL de sua loja com o domínio myshopify.com
Exemplo: sualoja.myshopify.com

⚠️Atenção: Você deve inserir a URL original do seu Shopify. Para verificá-la, acesse: "Configurações" → "Domínios" → Copie o domínio original.

Clique na imagem para ver com mais detalhes*

Token de acesso

Colar a credencial "Token de acesso'' gerada no Shopify anteriormente.

Chave de API

Colar a credencial "Chave de API'' gerada no Shopify anteriormente.

Chave secreta da API

Colar a credencial "Chave secreta da API'' gerada no Shopify anteriormente.

📌Importante saber: No campo ''URL da loja'' você precisa inserir a URL original da sua loja, pois a URL incorreta pode gerar incompatibilidade de credenciais.

Acesse "Configurações" → "Domínios" → Copie o domínio original.

Exemplo das credenciais do Shopify:

Removendo o botão dinâmico "Compre Já" e desativando o carrinho AJAX

Para que o checkout da Yampi funcione corretamente, é necessário desativar o botão dinâmico Compre já do Shopify, assim como o carrinho AJAX, sendo esse um estilo de carrinho que abre na mesma página.

Como desativar o botão Compre já?

Nesse vídeo, Ralph Almeida ensina como desativar o botão Compre já.

Passo 1 - Em muitos temas, o botão dinâmico é desativado indo no admin do Shopify, navegue em "Loja virtual" → "Temas" → "Personalizar".

Passo 2 - Navegue até no template de Página de Produto:

Passo 3 - Vá até a seção Página de produto:

Passo 4 - Desmarque o checkbox do botão dinâmico de compra:

Como desativar o carrinho AJAX?

O carrinho ajax é uma janela/popup lateral que se abre quando o produto é adicionado ao carrinho. Ele é um recurso próprio do Shopify e você precisa apenas desativar esse recurso, para que seu cliente passe realmente pela página de carrinho, ao invés de abrir esse pop-up.

Abaixo mostramos como desativá-los em alguns temas:

Booster

Passo 1 - Dentro do admin do Shopify, navegue em Loja Virtual → Temas → Customizar

Passo 2 - Navegue no template até Página de Produto → selecione Direct to Cart > desative "Show Dynamic checkout button"

Brooklyn

O Checkout da Yampi não funciona se você utilizar o carrinho ajax do Shopify. Para desabilitar esse recurso no tema Brooklyn, faça o seguinte:

Passo 1 - Dentro do admin do Shopify, navegue em Loja Virtual → Temas → Customizar


Passo 2 - No canto inferior, clique em Theme Settings

Passo 3 - No menu lateral a direta, clique em CART PAGE e altere o Cart Type para a opção Page

Debut

Passo 1 - Dentro do admin do Shopify, navegue em Loja Virtual → Temas → Customizar

Passo 2 - Navegue no template até Página de Produto:

Passo 3 - No menu lateral esquerdo, selecione Product Pages:

Passo 4 - No menu lateral direito, desmarque a opção Show dynamic checkout button e salve:

Venture

Passo 1 - Dentro do admin do Shopify, navegue em Loja Virtual → Temas → Customizar

Passo 2 - Navegue no template até Página de Produto:

Passo 3 - No menu lateral esquerdo, selecione Product Pages e então desmarque a opção Show dynamic checkout button e salve.



Warehouse

Passo 1 - Dentro do admin do Shopify, navegue em Loja Virtual → Temas → Customizar


Passo 2 - No canto inferior, clique em Theme Settings

Passo 3 - No menu lateral a direta, clique em CART e altere o Cart Type para a opção Page

Pronto! Agora a sua loja já está com o Checkout da Yampi ativo 🎉

⚠️ Atenção⚠️


Caso realize todas essas etapas, e seu checkout, embora instalado, não funcionar, pode ser que seu tema seja incompatível com o Checkout. Para averiguarmos, pedimos que abra um chamado com o nosso suporte através do chat ou e-mail.

Em caso de dúvidas, clique no balãozinho de atendimento em seu painel ou nos encaminhe pelo e-mail [email protected] 😉


Artigos relacionados

Respondeu à sua pergunta?