New in 4.6.0 – Book from availability calendar – shortcode?

[Adrian Ince]

Hi Motopress,
Thank you for the new functionality in 4.6.0 – the ability to book from the availability calendar. This works perfectly from the accommodation page and we are delighted to see it.
However, the shortcode [mphb_availability_calendar] and the block “Availability Calendar” don’t seem to support this functionality.
Are them some undocumented options for the shortcode? Something I am missing on the block?
If the new functionality isn’t available on the shortcode and block, can this be added to the development roadmap?
Many thanks.

[J. Davis]

Hi Adrian,

Thanks for your feedback and for our question. In order to make the calendar clickable you need to add [mphb_availability id=”777″] (Booking Form block) and [mphb_availability_calendar id=”777″] (Availability Calendar block) on the page.

best regards,
John Davis

[Aaron Young]

Hi John

I have entered the 2 shortcodes you gave, changed the calendar ID to match my own and the availability calendar is not clickable. It only adds a second section where you can enter a check in/out date and click search which takes me to the typical check availability page.

All I need is to show the availability calendar colour coded and have the dates clickable to book in – is this possible as I cant seem to get this functionality and the update makes it sound like it should now be doable.

The website I’m trying to get this working on – https://twiceasnicechalets.co.uk/chalets/

[Adrian Ince]

Hi Aaron, I notice that you have multiple accommodations on one page. Does it work with a page where there is just one accommodation?

[Adrian Ince]

Thank you, that worked.

[Aaron Young]

I created a test page, input the 2 shortcodes again and get the same result. A check availability that goes to a search that shows all chalets, and the availability calendar that isn’t clickable.

(Open image in new tab to avoid the crosslink error)

(Open image in new tab to avoid the crosslink error)

[J. Davis]

Hi Aaron,

I’ve checked your page and it looks like there is a common search form [mphb_availability_search] is added. However, each calendar requires an availability form [mphb_availability id=”777″] to become clickable. You need to add an availability form under the calendar of the same property to make the calendar clickable.
Additionally, navigate to Accommodation > Settings and activate the Skip Search Results option. It should work when this option is activated.

best regards,
John Davis

[Aaron Young]

It works!

I have also done some styling to hide all check-in/out/availability boxes as they are sort of redundant if people click the calendar dates they want. Now when they select a week, the price and “confirm reservation” button shows which is perfect.

Thanks All!

For anyone interested in the same functionality(link to see how it works), I used the following CSS:

<style>
p.mphb-check-in-date-wrapper,p.mphb-check-out-date-wrapper,p.mphb-required-fields-tip,p.mphb-reserve-btn-wrapper {
display: none;
}
p.mphb-period-price.mphb-regular-price {
margin-top: 10px;
}
</style>

[J. Davis]

Hi Aaron,

You are welcome. Thank you for sharing your experience.

best regards,
John Davis

[James Atkinson]

Hello,

I like your style.

Could you provide more information on where you added the CSS code to get that functionality?

Thanks,

[Aaron Young]

Hi James

I added the CSS to the bottom of the page in an HTML Elementor block so that everything loads as normal then this CSS runs and hides the relevant boxes.

[Author]

Posts