Elemento de botão de checkout dinâmico

Sobre o botão de checkout dinâmico

O processo de Botão de checkout dinâmico Serve como uma alternativa ao botão "Adicionar ao carrinho", permitindo que os clientes ignorem a etapa do carrinho e façam compras diretamente.

Quando o botão de finalização de compra dinâmico é colocado dentro de um Módulo de produto, usa apenas o produto e a variante selecionados nesse módulo Para iniciar o processo de finalização da compra.

Na prática, isso significa:

• Os clientes podem adquirir apenas uma variante selecionada do produto.
• Ao clicar no botão, o sistema não utiliza o carrinho de compras.
• Quaisquer produtos que tenham sido adicionados anteriormente ao carrinho são completamente ignorados e removidos do processo de finalização da compra.
• Os clientes são redirecionados diretamente para o Checkout da Shopify, exibindo apenas a variante de produto selecionada no módulo de Produto atual.

Por exemplo, se um cliente já adicionou o Produto A ao carrinho, e em seguida visita outro produto e clica no botão de finalização de compra dinâmica, apenas o produto exibido no módulo de produto atual aparecerá na finalização da compra. O Produto A não será incluído.

Existem dois tipos principais de botões de finalização de compra dinâmica.

Botão de marca

Botões de marca aparecem quando métodos de checkout acelerado de terceiros compatíveis com a Shopify estão habilitados na sua loja. Esses botões exibem os logotipos oficiais dos provedores, facilitando o reconhecimento e a finalização da compra pelos clientes com o serviço de sua preferência.

Os provedores suportados incluem:

• Amazon Pay
• Apple Pay
• Google Pay
• PayPal
• Shop Pay
• Venmo

Se você vê um Shop Pay, Apple Pay, ou um botão personalizado semelhante na sua página ativa, esse é o Botão de Finalização de Compra Dinâmica, que exibe automaticamente o método de finalização de compra acelerada disponível para o cliente.

Para mais informações, você pode conferir aqui Artigo sobre Shopify.

Botão sem marca 

Botões sem marca exibem o texto "Compre agora" quando nenhum gateway de pagamento está habilitado. Assim que o cliente clica, ele pula o carrinho e é levado diretamente para o Checkout da Shopify.

A exibição de botões sem marca pode variar dependendo de vários fatores, como:

• Configurações de pagamento no seu administrador do Shopify
• Dispositivo e navegador do cliente
• Histórico de pagamentos anteriores do cliente

Adicione um elemento de botão de checkout dinâmico à sua página

Para adicionar o botão de checkout dinâmico à sua página, siga estas etapas:

Etapa 1: Vou ao Painel GemPages > PÁGINAS e selecione a página na qual deseja trabalhar para entrar no Editor.

Passo 2: Na barra lateral esquerda, digite Check-out Dinâmico na barra de pesquisa, arraste e solte o elemento em um Módulo de Produto, colocando-o no seu local preferido.

Passo 3: Clique no elemento para abrir suas configurações. A partir daqui, você pode personalizá-lo do seu jeito. Configurações e Avançado Guias.

Configurar a guia Configurações

O processo de Configurações A guia fornece uma variedade de opções para configurar e personalizar o comportamento e a aparência do botão de checkout dinâmico.

Fonte do produto

Como esse elemento está aninhado no módulo Produto, a origem do produto será sincronizada automaticamente com o módulo.

Entretanto, se você preferir outro produto, clique no produto atual para gerenciá-lo no elemento Produto.

Dimensões:

Sob o Dimensões: seção, ajuste a largura, altura e preenchimento do botão:

• Largura: Escolha entre as opções suspensas, incluindo Ajustar conteúdo (Automático), Completo (100%), Pequeno (100px), Médio (116px) e Grande (132px). Você também pode inserir a porcentagem exata desejada na caixa.
• Altura: Personalize a altura ou selecione entre as opções disponíveis: Ajustar conteúdo (Automático), Pequeno (28px), Médio (36px) e Grande (44px).
• padding: Clique na caixa “+ Adicionar…” para abrir o painel de configurações do preenchimento. 

Contexto

O GemPages permite que você defina o fundo do botão escolhendo uma cor ou usando uma imagem:

• Cor: Abra o painel de configurações para selecionar a cor preferida para o seu botão. Você pode usar um fundo de cor sólida ou um gradiente.

• Imagem: Carregue uma nova imagem ou selecione-a na sua galeria de mídia. Em seguida, modifique a imagem como preferir no painel de configurações.

Shape

Para melhorar a aparência do botão, você pode adicionar uma forma, ajustar o raio do canto e adicionar um efeito de sombra no Shape seção:

• Fronteira: Escolha a cor, a espessura e o traço da borda (linha, traço ou ponto)

• Canto: Ajuste o raio do canto da borda
  • Valores mais altos = cantos mais arredondados
  • 0 valor = cantos agudos e quadrados
  • Você pode vincular ou desvincular os cantos para aplicar o mesmo raio a todos os lados ou definir cada canto individualmente.

Por exemplo, definimos o raio do canto como 100 para criar uma aparência de botão em formato de pílula.

• Shadow: Adicione profundidade ao seu botão aplicando uma sombra projetada, o que faz o botão se destacar e garante uma aparência mais dinâmica.

Texto

Sob o Texto seção, você pode personalizar o texto do botão do seu jeito. Clique Mostre mais para ver todas as configurações de texto.

Efeito

A partir daqui, adicione um efeito de foco ao seu botão. Personalize a aparência do botão quando os visitantes passarem o mouse sobre ele.

Alinhar

Se a largura do seu botão for menor que 100%, você poderá alterar o alinhamento do botão: alinhado à esquerda, centralizado ou alinhado à direita.

Configurar a guia Avançado

Para uma personalização mais avançada, navegue até o Avançado aba e siga as instruções em Este artigo.

Você também pode encontrar dicas mais úteis e tutoriais em vídeo em Academia GemPages.

Perguntas frequentes sobre o botão de finalização de compra dinâmico

1. Qual a diferença entre "Adicionar ao carrinho" (redirecionando para a finalização da compra) e o botão de finalização de compra dinâmica?

Os dois botões pular o carrinho de diferentes maneiras.

• Adicionar ao carrinho → Redirecionar para o checkout Ainda utiliza o carrinho. Apenas ignora visualmente a página do carrinho, portanto todos os itens já presentes no carrinho são incluídos na finalização da compra.
• Botão de checkout dinâmico Ignora completamente o carrinho. Envia apenas o produto exibido no módulo de Produtos atual diretamente para a finalização da compra e ignora todos os outros itens no carrinho.

Exemplo:

Um comprador já adicionou Produto A para o carrinho.
Eles então vão para Produto B e clique no botão de chamada para ação para ir para o checkout.

• Se a página usar Adicionar ao carrinho → Finalizar compra, ambos o Produto A e o Produto B aparecerá na página de finalização da compra.
• Se a página usar o Botão de checkout dinâmico, somente o Produto B aparecerá na finalização da compra. O produto A foi omitido e não está incluído.

2. Qual a diferença entre um botão de finalização de compra dinâmico com marca própria e um sem marca?

• Botões de marca Exibir os logotipos oficiais de pagamento (Shop Pay, Apple Pay, PayPal, etc.) quando esses gateways de pagamento estiverem ativados em sua loja Shopify.
• Botões sem marca exibir o texto "Compre agora" quando não houver métodos de pagamento acelerado disponíveis.

3. Onde devo colocar o botão de finalização de compra dinâmico no meu layout?

O processo de Botão de checkout dinâmico deve estar aninhado dentro de um Módulo de produto Para que funcione corretamente, se você ainda não tiver um elemento de produto na sua página, adicione um primeiro e, em seguida, arraste e solte o botão dentro dele.

4. Posso personalizar o estilo e o tamanho do botão de finalização de compra dinâmico?

Sim. Você pode ajustar o largura, altura, preenchimento, cor de fundo, raio do canto e sombra. na aba Configurações. Para adicionar animações ao passar o mouse ou efeitos avançados, abra o Guia Avançado Para opções de personalização mais detalhadas.

5. Por que o botão "Comprar e Pagar" aparece em vez do botão "Adicionar ao Carrinho"?

Isso acontece quando o Botão de checkout dinâmico está ativo. Então, o Shopify exibe automaticamente um checkout acelerado personalizado (como Shop Pay or Apple Pay) em vez do botão padrão "Adicionar ao carrinho".

Para exibir apenas "Adicionar ao carrinho", desative Shop Pay para Configurações do Shopify › Pagamentos › Finalização de compra acelerada ou remova o elemento Botão de Finalização de Compra Dinâmica do seu layout GemPages.