Aplicando la cadena de filtros del hook woocommerce_product_tabs
a un array vacío te devuelve las pestañas definidas para el producto actual ( es como se renderizan en el template tabs.php
).
primer intento
- contar las tabs desde un filtro del body class y aplicar una clase CSS extra al
<body>
En el filtro de clases para el <body>
preguntas si es un "single product page" y agregas la nueva clase con el número al array de clases del body.
<?php
function my_body_classes( $classes ) {
if ( is_product() ){
$product_tabs = apply_filters( 'woocommerce_product_tabs', array() );
$numero_pestanas = count( $product_tabs );
$classes[] = "pestanias-{$numero_pestanas}";
}
return $classes;
}
add_filter( 'body_class','my_body_classes' );
En las pruebas realizadas devuelve siempre 1, con lo cual pareciera que las tabs extra ( por default tiene la de comentarios ) se agregan luego de que el tag body
reciba sus clases ( el theme padre haría apply_filters( 'body_class', [] )
en el header ).
opción recomendada por woocommerce
Copiar el archivo /wp-content/plugins/woocommerce/templates/single-product/tabs/tabs.php
a la carpeta del child-theme como /child-theme/woocommerce/single-product/tabs/tabs.php
y editar donde se imprime el <ul>
de las tabs.
$product_tabs = apply_filters( 'woocommerce_product_tabs', array() );
if ( ! empty( $product_tabs ) ) : $numero_pestanas = count( $product_tabs ); ?>
<div class="woocommerce-tabs wc-tabs-wrapper">
<ul class="tabs wc-tabs pestanias-<?php echo $numero_pestanas;?>" role="tablist">
La "contra" que tiene esto es que si se actualiza el template de woocommerce para las tabs, hay que actualizar el archivo en el child-theme.
opción propuesta
Para no incluir el archivo tabs.php
en el child-theme, buscar donde abrir y cerrar un div que contenga el número de tabs como una clase CSS.
Según este artículo la secuencia de renderizado de las tabs en un product page es:
// Tabs, upsells and related products
add_action(
'woocommerce_after_single_product_summary',
'woocommerce_output_product_data_tabs', 10
);
add_action(
'woocommerce_product_additional_information',
'wc_display_product_attributes', 10
);
do_action( 'woocommerce_product_after_tabs' );
add_action(
'woocommerce_after_single_product_summary',
'woocommerce_upsell_display', 15
);
add_action(
'woocommerce_after_single_product_summary',
'woocommerce_output_related_products', 20
);
Es decir que las tabs se renderizan en el action woocommerce_after_single_product_summary
con prioridad 10
y luego tenemos un action woocommerce_product_after_tabs
que por el nombre es luego de imprimir las tabs. Viendo el source de tabs.php
este último action se ejecuta justo antes de cerrar un div
que sólo se abre cuando hay tabs, así que hay que tener cuidado de no abrir el div si no hay tabs.
function soes116586_my_tabs_count_ABRE(){
write_log( 'afterSingleSummary' );
$product_tabs = apply_filters( 'woocommerce_product_tabs', array() );
$numero_pestanas = count( $product_tabs );
write_log( $product_tabs );
// solo si hay 1 o mas
if ( 1 <= $numero_pestanas ){
echo "<!-- START {$numero_pestanas} -->" . PHP_EOL;
echo "<div class=pestanias-{$numero_pestanas}";
}
}
function soes116586_my_tabs_count_CIERRA(){
write_log( 'afterTabs' );
$product_tabs = apply_filters( 'woocommerce_product_tabs', array() );
$numero_pestanas = count( $product_tabs );
write_log( $product_tabs );
// solo si hay 1 o mas
if ( 1 <= $numero_pestanas ){
echo "<!-- END {$numero_pestanas} -->" . PHP_EOL;
echo "</div";
}
}
/*
// según este action en el template de single product
add_action(
'woocommerce_after_single_product_summary',
'woocommerce_output_product_data_tabs', 10
);
//*/
// las tabs van luego de summary con prioridad 10,
// asi que le inyectamos html con prioridad 5
add_action(
'woocommerce_after_single_product_summary',
'soes116586_my_tabs_count_ABRE', 5
);
add_action(
'woocommerce_product_after_tabs',
'soes116586_my_tabs_count_CIERRA', 10
);