Comportamento ao confirmar pagamento

Você pode definir comportamentos diferentes na tela de sucesso quando um pagamento é confirmado no WooCommerce.

Isso é útil se desejar redirecionar o cliente para outra página, ou simplesmente executar um código JavaScript para executar alguma integração ou mesmo logar a conversão no Google Analytics.

Nas configurações Gerais do plugin PagBank Connect você tem a opção de configurar o Comportamento ao confirmar pagamento.

As opções são:

• Mostrar que o pedido foi pago - A tela de sucesso normal será exibida. No caso de pedidos com pix, o qrCode de pagamento será omitido e uma mensagem de que o pagamento foi concluído é exibida. Este comportamento sempre ocorrerá, mesmo que outra opção tenha sido selecionada e ocorra em seguida.
• Redirecionar para outra URL - Permite redirecionar o cliente para qualquer outra URL dentro ou fora de sua loja.
• Executar código JavaScript - Permite executar um ou mais códigos JavaScript quando o pagamento for confirmado. Não é necessário adicionar tags <script...>.

Note que pedidos feitos com Boleto nunca irão disparar tais eventos, pois o pedido ficará com status pendente por um tempo maior do que ocorre em pedidos com PIX ou Cartão de crédito.

Uma outra exceção também é aplicada para os casos de pedidos com Cartão de Crédito que entram em análise manual de fraude/risco. Embora raros, estes casos também não irão disparar os eventos acima pois a confirmação ocorrerá depois do cliente já ter saído da tela de sucesso.

Placeholders disponíveis

Tanto no campo de URL como dentro do JavaScript você pode inserir {placeholders} que serão substituídos por valores dinâmicos e podem ser úteis na sua integração.

Os placeholders disponíveis são:

• {paymentMethod} - método de pagamento usado. (ex: rm-pagbank-pix, rm-pagbank-cc, rm)
• {orderTotal} - valor total do pedido. (ex: 48.55)
• {orderId} - número do pedido. (ex: 6891)
• {customerName} - nome do cliente. (ex: João Roberto)
• {customerEmail} - e-mail do cliente.

Note que alguns valores são do tipo string e você deve tratá-los em seu código javascript. Exemplo:

console.log('Pedido Realizado', {orderId}, '{paymentMethod}');

Se desejar estender e adicionar novos placeholders com base no pedido, adicione um filtro (veja como) para pagbank_connect_order_placeholders. Este filtro receberá o $order_id do pedido finalizado.

Exemplos de JavaScript

Conversão Google Analytics

gtag('event', 'purchase', {
"transaction_id": "{orderId}",
"affiliation": "Loja Online",
"value": {orderTotal},
"currency": "BRL",
});

Conversão Facebook Pixel

fbq('track', 'Purchase', {
value: {orderTotal},
currency: 'BRL',
content_ids: '{orderId}',
content_type: 'product',
order_id: '{orderId}'
});

Hotjar

hj('tagRecording', ['purchase', '{orderId}']);

Google Tag Manager

dataLayer.push({
'event': 'purchase',
'transactionId': '{orderId}',
'transactionTotal': {orderTotal},
'transactionProducts': [{
'sku': '{orderId}',
'name': 'Order {orderId}',
'price': {orderTotal},
'quantity': 1
}]
});

* Os exemplos acima foram gerados por IA e nem todos foram testados. Por favor reporte possíveis erros ou melhorias nos comentários abaixo.

Como testar

Você pode realizar um pedido PIX usando uma Connect Key de testes (Sandbox) com valor inferior a R$100. Este pedido será aprovado na hora, e após cerca de 10 segundos na tela de sucesso a confirmação de pagamento ocorrerá e a ação definida acontecerá.

Em caso de erro no seu código JavaScript, uma mensagem será exibida no console do navegador conforme exemplo abaixo (JavaScript Personalizado contém erros):