Okay
  Public Ticket #858746
Checkout- Credit Card Icons
Closed

Comments

  • Jesse started the conversation

    Under Payment Method- Credit Card, there are multiple credit card icons. As our shop will only be accepting visa and mastercard I'd like to change these icons but cannot find where to do so.

  • [deleted] replied

    Hi Jesse,

    I've been searching and found how can this be done, so you need to place the below code in functions.php (end of file):

    /**
     * Custom icon for PayPal payment option on WooCommerce checkout page.
     */
     
    function isa_extended_paypal_icon() {
         // picture of accepted credit card icons for PayPal payments
         $uploads = wp_upload_dir();
         return $uploads['baseurl'] . '/paypal-payments.jpg';
    }
    
    add_filter( 'woocommerce_paypal_icon', 'isa_extended_paypal_icon' );

    Then go to wp-content/uploads/ and upload your custom image with payment icons and name it: paypal-payments.jpg


  • Jesse replied

    Perfect thanks! Is there another way I can change the icons under "Credit Card" in addition to the paypal one?

  • Jesse replied

    I was trying to correct the issue myself and I now have this error: "Parse error: syntax error, unexpected '<' in /hsphere/local/home/summitpac/marketplace.summitpacific.ca/wp-content/themes/aurum/functions.php on line 144". I am unable to even get onto the website now, please help

  • [deleted] replied

    Hi Jesse,

    Can you please share your FTP credentials here, because I need to login to your site and test this issue. Your information is safe here (private) in this thread.

    Make sure to choose "Private Reply" when you send us sensitive information!

    Also send me the card icons you want to show in PayPal, and those you want to show in "Credit Card" option as well.

  •   Jesse replied privately
  • [deleted] replied

    Hi Jesse,

    Can you please add the following code in functions.php (end of file):

    function cc_icons_woocommerce_gateway_icon( $html, $id ) {

    if ( $id == 'credit-card' ) {
    $html = '<img src="http://url.to/image.jpg">';
    }

    return $html;
    }

    add_filter( 'woocommerce_gateway_icon', 'cc_icons_woocommerce_gateway_icon', 10, 2 );
    In order to appear the credit card icons you need the ID to know how its written, so to learn about the Payment Gateway ID add the following code:
    function cc_icons_woocommerce_gateway_icon_get_id( $html, $id ) {
    	
            echo "<br>The id is: '$id'<br>";
    	return $html;
    }
    
    add_filter( 'woocommerce_gateway_icon', 'cc_icons_woocommerce_gateway_icon_get_id', 10, 2 );
    After that copy the id shown on screen and paste where is 'credit-card' to match the correct payment gateway.