Quitar botón de añadir al carrito en página de la tienda de WooCommerce

Analizamos diferentes opciones para ocultar el botón de añadir el carrito y evitar que un producto se pueda comprar.


por

Artículo original del 12/10/2016, actualizado el 05/01/2020

En algunas ocasiones, sobretodo en caso de productos externos o afiliados, es posible que nos interese ocultar el botón de «añadir al carrito» o «comprar productos» de la página de la tienda, la de categoría o de los widgets de productos de WooCommerce.

Para ello, sólo debemos añadir esta función en el archivo functions.php de nuestro tema:


function remove_loop_button(){ 
    remove_action( 'woocommerce_after_shop_loop_item', 'woocommerce_template_loop_add_to_cart', 10 ); 
} 
add_action('init','remove_loop_button');

Si además, queremos ocultarlo también en la página de producto, podríamos utilizar la misma función para hacer ambas cosas:


function remove_add_to_cart_button($product)
{  
     remove_action( 'woocommerce_single_product_summary', 'woocommerce_template_single_add_to_cart', 30 );
     remove_action( 'woocommerce_after_shop_loop_item', 'woocommerce_template_loop_add_to_cart', 10 );
	 
}
add_action('init','remove_add_to_cart_button');

Nota: ojo con las prioridades de las acciones, en función del tema que estes utilizando u otros plugins, es posible que debas probar con otras si no te funciona.

También podemos utilizar los condicionales de WordPress y WooCommerce para filtrar en que páginas queremos que no aparezcan los botones, muy típico para ocultarlos en la página de inicio de la web:

//Ocultamos los botones en la homepage
add_action( 'woocommerce_after_shop_loop_item', 'remove_add_to_cart_buttons', 30 );
function remove_add_to_cart_buttons() {
	
	if(is_front_page()) {
       
        remove_action( 'woocommerce_after_shop_loop_item', 'woocommerce_template_loop_add_to_cart' );
	}
      
}

¿Cuál es el problema?

Qué solo estamos ocultando el botón de añadir al carrito, pero no estamos evitando la compra de ese producto.

Es decir, si alguien intentara añadir ese producto al carrito directamente desde la url, por ejemplo con «woocommerce.esl/shop/?add-to-cart=47«, el producto se añadiría y se podría comprar.

Si lo que necesitamos es que el producto no se pueda comprar, deberemos modificar otro filtro complementario «woocommerce_is_purchasable»

add_filter( 'woocommerce_is_purchasable', '__return_false');

Con este filtro, el botón en la página de producto desaparece, y en las páginas de la tienda, categorías, etc… se sustituye por uno de «Read More» o «Ver más», que enlaza con la página de producto.

Combinando ambas cosas podremos ocultar los botones y evitar que pueda comprarse.

Si lo que te interesa es cambiar el texto que aparece en ese botón, ya sea para productos simples, variaciones o externos, puedes consultar este artículo.

Ocultar el botón de añadir el carrito para una categoría o producto concreto

Si lo que hemos visto hasta ahora necesitas aplicarlo, pero no a todos los productos de la tienda, sino a una categoría, etiqueta o productos en concreto, podemos hacerlo añadiendo el filtro necesario a las funciones.

En este caso, lo primero que haremos es indicar que aquella categoría o producto que nos interese no puede comprarse:

add_filter('woocommerce_is_purchasable', 'categorias_no_en_venta', 10, 2);
function categorias_no_en_venta( $is_purchasable, $object ) {
     $category = 'categoria-1';
    if ( !has_term( $category, 'product_cat', $product->id ) ) 
        return true;
    else
        return false;
}

De esta forma, en las páginas de producto de esa categoría ya no aparecerá el botón de añadir al carrito, y en las de la tienda, se habrá sustituido por el de ver más, que enlazará a la página.

Si no queremos que aparezca tampoco ese botón de ver más, lo ocultaremos con un filtro:

add_filter( 'woocommerce_loop_add_to_cart_link', 'replace_loop_add_to_cart_button', 10, 2 );
function replace_loop_add_to_cart_button( $button, $product  ) {
 
    $terms = array( 'categoria-1'); 
    if( has_term( $terms, 'product_cat', $product->get_id() ) ){
        $button = '';
    }
    return $button;
}

De esta forma, ni siquiera aparecerá el botón.

Lo que debe quedar claro es que no es lo mismo ocultar un botón que eliminar la funcionalidad, por lo que debemos tener claro si lo que queremos es algo estético, que podríamos hacerlo también con CSS, o evitar realmente la compra de ese producto.


/* Ocultar todos los botones de carrito en la página de tienda */
.woocommerce a.button.add_to_cart_button {
    display: none;
}
/* Ocultar el botón de carrito y la cantidad en la página de producto */
.single-product button.single_add_to_cart_button, .single-product .quantity {
    display: none;
}
/* Ocultar el botón para un producto en concreto */
.post-47 a.button.add_to_cart_button {
    display: none;
}
/* Ocultar el boton para la pagina de la categoria en concreto */
.term-categoria-1 a.button.add_to_cart_button {
    display: none;
}

Como suele pasar, existen diferentes formas de llegar a lo mismo y dependerá de lo que necesites hacer y las características del tema y plugins de la web.

Aquí tenéis los códigos utilizados:

Comentarios

59 respuestas a «Quitar botón de añadir al carrito en página de la tienda de WooCommerce»

  1. Avatar de Valeris

    |

    Hola!! Si yo hago esto, desaparece la palabra solo de la home o tambien del producto? porque me interesaria que quede la home SIN LA FRASE pero cuando cliquean el producto que si aparezca… se puede hacer?

    1. Avatar de esther

      |

      Hola!
      Si, con este código desaparece el botón de Añadir al carrito en la página de la tienda, de categorías o en los widgets de productos, en todos aquellos sitios que utilizan el loop de productos, pero se mantiene en la página de cada uno de los productos.

      Saludos!

  2. Avatar de Valentina Serrano

    |

    Hola, he puesto el comando y sigue saliéndome «comprar productos» ¿qué estoy haciendo mal?

    1. Avatar de esther

      |

      Hola Valentina,
      ¿Dónde te aparece el botón? ¿En la página de la tienda?
      Hay la posibilidad de que tengas algún plugin instalado (de customización de WooCommerce, por ejemplo) que interfiera con una función contraria. Sin tener más información es difícil determinarlo, pero el snippet en si lo utilizo en varias páginas web y funciona.

      Saludos!

  3. Avatar de CESAR

    |

    Hola, si al producto le quito el precio desaparece el carrito para ese producto. Es decir puedo de esta forma tener algunos productos con carrito y otros no manteniendo o retirando el precio respectivamente.

    Saludos

    1. Avatar de esther

      |

      Hola Cesar! Sí, es una opción, aunque en ese caso te obliga a quitar el precio para que no se muestre, y con la función puedes mantenerlo. Todo depende de lo que se necesite en cada caso.
      Gracias por la aportación!

      Saludos,

  4. Avatar de Alicia

    |

    Muchas gracias por esta aportación. Es el único lugar donde encontré la solución sin usar plugins. En mi sitio funcionó perfecto

    1. Avatar de esther

      |

      Muchas gracias Alicia! Me alegra que te haya podido ayudar.

      Saludos,

  5. Avatar de Gus

    |

    Funciona 100%

  6. Avatar de User

    |

    GRACIAS!!!!!!!! Tan fácil y tan sencillo que no pensé que funcionaría. Es exactamente lo que buscaba.

    1. Avatar de esther

      |

      Genial, me alegra que e haya servido! 🙂

  7. Avatar de Francisco Naranjo

    |

    Muchisimas gracias Esther,
    Me ha funcionado perfectamente.
    Gracias por compartir.

  8. Avatar de Martin

    |

    En functions.php al final puse ese codigo, pero si entro a catalogo de productos sigue apareciendome el boton:
    AQUI CAMBIO EL NOMBRE DEL BOTON POR COTIZAR:
    ———————————————————————————–
    // change «Add to cart» text in category pages
    add_filter( ‘woocommerce_product_add_to_cart_text’, ‘oaf_wc_change_add_to_cart_text’ );

    // change «Add to cart» text in single product pages
    add_filter( ‘woocommerce_product_single_add_to_cart_text’, ‘oaf_wc_change_add_to_cart_text’ );
    function oaf_wc_change_add_to_cart_text() {
    return __(‘COTIZAR’, ‘woocommerce’);
    }

    AQUI INTENTO DESAPARECER EL BOTON YA QUE IGNORO COMO MODIFICAR EL BOTON PARA QUE ME LLEVE AL FORM DE CONTACTO:

    // Primero, desactivamos el botón «Añadir al carrito»
    function remove_loop_button(){
    remove_action( ‘woocommerce_after_shop_loop_item’, ‘woocommerce_template_loop_add_to_cart’, 10 );
    }
    add_action(‘init’,’remove_loop_button’);

    POR eso pense en borrarlo y crear otro que me redireccione a contactar.

    1. Avatar de esther

      |

      Hola Martin,
      En el segundo código parece que hay una comilla demás después de «init», mira que no sea la razón de que no te funcione.

      Saludos!

  9. Avatar de Gabriel

    |

    Muy buenas Esther y si solo quisiera quitar el carrito en una categoría o en un par de productos en particular? un saludo.

    1. Avatar de esther

      |

      Buenas Gabriel!
      Pues en ese caso deberías mirar de utilizar un condicional para detectar la categoría o el producto. Mírate los comentarios del artículo de Cambiar el texto del botón Añadir al carrito, hay una duda y un ejemplo de algo parecido que podrías adaptar.

      Saludos!

  10. Avatar de Valeria

    |

    ¡Hola! Yo necesitaría quitar el añadir al carrito solo en la página de inicio, y mantenerlo en la tienda y demás, ¿puedes echarme un cable?

    1. Avatar de esther

      |

      Hola Valeria!
      Podrías probar el mismo código pero añadiendo un condicional en la función para que sólo se aplicara en la página de inicio, tipo: if ( is_home() ) { etc…. }

      Saludos!

      1. Avatar de Valeria

        |

        Muchas gracias, Esther. He incluido el código que has indicado, e indicado que sea solo la página de inicio, pero me lo aplica a la página de inicio y a la de tienda. He intentado con este código también if ( is_front_page() && is_home() ) {
        pero o no lo pongo en la línea de debo o algo estoy haciendo mal. Millones de gracias de todas formas por haberme respondido :).

        1. Avatar de esther

          |

          Hola Valeria!
          Prueba sólo con el condicional de is_front_page(), y el if ha de ir justo antes del remove_action, a ver si así te lo aplica sólo a la página de inicio.

          Saludos!

  11. Avatar de Rafa Corts

    |

    Hola Esther, tengo una tienda online con el tema de Avada y estoy intentando quitar el boton de añadir al carrito en la pagina de productos y no hay manera. he aplicado los códigos que comentas pero no consigo que no aparezca.
    No se como solucionarlo, haber si me puedes dar alguna solución.
    Saludos.
    Rafa Corts

    1. Avatar de esther

      |

      Hola Rafa!
      Como comento en el post, es posible que algún plugin o la plantilla estén utilizando la misma función y que tenga una prioridad superior.
      Si no lo encuentras, escríbeme por email y lo miramos.

      Saludos!

  12. Avatar de Francisco

    |

    Hola, si lo que quiero es redirigirlos directamente de la página principal a amzon en vez de a la página de descripción del producto?
    y donde puedo cambiar el texto del botón de la página principal?

    Gracias de antemano. Saludos

  13. Avatar de Alejandro

    |

    Hola, Esther, no soy muy ducho con esto de los codigos , pero me estoy rompiento el coco y no logro dar con la tecla , necesito ocultar el ir al carrito de todos los productos de la categoria id 43 y de cada producto individual dentro de esa categoria que parte del codigo debo usar y donde modifico el numero de la categoria ?? no termino de comprender eso

    1. Avatar de esther

      |

      Hola Alejandro,
      En ese caso debes utilizar el código del apartado «Ocultar el botón sólo para una categoría en concreto» y sustituir ‘categoria-1’ por el slug de la categoría que te interese (el slug lo tienes en la página del listado de categorías, en la 3a columna).

      Saludos!

      1. Avatar de Alejandro

        |

        ahhhhhh, esa parte de la aclarcion no la encontre en el articulo, pequeño detalle, jaja listo muchisimas gracias

  14. Avatar de MATIAS

    |

    Hola esther como estas?? me funciono a la perfección para eliminar el boton de añadir al carrito pero en mi web también tengo el boton de wishlist, como podria elimiar este mismo? prove modificando tu codigo y agregando este que es lo que quiero eliminar pero no funciono.
    jet-wishlist-button__container

    desde ya muchas gracias.

    1. Avatar de MATIAS

      |

      me di cuenta que eso lo podia desactivar desde el plug-in asi que ya lo solucione. muchas gracias me fue muy util el código para el carrito

      1. Avatar de esther

        |

        Perfecto! Me alegro que lo hayas podido solucionar, Matias.

  15. Avatar de Andres

    |

    Hola Esther, a mi me interesaría quitar solo es botón de «vista rápida», es posible?
    Gracias. Andrés

    1. Avatar de esther

      |

      Hola Andrés,
      Diría que esa opción de vista previa no viene por defecto con WooCommerce, mira si estás usando alguna extensión o plugin que lo añade para poder desactivarlo.

      Saludos!

  16. Avatar de Yolanda

    |

    Hola Esther! Gracias por tu aportación! El código que pones para ocultar una categoría me funciona bien, pero necesito ocultar más de una… ¿cómo lo hago? Qué código tendría que poner?
    Un saludo y gracias.

    1. Avatar de esther

      |

      Hola Yolanda!
      En ese caso puedes utilizar un array de categorías: $category = array(‘categoria 1’, ‘categoria 2’);
      Y así el ‘has_term’ se aplicará en cualquiera de ellas.

      Saludos!

      1. Avatar de yolanda

        |

        Perfecto!! Muchas gracias!
        si no es abusar… como podría hacer para que en esas categorías que hemos ocultado el botón de comprar, en su lugar salga un texto tipo «Consulte disponibilidad en nuestro email correo@dominio.com »
        Gracias por todo! Un saludo!

        1. Avatar de esther

          |

          Hola Yolanda!
          Tendrías que añadir el texto que quisieras en la parte de $button=»», por ejemplo:

          add_filter( 'woocommerce_loop_add_to_cart_link', 'replace_loop_add_to_cart_button', 10, 2 );

          function replace_loop_add_to_cart_button( $button, $product ) {

          $terms = array( 'categoria-1');

          if( has_term( $terms, 'product_cat', $product->get_id() ) ){

          $button = 'Consulte disponibilidad en nuestro email correo@dominio.com';
          }
          return $button;
          }

          Saludos!

  17. Avatar de alex

    |

    Hola Esther! Me gustaría quitar el carrito y el precio en las paginas de producto de los productos variables, he cogido el 2 ejemplo y he cambiado single por variable para ver si me funcionaba, pero no me realiza ningún cambio

    1. Avatar de esther

      |

      Hola Alex,

      Ojo que single puede referirse a que es la página de producto, no que al tipo de producto.
      Mira si lo que necesitas es otro condicional: $product->is_type( ‘variable’ )

      Saludos!

  18. Avatar de alex

    |

    Discúlpame por este 2 mensaje, también estoy intentándolo para una categoría en concreto, pero al introducir el código cambio categoría-1 por el slug de la categoría que quiero eliminar el botón del carrito en la página de producto y sigue sin funcionar.

    1. Avatar de esther

      |

      Pues de entrada no se cual puede ser el problema Alex, puede ser que haya alguna incompatibilidad u otro código que esté chocando con este script.

  19. Avatar de Ismael

    |

    Funcionó Muchas Gracias !!!

  20. Avatar de Giuliano

    |

    Esther, me funcionó el código para eliminar el botón ver más para 1 categoría, cómo hago para ocultarlo en todas las categorías? Gracias !!

    1. Avatar de Giuliano

      |

      Perdón que agrego otro msj, veo que me elimina también un msj que tiene debajo de cada producto cuándo no está registrado para que lo haga. Es posible no eliminar todo?

      1. Avatar de esther

        |

        Hola de nuevo!
        En ese caso, quizás en lugar de el filtro que comentábamos, puede que sea mejor que utilices los primeros snippets, para ver si así no afectan al mensaje de registro que comentas, o a malas, ocultar el botón con CSS para no afectar a otros códigos.

        Saludos!

    2. Avatar de esther

      |

      Hola Guiliano,
      Debes utilizar el filtro genérico (add_filter( ‘woocommerce_is_purchasable’, ‘__return_false’);), no el que aplicamos a una única categoría.

      Saludos!

  21. Avatar de Diego Velasquez

    |

    Hola, yo quisiera mostrar el botón en la pagina del producto ya que no se esta mostrando, sabes como hacerlo?

    1. Avatar de esther

      |

      Hola Diego,

      Por defecto debería mostrarse, por lo que si no es así tendrás que buscar si hay algún estilo de CSS o algún filtro en el tema o en algún plugin que lo está ocultando.
      Para ir descartando puedes cambiar el tema y comprobar si aparece o no, y lo mismo con los plugins, hasta detectar el que lo está causando.

      Saludos!

  22. Avatar de Monse

    |

    Hola, me ha funcionado mucho tu articulo para eliminar el botón de añadir al carrito en la página de «TIENDA», Gracias

    Por otro lado quisiera ver si me pueden ayudar ya que estoy haciendo un ecommerce con infoproductos algunos son de pago y otros gratuitos, por lo que he hecho dos categorías, sin embargo quisiera saber si es posible que en la «página de producto» los de «categoría Gratuito» no enlacen a la página de check out, sino a una página de formulario para descarga directa. Asi como tambien saber si hay forma de eliminar el precio $0 sin que se elimine el botón.

    Gracias o

    1. Avatar de esther

      |

      Hola Monse,

      WooCommerce por defecto trae un tipo de producto que es «externo/afiliado» que te permite introducir una url donde enlazar el botón en lugar de ir al carrito. Mira si con esto te soluciona la opción de añadir estos infoproductos.

      Saludos!

  23. Avatar de Yolanda

    |

    Muchas gracias por tu aporte Esther. En mi caso necesito algo un poco más complicadillo: Necesito ocultar el botón añadir al carrito en una categoría determinada, para usuarios no logeados. O lo que es lo mismo, obligar a registrarse para poder añadir al carrito productos de una categoría determinada. ¿Estoy pidiendo el cielo?

    1. Avatar de esther

      |

      Hola Yolanda!
      Jajaja no, no pides tanto, hay que jugar con el condicional de si está logeado y si quieres perfilar por el tipo de rol o de permisos. En breve publico el tutorial de cómo hacerlo.

      Saludos!

      1. Avatar de Yolanda

        |

        Muchas gracias por tu tiempo! Espero impaciente ese tutorial. Saludos!

        1. Avatar de esther

          |

          Hola Yolanda!

          Al final no creo que valga la pena ni hacer un tutorial, simplemente debes añadir el condicional para comprobar si el usuario está logeado:
          add_filter('woocommerce_is_purchasable', 'categorias_no_en_venta', 10, 2);
          function categorias_no_en_venta( $is_purchasable, $object ) {
          $category = 'music';
          if(has_term( $category, 'product_cat', $product->id ) && !is_user_logged_in())
          return false;
          else
          return true;
          }

          Espero que te sirva!

  24. Avatar de El che

    |

    Hola Esther, como hago para quitar el botón de añadir carrito a dos categorías con el código de abajo?

    add_filter(‘woocommerce_is_purchasable’, ‘categorias_no_en_venta’, 10, 2);

    function categorias_no_en_venta( $is_purchasable, $object ) {

    $category = ‘categoria-1’;
    if ( !has_term( $category, ‘product_cat’, $product->id ) )
    return true;
    else
    return false;
    }

    1. Avatar de esther

      |

      Hola!
      Has de sustituir $category = ‘categoria-1’; por un array: $category = array(‘categoria-1’, ‘categoria-2’, ‘categoria-3’);

      Saludos!

  25. Avatar de xavi

    |

    Hola, soy novel en esto, dónde se inserta este código, el php?

    htacias

    1. Avatar de esther

      |

      Hola Xavi,
      Tienes varias opciones para hacerlo, mírate este artículo para ver las que son y cual te puede ir mejor: https://www.esthersola.com/modificar-functions-code-snippets/

      Saludos!
      esther

  26. Avatar de Rubén

    |

    Buenos días, gracias por el artículo, ¡es de gran utilidad!
    Estoy intentando dejar de mostrar el botón de compra en los productos de una categoría específica de WooCommerce.
    En el siguiente código, cómo identifico yo la categoría deseada? Es decir, yo conozco el slug, pero no el número de la categoría.

    add_filter(‘woocommerce_is_purchasable’, ‘categorias_no_en_venta’, 10, 2);

    function categorias_no_en_venta( $is_purchasable, $object ) {

    $category = ‘categoria-1’;
    if ( !has_term( $category, ‘product_cat’, $product->id ) )
    return true;
    else
    return false;
    }

    ¿Podrían ayudarme? Gracias de antemano.

    1. Avatar de esther

      |

      Hola Ruben,
      Si conoces el slug ya es suficiente, en el ejemplo, ‘categoria-1’ no es el Id, sino el slug, como podría ser ‘camisetas’ o ‘libros’, no es necesario que sepas el número.

      Saludos!