WooCommerce: Convierte las pestañas de la página de producto en párrafos

En WooCommerce, la página de producto por defecto incluye pestañas como «Descripción», «Información adicional» y «Valoraciones». Si deseas eliminar estas pestañas y mostrar su contenido en formato de párrafos dentro de la página, puedes hacerlo con algunos ajustes en el código.

A continuación, te mostramos cómo lograrlo con ejemplos en PHP.

Eliminar las pestañas predeterminadas

WooCommerce permite modificar las pestañas de la página de producto mediante el filtro woocommerce_product_tabs. Para eliminarlas, puedes usar el siguiente código:

Este código elimina todas las pestañas de la página del producto. Ahora, necesitamos agregar el contenido en formato de párrafos.
 
Mostrar la descripción corta y larga en la página
Para mostrar la descripción corta y la descripción completa como párrafos dentro del contenido del producto, usa los siguientes hooks:
ID );

    // Descripción completa del producto
    $fullDescription = $product->get_description();
    if ( ! empty( $fullDescription ) ) {
        echo '
';
        echo '
' . __( 'Descripción del producto', 'woocommerce' ) . '
';
        echo '
' . wp_kses_post( $fullDescription ) . '
';
        echo '
';
    }

    // Información adicional (atributos)
    $attributes = $product->get_attributes();
    if ( ! empty( $attributes ) ) {
        echo '
';
        echo '
' . __( 'Información adicional', 'woocommerce' ) . '
';
        echo '
';
        foreach ( $attributes as $attribute ) {
            echo '
' . wc_attribute_label( $attribute->get_name() ) . ': ' . esc_html( implode( ', ', $attribute->get_options() ) ) . '
';
        }
        echo '
';
        echo '
';
    }
}
add_action( 'woocommerce_single_product_summary', 'displayProductDescription', 20 );

Este código:

Obtiene la descripción completa y la muestra como un párrafo dentro de la página.
Recupera los atributos del producto y los lista en formato de puntos.

 
Mostrar las valoraciones como párrafos
Si deseas incluir las valoraciones en la página sin usar una pestaña, usa este código:

Esto inserta la sección de valoraciones en la parte inferior del producto, justo después de la descripción.
Con estos ajustes, hemos eliminado las pestañas predeterminadas y mostrado la información del producto en un formato más simple y accesible. Esto puede mejorar la experiencia de usuario en algunos diseños de tiendas WooCommerce.
Si deseas personalizar más el diseño, puedes agregar clases CSS y estilos para mejorar la presentación.
 





Related posts:
No related posts.