Hola, @robux:
Activa el siguiente fragmento de código en tu sitio para lograr lo que quieres:
/**
* WooCommerce:
* Reemplaza el botón «Realizar pedido» por una imagen
*/
add_filter( 'woocommerce_order_button_html', function( $button_html ) {
// Logotipo de la pasarela de pago ePayco
$logo_url = 'https://multimedia.epayco.co/epayco-landing/btns/epayco-logo-fondo-oscuro-lite.png';
$button_html = '<input type="image" src="' . $logo_url . '" class="button name="woocommerce_checkout_place_order" id="place_order">';
return $button_html;
}, 10, 1 );
Puedes reemplazar el logo por cualquiera de las alternativas que consigues en la página oficial de ePayco: https://epayco.com/recursos-graficos/
Iniciador del debate
robux
(@robux)
Gracias Yordan, hice el cambio y si quedo, pero se ve demasiado grande ¿como puedo cambiar el tamaño?
Podrías intentar limitar el tamaño del botón estableciendo el tamaño explícitamente con estilos en línea.
Como ejemplo, he actualizado el código, limitando al tamaño del botón a 200px
:
/**
* WooCommerce:
* Reemplaza el botón «Realizar pedido» por una imagen
*/
add_filter( 'woocommerce_order_button_html', function( $button_html ) {
// Logotipo de la pasarela de pago ePayco
$logo_url = 'https://multimedia.epayco.co/epayco-landing/btns/epayco-logo-fondo-oscuro-lite.png';
$button_html = '<input type="image" src="' . $logo_url . '" class="button" name="woocommerce_checkout_place_order" id="place_order" style="width:200px">';
return $button_html;
}, 10, 1 );