Artigos sobre: Checkout CartPanda

Como adicionar Tag de Aprovação no Checkout

Tag de Aprovação



Você pode inserir uma tag de Tempo de Aprovação nos seus métodos de pagamento, diretamente no Checkout, como mostra o print abaixo.

Basta acessar Loja Online > Configurações > Scripts Adicionais, e adicionar em Checkout > Head o seguinte script:



Caso use PIX em sua loja, adicione o seguinte script:

<script>
/* PagamentoCartaoCredito*/
const elementoPagamentoCartaoCredito = document.getElementById('heading1');
const elementoParagrafoCartaoCredito = document.createElement("p");
const textoCartaoCredito = document.createTextNode("APROVAÇÃO IMEDIATA");
elementoParagrafoCartaoCredito.appendChild(textoCartaoCredito);
elementoPagamentoCartaoCredito.prepend(elementoParagrafoCartaoCredito);
elementoParagrafoCartaoCredito.classList.add("aprovacao-pagamento");
/* PagamentoPix*/
const elementoPagamentoPix = document.getElementById('headingPix');
const elementoParagrafoPix = document.createElement("p");
const textoPix = document.createTextNode("APROVAÇÃO IMEDIATA");
elementoParagrafoPix.appendChild(textoPix);
elementoPagamentoPix.prepend(elementoParagrafoPix);
elementoParagrafoPix.classList.add("aprovacao-pagamento");
/* PagamentoBoleto*/
const elementoPagamentoBoleto = document.getElementById('headingTwo');
const elementoParagrafoBoleto = document.createElement("p");
const textoBoleto = document.createTextNode("APROVAÇÃO EM 3 DIAS");
elementoParagrafoBoleto.appendChild(textoBoleto);
elementoPagamentoBoleto.prepend(elementoParagrafoBoleto);
elementoParagrafoBoleto.classList.add("aprovacao-pagamento");
elementoParagrafoBoleto.classList.add("aprovacao-pagamento--boleto");
</script>

<style>
p.aprovacao-pagamento {
display: block;
width: fit-content;
top: 5px;
background: #31BEB0;
color: white;
border-radius: 5px;
padding: 0 8px;
font-weight: bolder;
margin-bottom: 8px;
}
p.aprovacao-pagamento--boleto{
background: #A3A3A3;
}
</style>


Caso não use PIX, adicione o seguinte script:

<script>
/* PagamentoCartaoCredito*/
const elementoPagamentoCartaoCredito = document.getElementById('heading1');
const elementoParagrafoCartaoCredito = document.createElement("p");
const textoCartaoCredito = document.createTextNode("APROVAÇÃO IMEDIATA");
elementoParagrafoCartaoCredito.appendChild(textoCartaoCredito);
elementoPagamentoCartaoCredito.prepend(elementoParagrafoCartaoCredito);
elementoParagrafoCartaoCredito.classList.add("aprovacao-pagamento");
/* PagamentoBoleto*/
const elementoPagamentoBoleto = document.getElementById('headingTwo');
const elementoParagrafoBoleto = document.createElement("p");
const textoBoleto = document.createTextNode("APROVAÇÃO EM 3 DIAS");
elementoParagrafoBoleto.appendChild(textoBoleto);
elementoPagamentoBoleto.prepend(elementoParagrafoBoleto);
elementoParagrafoBoleto.classList.add("aprovacao-pagamento");
elementoParagrafoBoleto.classList.add("aprovacao-pagamento--boleto");
</script>

<style>
p.aprovacao-pagamento {
display: block;
width: fit-content;
top: 5px;
background: #31BEB0;
color: white;
border-radius: 5px;
padding: 0 8px;
font-weight: bolder;
margin-bottom: 8px;
}
p.aprovacao-pagamento--boleto{
background: #A3A3A3;
}
</style>

Atualizado em: 04/02/2023

Este artigo foi útil?

Compartilhe seu feedback

Cancelar

Obrigado!