• Payment Gateways – Add and customize up to 10 additional custom off-line payment gateways. Change icons (images) for all custom and/or default (COD – Cash on Delivery, Cheque, BACS, Mijireh Checkout, PayPal) WooCommerce payment gateways.

    The plugin clearly claims that you can change the icon for custom payment gateways. However, you can only change the icon for the stock set of WC payment gateways. It’s not clear if this is a locked feature as there is no such indication.

    —–

    EDIT: Changed my rating based on the excellent assistance provided by the developer. See followup comments below.

Viewing 12 replies - 1 through 12 (of 12 total)
  • Hi,

    Sorry for a little delayed response – I’ve just got to the office.
    I’ve rechecked, and Custom Payment Gateway icon works fine. Option to change Custom Gateways icon is in gateway options itself, that is you need to go to WooCommerce > Checkout > Custom Gateway #1 > Icon. It’s my fault you didn’t find it, as options to change icons for default gateways are grouped together, when for Custom Gateways options are in gateway options itself.
    Please let me know if that solved the problem, or is it still there.

    P.S. Changing icons is not a locked feature.

    Best regards,
    Tom

    By the way – how do you create those Custom Payment Gateways? with WooJetpack? or some other plugin? if yes – which one?

    Best regards,
    Tom

    Thread Starter sparky672

    (@sparky672)

    It’s just a gateway that I purchased from WooCommerce. Authorize Net DPM to be precise.

    https://www.woothemes.com/products/authorize-net-dpm/

    Yes, I expected the settings for gateway icons to all be located in the same place. I reinstalled the WooCommerce Jetpack to look at what you’re talking about and that is not intuitive at all. I also don’t see how Custom Gateway #1 would know to use the Authorize Net DPM gateway. Where is the connection?

    Not even sure if I’m going to use such a large feature rich plugin for simply changing a single icon.

    I can see the line that sets the icon in the Authorize Net DPM gateway class function but cannot figure out how to override it without editing the source code. Unless you know of a hook or filter to target this one, I’m stuck. Thanks.

    Hi,

    Could you please contact me at [email protected], we will be happy to try to add “Authorize Net DPM” gateway’s icon changing option to our plugin.

    As for making plugin more intuitive – we are working on it, and will definetely include your remarks. And yes, you are right – there is no connection between Custom Gateways (from #1 to #10, can be created in WooJetpack’s “CHECKOUT > Payment Gateways > Custom Payment Gateways Options”) with any other gateways from other plugins.

    Best regards,
    Tom

    Thread Starter sparky672

    (@sparky672)

    I very much appreciate your offer to add this feature to your plugin. However, like I stated, the WooJetpack seems like overkill for my purposes. I really just want a filter or hook for changing this one icon. (for now, I’m simply hiding the default icon via CSS)

    Perhaps you can change your plugin description to more accurately reflect the fact that “external” gateways are not supported. I don’t even know what to call these as mine was an add-on made by WooCommerce.

    Thank-you for your assistance.

    I’ve already changed the description, hope it’s not misleading anymore.

    Regarding changing the icon, I just really need to know if there are apply_filters function calls in “Authorize Net DPM” gateway’s PHP file. Like, for example, apply_filters with woocommerce_paypal_icon or woocommerce_gateway_icon for PayPal. If there are – then it will be very easy to change the icon. But as this plugin is paid, I have no possibility to take a look.

    Regarding using our plugin for only some small feature, like in your case, you are probably right, however our plugin is module based, you can disable all modules you don’t need with a single click, and those won’t run on your server and won’t use any resources when disabled.

    Best regards,
    Tom

    Thread Starter sparky672

    (@sparky672)

    Yes, I can see the filter calls inside the PayPal gateway. Unfortunately, the Authorize Net DPM file does not contain any filter calls at all. I can see where the icon is set but I’d have to edit the source code, which naturally I will not do.

    I was hoping there was some other way.

    Well, if they didn’t put filters there, then we can do it the ugly ?? way. Adding something like this to functions.php file should do the trick (the example is for PayPal, image paths below should be changed accordingly):

    add_action( 'init', 'turn_on_output_buffering', 10, 0 );
    add_action( 'wp_footer', 'ob_end_flush', 10, 0 );
    function turn_on_output_buffering() {
    	ob_start( 'change_icon' );
    }
    function change_icon( $buffer ) {
    	$search_for = 'https://www.paypalobjects.com/webstatic/mktg/Logo/AM_mc_vs_ms_ae_UK.png';
    	$replace_with = 'https://www.paypalobjects.com/webstatic/mktg/logo-center/PP_Acceptance_Marks_for_LogoCenter_266x142.png';
    	return str_replace( $search_for, $replace_with, $buffer );
    }

    Thread Starter sparky672

    (@sparky672)

    That’s pretty awesome. Thank-you! I appreciate everything. Here is the final code which I made more generic by replacing my domain name with current paths to the directories…

    /* Change the Authorize Net DPM payment icon on the checkout page
    _______________________________________________________________________*/
    
    add_action( 'init', 'turn_on_output_buffering', 10, 0 );
    add_action( 'wp_footer', 'ob_end_flush', 10, 0 );
    function turn_on_output_buffering() {
    	ob_start( 'change_icon' );
    }
    function change_icon( $buffer ) {
    	$search_for = plugins_url() . "/woocommerce-gateway-authorize-net-dpm/images/cards.png";
    	$replace_with = get_bloginfo('stylesheet_directory') . "/images/woocommerce-icons/cards.png";
    	return str_replace( $search_for, $replace_with, $buffer );
    }

    Happy it worked! However I should say that this method could have compatibility issues with some plugins that use similar ob_start methods, so should be used with caution.

    Best regards,
    Tom

    Thread Starter sparky672

    (@sparky672)

    WooThemes finally responded with a filter hook I can use called woocommerce_gateway_icon. It’s a hook for all payment icons so it needs a conditional to target just the one…

    function authorize_gateway_icon( $icon, $id ) {
        if ( $id === 'authorize_net_dpm' ) {
            return '<img src="' . get_bloginfo('stylesheet_directory') . '/images/woocommerce-icons/cards.png" alt="Authorize.net" />';
        } else {
            return $icon;
        }
    }
    add_filter( 'woocommerce_gateway_icon', 'authorize_gateway_icon', 10, 2 );

    Yes, that does look much better… Will know now.

Viewing 12 replies - 1 through 12 (of 12 total)
  • The topic ‘didn't work for what I wanted, but still pretty awesome’ is closed to new replies.