Mostrar las imágenes de los productos en el checkout de WooCommerce

Mostrar las imágenes de los productos en el checkout de WooCommerce

Tabla de contenido

En este corto artículo te voy a enseñar cómo puedes mostrar las imágenes de los productos en el checkout de WooCommerce. Es una forma sencilla y efectiva de darle a tus clientes una mejor experiencia de compra.

Primero que nada, te recomiendo hacer una copia de seguridad de tu sitio web antes de hacer cualquier cambio en el código. Es mejor prevenir que lamentar.

Ahora sí, vamos al grano. Para mostrar las imágenes de los productos en el checkout de WooCommerce, necesitamos agregar un fragmento de código al archivo functions.php de nuestro tema. Pero no te preocupes, no es nada complicado.

Paso 1: Abre el archivo functions.php

Para empezar, abre el archivo functions.php de tu tema. Puedes hacerlo desde el panel de control de WordPress, en Apariencia > Editor. O, si lo prefieres, puedes usar un programa FTP como FileZilla para acceder al archivo directamente en tu servidor.

Paso 2: Agrega el fragmento de código

Ahora, copia y pega el siguiente fragmento de código al final del archivo functions.php:

add_filter( 'woocommerce_cart_item_name', 'imagen_producto_checkout', 9999, 3 );
  
function imagen_producto_checkout( $name, $cart_item, $cart_item_key ) {
    if ( ! is_checkout() ) return $name;
    $product = $cart_item['data'];
    $thumbnail = $product->get_image( array( '55', '55' ), array( 'class' => 'alignleft' ) );
    return $thumbnail . $name;
}

Este código utiliza un filtro de WooCommerce para agregar la imagen del producto al nombre del producto en el checkout. Es decir, la imagen se mostrará junto al nombre del producto en la página de pago.

Paso 3: Guarda los cambios

Una vez que hayas agregado el fragmento de código, guarda los cambios en el archivo functions.php y actualiza la página de checkout para ver los cambios en acción.

Y eso es todo. Ahora tus clientes podrán ver las imágenes de los productos en el checkout de WooCommerce. ¡Espero que esta información te sea útil!

Comparte este artículo

¿Que tal te pareció este artículo?

Deja una respuesta

Tu dirección de correo electrónico no será publicada. Los campos obligatorios están marcados con *

Información base sobre privacidad:
Responsable: Sebastián Echeverri (portafolio@sebasweb.net)
Fin del tratamiento: Moderación de comentarios para evitar spam
Legitimación: Tu consentimiento
Comunicación de los datos: No se comunicarán los datos a terceros salvo por obligación legal
Derechos: Acceso, rectificación, portabilidad, olvido

Recomiendo:

Sobre la afiliación…

Para mantener este blog, cuento parcialmente con el respaldo de enlaces de afiliación, los cuales generan una pequeña comisión si decides adquirir algo a través de ellos. Esto no implica ningún gasto adicional para ti y solo enlazo productos que personalmente he utilizado y recomiendo.

También te podría interesar ver estos artículos

Eliminar el mensaje ¡La gestión de cupones se ha movido! en Woocommerce

WooCommerce en una de sus actualizaciones ha modificado el menú de los cupones para ponerlo en la pestaña...

Plugin para oferta de 3×2 en WooCommerce

Si buscas una estrategia de marketing que impulse las ventas en tu tienda en línea, la oferta de...

Truco para organizar los datos en columnas de un CSV en excel

Cuando trabajamos con grandes cantidades de datos, es fundamental contar con herramientas eficientes para organizar y manipular la...

Crear listas de espera para productos agotados en WooCommerce

¿Por qué es importante tener una lista de espera para productos agotados? En el mundo del comercio electrónico,...

Actualizar automáticamente el carrito en WooCommerce

Cómo actualizar automáticamente el carrito al cambiar cantidades en WooCommerce WooCommerce es uno de los plugins de comercio...

Cambiar el texto de IBAN en Woocommerce

Si has utilizado Woocommerce para aceptar pagos mediante transferencia bancaria, es posible que hayas notado que la sección...

Algunas plataformas con las que trabajo

No te vayas sin tu regalo!

Apúntate a la newsletter y recibirás GRATIS un pack exclusivo de plantillas para Elementor PRO

Apúntate GRATIS a la newsletter y llévate de regalo un pack de plantillas exclusivas para Elementor!

SUSCRÍBETE

No te pierdas los artículos y trucos relacionados con WordPress, Elementor y diseño y desarrollo web en general.