Cuando trabajas con WooCommerce, muchas veces surgen necesidades específicas que no se resuelven fácilmente con las opciones predeterminadas. Por ejemplo, podrías querer que ciertos productos no se puedan comprar directamente y, en cambio, invitar al cliente a contactarte. Aunque existen plugins que pueden implementar esta funcionalidad, en este tutorial te mostraré cómo lograrlo directamente con unas cuantas líneas de código.
Nuestro objetivo será crear un estado de stock llamado “Contáctanos”, que funcione de manera similar al estado de “Agotado”, pero que en lugar de deshabilitar el producto por completo, redirija al usuario a una página de contacto.
Este estado será compatible con las funciones estándar de WooCommerce y con plugins de terceros.
Pasos para Crear un Estado de Stock Personalizado
1. Agregar un Estado de Stock Personalizado en los Ajustes del Producto
Usaremos el hook woocommerce_product_stock_status_options para añadir un nuevo estado de stock a las opciones del producto.
add_filter( 'woocommerce_product_stock_status_options', 'agregar_estado_stock_personalizado' );
function agregar_estado_stock_personalizado( $estados_stock ) {
// Añadimos el nuevo estado en formato slug => nombre
$estados_stock['contactanos'] = 'Contáctanos';
// Retornamos la lista actualizada de estados
return $estados_stock;
}Con este código, el estado “Contáctanos” aparecerá en la pestaña de inventario de cada producto en el panel de administración.
2. Hacer que los Productos con el Estado Personalizado No Sean Comprables
Para evitar que un cliente pueda añadir al carrito un producto con este estado, usamos el hook woocommerce_product_is_in_stock.
add_filter( 'woocommerce_product_is_in_stock', 'deshabilitar_compra_contactanos', 10, 2 );
function deshabilitar_compra_contactanos( $disponible, $producto ) {
if ( 'contactanos' === $producto->get_stock_status() ) {
$disponible = false;
}
return $disponible;
}3. Mostrar un Mensaje Personalizado en la Página del Producto
Para mostrar un mensaje en lugar del botón “Añadir al carrito”, utilizamos woocommerce_get_availability_text.
add_filter( 'woocommerce_get_availability_text', 'mensaje_stock_contactanos', 10, 2 );
function mensaje_stock_contactanos( $texto, $producto ) {
if ( 'contactanos' === $producto->get_stock_status() ) {
$texto = sprintf(
'Este producto está disponible solo bajo solicitud. Por favor, <a href="%s">contáctanos</a>.',
site_url( 'contacto' ) // URL de tu página de contacto
);
}
return $texto;
}
4. Modificar el Botón de “Añadir al Carrito” en la Página de Tienda
Podemos cambiar el texto y el enlace del botón para productos con este estado:
add_filter( 'woocommerce_product_add_to_cart_text', function( $texto, $producto ) {
if ( 'contactanos' === $producto->get_stock_status() ) {
$texto = 'Contáctanos';
}
return $texto;
}, 25, 2 );
add_filter( 'woocommerce_product_add_to_cart_url', function( $url, $producto ) {
if ( 'contactanos' === $producto->get_stock_status() ) {
$url = site_url( 'contacto' ); // URL de tu página de contacto
}
return $url;
}, 25, 2 );
5. Mostrar el Estado Personalizado en la Lista de Productos del Administrador
Para que el nuevo estado se muestre correctamente en la tabla de productos en el panel de administración, usamos woocommerce_admin_stock_html.
add_filter( 'woocommerce_admin_stock_html', function( $html_stock, $producto ) {
if ( 'contactanos' === $producto->get_stock_status() ) {
$html_stock = '<mark class="onbackorder">Bajo solicitud</mark>';
}
return $html_stock;
}, 25, 2 );
Con unos pocos hooks y líneas de código, puedes personalizar la experiencia de compra en tu tienda WooCommerce, eliminando la necesidad de plugins adicionales. Este tipo de personalización no solo mejora la experiencia del usuario, sino que también optimiza el rendimiento de tu sitio web.
Si estás interesado en aprender más sobre desarrollo avanzado en WooCommerce, revisa nuestro post sobre Hooks y Filters en WordPress para profundizar en este tema. ¡Recuerda compartir este artículo si te fue útil!