Oferta SiteGround Black Friday

Cómo eliminar las pestañas adicionales de producto en WooCommerce

WooCommerce por defecto muestra al menos 2 pestañas además de la información básica del producto, la de la descripción del producto y la de las valoraciones, pero si no las necesitas puedes eliminarlas fácilmente.

Si no lo tienes claro, antes de seguir leyendo, quizás te valga con cambiar el orden en el que se muestran por defecto, para lo que te recomiendo revisar este otro artículo sobre cómo cambiar el orden de las pestañas de WooCommerce.

¿Por qué debería eliminar estas pestañas?

Hay muchos motivos, pero el principal es para reducir posibles distracciones, para hacer más sencilla la venta, pues si el cliente ha llegado a la página del producto y tiene ahí la información básica y el botón de comprar ¿para qué distraerle con más datos o valoraciones de usuarios?

Cómo eliminar solo la pestaña de descripción

Si solo quieres eliminar la pestaña de la descripción y dejar las demás pues, por ejemplo, siempre vienen bien las estrellitas en los resultados de búsqueda de Google, puedes hacerlo fácilmente.

Solo tienes que acceder al archivo de funciones de tu tema hijo (functions.php) o a tu plugin de personalizaciones ya añadir lo siguiente:

//Quitar pestaña de descripción
add_filter( 'woocommerce_product_tabs', 'ayudawp_remove_description_tab', 50 );
function ayudawp_remove_description_tab( $tabs ) {
    unset( $tabs['description'] );
    return $tabs;
}

Como eliminar solo la pestaña de valoraciones

Si, por el contrario, lo que quieres es quitar la pestaña de valoraciones entonces el código a añadir sería este otro:

//Quitar pestaña de valoraciones
add_filter( 'woocommerce_product_tabs', 'ayudawp_remove_reviews_tab', 50 );
function ayudawp_remove_reviews_tab( $tabs ) {
    unset( $tabs['reviews'] );
    return $tabs;
}

Cómo eliminar solo la pestaña de información adicional

La información adicional es la que muestra atributos en modo listado cuando se decide mostrarlos en la página de producto, y casi nunca aporta nada, así que puedes quitarla casi siempre, y sería con este otro código:

//Quitar pestaña de información adicional
add_filter( 'woocommerce_product_tabs', 'ayudawp_remove_additional_info_tab', 50 );
function ayudawp_remove_additional_info_tab( $tabs ) {
    unset( $tabs['additional_information'] );
    return $tabs;
}

Cómo eliminar todas las pestañas

¿Ah, que querías todas? Más fácil imposible, no hace falta que añadas todos los códigos anteriores, mejor utiliza este otro código que los unifica a todos:

//Quitar todas las pestañas de WooCommerce
add_filter( 'woocommerce_product_tabs', 'ayudawp_woo_remove_product_tabs', 98 );
function ayudawp_woo_remove_product_tabs( $tabs ) {
    unset( $tabs['description'] );      	// quita la pestaña descripción
    unset( $tabs['reviews'] ); 			// quita la pestaña valoraciones
    unset( $tabs['additional_information'] );  	// quita la pestaña información adicional
    return $tabs;
}

¿Y por CSS no se puede?

Claro, también puedes no mostrar las pestañas en vez de no cargarlas.

Ahora bien, ten en cuenta que este método es menos óptimo, pues tu web carga las funciones y luego oculta la visualización de las pestañas, es mucho más eficiente simplemente evitar que carguen con el método anterior.

Pero si quieres  hacerlo entonces añade este código en el la sección de CSS adicional del Personalizador:

/*Ocultar pestañas de producto*/
.woocommerce .woocommerce-tabs { display:none !important}

¿Y ocultar las pestañas pero que se siga viendo la descripción del producto?

También, entonces el CSS sería el siguiente:

/*Ocultar pestañas de producto*/
.woocommerce .woocommerce-tabs ul.tabs {display:none !important}

Como ves, con un poquito de código se puede personalizar WooCommerce hasta el infinito, el límite es tu imaginación y las necesidades de tu tienda online.

 

¿De cuánta utilidad te ha parecido este contenido?

¡Haz clic en los emoticonos para valorarlo!

Promedio de puntuación 5 / 5. Total de votos: 9

Hasta ahora ¡no hay votos!. Sé el primero en valorar este contenido.

Ya que has encontrado útil este contenido...

¡Sígueme en las redes sociales!

¡Siento que este contenido no te haya sido útil!

¡Ayúdame a mejorar este contenido!

Por favor, dime, ¿cómo puedo mejorarlo?

¿Te gustó este artículo? ¡Ni te imaginas lo que te estás perdiendo en YouTube!

AVISO: Esta publicación es de hace 3 años o más. Si es un código o un plugin podría no funcionar en las últimas versiones de WordPress, y si es una noticia podría estar ya obsoleta. Luego no digas que no te hemos avisado. ¡Ah! ¿te funciona? pues entonces no he dicho nada :)

Sobre el autor

10 comentarios en “Cómo eliminar las pestañas adicionales de producto en WooCommerce”

  1. Una pregunta sobre este código interno que tiene wordpress en esta caso woocommerce. Quiero saber todo este tipo de código, quiero decir… woocommerce_single_product_summary corresponde a la descripción del producto, woocommerce_product_tabs corresponde a los tabs y dentro de este hay un array con los nombres description , review etc… Pues ahora quiero saber que nombre tiene los atributos porque quiero que muestre los atributos no se… en la pagina de tienda de cada producto.

    ¿Todo esta información del código de cada cosa de Woocommerce, hay alguna pagina para informarnos? Esta muy bien woocommerce pero cuando quiero hacer algo mas especializado como no me conozco todos los arrays y funciones y tal pues tengo que ir cogiendo cachitos de cada web, ¿Hay un pdf o pagina oficial donde que contenga ya toda la información?

  2. Hola muchas gracias me fue me útil. Yo quiero saber como no mostrar la página de descripción del producto. Tengo una página de afiliación y quiero que al dar clic en un producto en vez de llevarme a su página de descripción que me lleve a la dirección de amazon que tiene en el botón comprar.

  3. Hola buenas tardes querría saber como dejar solo la pestaña de valoraciones y quitar la de descripción y información adicional por CSS. Muchas gracias

    1. Cristopher Mitnick

      Hola, sabe cómo corregir el siguiente tipo error en las pestañas de woo, verá a la hora de picarle a la pestaña de valoraciones hace un tipo scroll hasta el inicio de la página y regresa a la mitad del texto ya sea de la descripción y/o valoraciones, y en ocasiones se queda el scroll hasta el inicio de la web.

      Alguna forma de corregir este efecto, que simplemente al picarle a la pestaña abra normalmente sin scroll

  4. Estoy intentando fusionar la pestaña de información adicional con la pestaña de descripción en WooCommerce.

    La intención es mostrar información de ambas pestañas una al lado de la otra en un diseño de 2 columnas, donde la primera columna muestra la descripción y la segunda columna la información adicional.

    ¿Se puede lograr esto con un fragmento de código que se puede colocar en functions.php?

Deja un comentario

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

Información base sobre privacidad:
- Responsable: Fernando Tellado ([email protected])
- 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

 

Scroll al inicio