1

I am looking for the saved payment methods section, to include the icon of each of the cards that users use (Visa, Master card, Amex) how could I add this to WooCommerce?

Current payment method section:

enter image description here

Final idea:

enter image description here

mujuonly
  • 11,370
  • 5
  • 45
  • 75
Mario Sosa
  • 57
  • 3
  • 1
    Welcome to Stack Overflow! Your question lacks information to get any help from [so] users. Please take the [tour], and read through the [help], learn  [ask] a good question? to maximize your chance to get answer to your questions. If you run into a specific problem and if you're stuck, send a description of the problem, including a [mcve] and people will be very glad to help you. – mujuonly Apr 20 '22 at 12:32

1 Answers1

0

enter image description here

add_action('woocommerce_account_payment_methods_column_method', 'woocommerce_account_payment_methods_column_data', 10, 1);

function woocommerce_account_payment_methods_column_data($method) {

    if (!empty($method['method']['brand'])) {
        $card = strtolower($method['method']['brand']);
        $card_url = "https://woocommerce.com/wp-content/plugins/woocommerce-payments/assets/images/cards/$card.svg";
    }
    if (!empty($method['method']['last4']) && isset($card_url)) {
        /* translators: 1: credit card type 2: last 4 digits */
        echo '<span><p style="float:left;margin-right:5px;"><img height="40px" width="40px;" src=' . $card_url . ' /></p><p  style="float:left">' . sprintf(esc_html__('%1$s ending in %2$s', 'woocommerce'), esc_html(wc_get_credit_card_type_label($method['method']['brand'])), esc_html($method['method']['last4'])) . "</p></span>";
    } else {
        echo esc_html(wc_get_credit_card_type_label($method['method']['brand']));
    }
}
mujuonly
  • 11,370
  • 5
  • 45
  • 75
  • Thank you a lot for the response it worked perfectly, but do you think it could work as well in the payment section that is in the checkout? – Mario Sosa Apr 29 '22 at 16:08
  • No, there you cannot do with this hook - but can be done with some other hooks depending on the gateway – mujuonly Apr 29 '22 at 16:30
  • That makes a lot of sense, by any chance do you have the hooks for doing this with stripe gateway? – Mario Sosa May 02 '22 at 06:17
  • Are you using this [Stripe Payment Plugin for WooCommerce](https://wordpress.org/plugins/payment-gateway-stripe-and-woocommerce-integration/)? – mujuonly May 02 '22 at 07:18
  • I'm using this plugin [Stripe Payment Gateway](https://symbiosewear.com/wp-admin/plugin-install.php?tab=plugin-information&plugin=woocommerce-gateway-stripe&TB_iframe=true&width=600&height=550) – Mario Sosa May 03 '22 at 19:57