Make it so that all time slots in a time-based booking in WooCommerce Bookings shows how many spots remain, not just partially booked blocks.

rewrite-wc-bookings-get-time-slots-html.php

<?php // do not copy this line

function rewrite_wc_bookings_get_time_slots_html( $block_html, $available_blocks, $blocks ) {
	$block_html       = '';

	foreach ( $available_blocks as $block => $quantity ) {
		if ( $quantity['available'] > 0 ) {

				$block_html .= '<li class="block" data-block="' . esc_attr( date( 'Hi', $block ) ) . '"><a href="#" data-value="' . date( 'c', $block ) . '">' . date_i18n( get_option( 'time_format' ), $block ) . ' <small class="booking-spaces-left">(' . sprintf( _n( '%d left', '%d left', $quantity['available'], 'woocommerce-bookings' ), absint( $quantity['available'] ) ) . ')</small></a></li>';
		}
	}

	return $block_html;
}
add_filter( 'wc_bookings_get_time_slots_html', 'rewrite_wc_bookings_get_time_slots_html', 10, 3 );

@debihazelden I wonder if that's due to time zone settings. The code above is still in my test shop, I just had commented out the add_filter bit. I tested and it works without the edit. It's good to know for others, though.

Ah good thinking probably is because of that. I'm in Australia.

Had a similar issue in that everything worked but the data-value would not be accepted by WooCommerce so it said nothing was available even though it was all displayed correctly.
Changed this:

data-value="' . date( 'G:i', $block ) . '"

to:

data-value="' . date( 'c', $block ) . '"

Which seemed to be the format WooCommerce wants. Perhaps something changed in date handling.

@antonyjsmith Thanks for the heads up. I just reviewed the code, and things did change. It looks like Bookings doesn't pass enough data to the filter to allow for proper handling here any more, either. I'll have to see what I can do, either way. For now, I used your fix, as this filter gets sent out every few weeks to those who ask for it.

anybody care to tell a noob like me how to actually implement the above? copy it to a php file in a directory and run it? or ?

@iceryan354 you can either add it into your theme if it is a child theme, or use something like the Code Snippets plugin on WordPress.org.

Thanks Jesse - related issue: any way to have the booking calender by default on load, display the current highlighted days timeslots? Seems to always require an initial click... Great work and cheers.

@iceryan354 There should be an option on the General tab in the product itself. If you run into issues, reach out to support through your account at WooCommerce.com and they will be able to help you out.

Hi jesse is there any function to find booked time slot for a particular date

HI there,
I want to show the booking price below each date in the calendar.
I used the above code but nothing is showing.