Guía práctica para personalizar el contenido de las pestañas en las páginas de detalles de productos de WooCommerce (por ejemplo, añadir "Servicio posventa", etc.)

existe WooCommerce Por defecto, la página de detalles del producto de la tienda contiene pestañas como "Descripción", "Información adicional", "Opiniones", etc. Sin embargo, en la práctica, los comerciantes a menudo necesitan añadir más contenido personalizado para satisfacer sus necesidades comerciales. Sin embargo, en el funcionamiento real, los comerciantes a menudo necesitan añadir más contenido personalizado para satisfacer las necesidades de su negocio, por ejemplo:

• Servicio postventa
• Historia de una marca
• Política de envíos y devoluciones
• Guía del usuario o vídeo del producto

Este artículo mostrará cómo utilizar un enfoque de código para la WooCommerce Añada una nueva pestaña personalizada (por ejemplo, "Servicio posventa") a la página de detalles del producto y permita una gestión flexible.

I. Cómo implementar pestañas personalizadas

WooCommerce ofrece filtros especializadosganchos woocommerce_product_tabsque se utiliza para modificar la estructura de pestañas de la página de detalles del producto. Simplemente añade una nueva pestaña usando este hook.

Código de ejemplo: añadir pestaña "servicio posventa

Añada el siguiente código al tema funciones.php Documentación:

add_filter( 'woocommerce_product_tabs', 'custom_add_after_sales_tab' );
function custom_add_after_sales_tab( $tabs ) {
    $tabs['postventa'] = array(
        'title' => 'Servicios postventa',
        'priority' => 50, // controla el orden de visualización
        'callback' => 'custom_after_sales_tab_content'
    );
    return $tabs.
}

function custom_after_sales_tab_content() {
    echo '<h2>Servicio postventa</h2>'; echo '
    echo '<p>Todos los artículos de nuestra tienda gozan de 7 días sin motivo de devolución, 30 días de servicio de sustitución por problemas de calidad. Para más detalles, póngase en contacto con el servicio al cliente.</p>';
}

II. Soporte de contenidos personalizados HTML, imágenes, vídeos (para mostrar instrucciones o ejemplos)

existe Gutenberg Mediante el bloque "Código" del editor.

• Al editar un artículo, haga clic en + Añadir nuevo bloque

• Busque "Código" o "Código" e inserte

Ejemplo:

echo '

    
Soporte 7 días de devolución sin motivo</li
    
30 días de garantía de cambio gratuito</li
    
Garantía nacional, proporcionar factura formal
.
';

Incluso puede insertar vídeos o imágenes incrustados para hacer la página más atractiva:

echo '<img src="https://yourdomain.com/wp-content/uploads/after-sales.jpg" alt="servicio posventa">';

III. Configuración de contenidos diferentes para productos diferentes (uso avanzado)

Si desea que distintos productos muestren contenidos de servicio posventa diferentes, puede utilizar la opción get_the_ID() tal vez $product->get_id() Obtenga el ID del producto actual y haga un juicio:

function custom_after_sales_tab_content() {
    $product_id = get_the_ID();
    if ( $product_id == 123 ) {
        echo '<p>Este producto tiene derecho a 12 meses de servicio de reparación gratuito.</p>'; } else {
    } else {
        echo '<p>Se aplican las políticas habituales de posventa.</p>';
    }
}

Ocultar las pestañas predeterminadas (por ejemplo, "Información adicional").

También puedes ocultar ciertas pestañas predeterminadas que no quieras mostrar, por ejemplo:

add_filter( 'woocommerce_product_tabs', 'remove_unwanted_product_tabs', 98 );
function remove_unwanted_product_tabs( $tabs ) {
    unset( $tabs['informacion_adicional'] ); // información adicional
    return $tabs.
}

V. Preguntas más frecuentes

P1: ¿Afectará a la configuración del backend?
No funcionará. Este método sólo funciona enadelantar parte de algoVisualizado, el editor de productos backend sigue conservando todos los campos.

P2: ¿Se pueden añadir varias pestañas al mismo tiempo?
Sí, sólo tiene que añadir varias estructuras de matriz repetidamente. Por ejemplo, añada varias pestañas como "Marca", "Guía del usuario", etc.

P3: ¿Afectan las actualizaciones de los temas al código?
Si modifica directamente el tema funciones.phpque puede sobrescribirse al actualizar el tema. Se recomienda utilizarsubtemao Code Snippets para gestionar dicho código funcional.

VI. Conclusión

Personalizando WooCommerce Con el contenido de las fichas en las páginas de detalles del producto, los comerciantes pueden transmitir con mayor precisión el valor de la marca, la garantía posventa y la información sobre el servicio del producto, proporcionando a los usuarios una experiencia de compra más clara y creíble. Sin plug-ins, unas pocas líneas de código pueden ampliar fácilmente el contenido de la página de detalles del producto, personalizar la página y mejorar la tasa de conversión y la satisfacción del cliente.

Contacte con nosotros
¿No puede leer el tutorial? Póngase en contacto con nosotros para obtener una respuesta gratuita. Ayuda gratuita para sitios personales y de pequeñas empresas	Servicio de atención al cliente WeChat
① Tel: 020-2206-9892
② QQ咨询：1025174874
(iii) Correo electrónico: info@361sale.com
④ Horario de trabajo: de lunes a viernes, de 9:30 a 18:30, días festivos libres