Ocultar a opções de pagamento através do Google Tag Manager

Este manual tem por objetivo orientar como ocultar de forma temporária ou definitiva alguma opção de pagamento no checkout  através do Google Tag Manager.

1. Acessar https://tagmanager.google.com/.

2. Criar uma nova conta ou criar um novo contêiner na conta existente:

3. Acessar o contêiner criado (verificar se esse contêiner é da mesma URL que será alterada, ex.: SITEDOCLIENTE.COM.BR)

4. Crie uma Nova Tag conforme o exemplo abaixo:

5. Adicionar um título para a Tag criada.

6. Acessar configuração da tag: Adicionar o tipo tag > HTML personalizado e inserir o código:

<style>

/* CHECKOUT - Ocultar boleto
-------------------------------------------------- */
.ip__form-control.chk__form-control.chk__payment-btn.boleto {
 display: none !important;
}
.chk__payment-btn.boleto {
 display: none !important; 
}

/* CHECKOUT - Substituir imagem de pagamento
-------------------------------------------------- */
.cart-chk__payment.u-in-blk.mid img {
 display: none !important;
}
.cart-chk__payment.u-in-blk.mid:after {
 content: "";
 top: 20px;
 position: relative;
 width: 290px;
 height: 60px;
 display: inline-block;
 background-image: url(https://www.ecommercebrasil.com.br/wp-content/uploads/2017/03/bandeiras-de-cartao-mundipagg.png);
 background-size: contain;
 background-repeat: no-repeat;
}

</style>

Ressaltando que para título de demonstração foi utilizado como exemplo boleto, para outras formas de pagamento deve se adicionar o elemento que deseja ocultar.

7. Acionamento: Adicionar o acionador Exibição de página para uma página específica como por exemplo: https://DOMINIODOCLIENTE.com.br/checkout, o caminho /checkout deve conter na URL, conforme imagem:

8. Imagem Formas de pagamento: o cliente deve produzir uma imagem nova (conforme a sua necessidade de pagamento) inteira e adicionar a URL da imagem com extensão .jpg na linha 22 do código acima, em background-image, ressaltamos que o tamanho (largura e altura) da imagem também deve ser observado e ajustado conforme necessidade, pelos atributos width e height. Outras partes e linhas do código não podem ser alteradas.

9. Caso não há necessidade de remover a imagem com as bandeiras de pagamento pode ser excluído do código da linha 09 em diante, permanecendo assim somente o botão Boleto (à vista) oculto.