Hide custom tab when no content is present in woocommerce products

There is most likely a better way of doing this, but I've achieved this in the past with the following:

if( get_field('directions') )
{
    echo the_field('directions');
}
else
{
    echo "<style>.direction_tab_tab { display:none !important; }</style>";
}

This will print the contents of the "directions" field if there is text in it, if not it will print the css and hide the tab.


The easiest method is to remove the tab.

You can do this based on the content of text field, which in case is empty just use this.

 unset( $tabs['direction_tab'] );   // Remove the additional direction tab

And you are done :)


Hej, I had the same problem and found a much nicer way to solve this. I only add the tab when it has content. Maybe this helps everybody else finding this thread.

add_filter( 'woocommerce_product_tabs', 'woo_new_direction_tab' );
function woo_new_direction_tab( $tabs ) {

    // Adds the new tab

    if (!empty(the_field('directions'))) {
        $tabs['direction_tab'] = array(
            'title'     => __( 'Direction', 'woocommerce' ),
            'priority'  => 60,
            'callback'  => 'woo_new_direction_tab_content'
        );
    }

    return $tabs;

}


function woo_new_direction_tab_content() {

    // The new tab content

    echo the_field('directions');

}

A better way will be

if( get_field('directions') ) {
  $tabs['direction_tab'] = array(
      'title'     => __( 'Direction', 'woocommerce' ),
      'priority'  => 60,
      'callback'  => 'woo_new_direction_tab_content'
  );
 }

That will hide the tab if there is no content in the tab