FernandoAcosta.Net

Como trocar os ícones de Pix, boleto e cartão

1 min de leituraAtualizado há 2 semanas3.0.1

Os ícones do simulador são SVGs dentro do plugin. O filtro wc_installments_simulator_icon troca qualquer um deles, em todos os modelos de exibição e no carrinho.

Onde colocar o código

No functions.php do tema filho ou num plugin de snippets. Não edite os arquivos do plugin.

O que o filtro recebe

Parâmetro Tipo Descrição
$icon string SVG atual.
$type string pix, ticket (boleto) ou card (cartão).

Retorno: string com o SVG. Retorne '' pra não mostrar o ícone.

O ícone à vista é o pix ou o ticket, conforme o campo Ícone do desconto.

Trocar o ícone do cartão

add_filter( 'wc_installments_simulator_icon', function ( $icon, $type ) {
  if ( 'card' === $type ) {
    return '<svg viewBox="0 0 24 24" fill="currentColor"><path d="M2 6a2 2 0 0 1 2-2h16a2 2 0 0 1 2 2v2H2V6zm0 4h20v8a2 2 0 0 1-2 2H4a2 2 0 0 1-2-2v-8zm3 5h5v2H5v-2z"/></svg>';
  }
  return $icon;
}, 10, 2 );

Tirar o ícone do Pix

add_filter( 'wc_installments_simulator_icon', function ( $icon, $type ) {
  return 'pix' === $type ? '' : $icon;
}, 10, 2 );

Cor e tamanho

  • Use fill="currentColor" no SVG. Assim ele pega a cor do lugar onde aparece: a Cor dos ícones no modelo Padrão, e nos outros modelos a cor do selo, da linha ou do bloco em volta.
  • Use viewBox e não defina width nem height. O plugin ajusta o tamanho. No modelo Padrão, o tamanho vem de Tamanho dos ícones (variável CSS --wcsp-icons-size).
  • Pra só esconder ícones no modelo Padrão, desmarque Exibir ícones na seção Layout, sem código.

Artigos relacionados

Foi útil?