Page 1 of 1

Implementing Booking Widget

PostPosted: Tue Jun 05, 2018 4:12 pm
by MiDigs
A client of mine is wanting his virtual tour to display a booking widget which will allow you to book a restaurant table directly from the tour.

He is able to give me the code for the widget but I am unsure as to how i would implement this into the tour. If anyone has any advice or solutions it would be greatly appreciated.

Re: Implementing Booking Widget

PostPosted: Wed Jun 06, 2018 1:46 pm
by bdd
You can place a spot on each table.
A click on the spot opens a "website box" containing the Booking widget, with the table ID as a parameter in the URL .


Re: Implementing Booking Widget

PostPosted: Wed Jun 06, 2018 2:07 pm
by MiDigs
Can you elaborate a little more please.

Im not wanting a web page to open, I want the actual widget to be embedded in the tour if you understand me as the widget cannot be opened from having a website box.

What are your thoughts?

Re: Implementing Booking Widget

PostPosted: Fri Jun 08, 2018 12:53 pm
by bdd
If you use a website box plugin, it will be embedded in the tour.
It won't leave it and won't open a new page in your browser.

When you say the "widget cannot be opened from having a website box" what do you mean ?

What is the code of the widget ?


Re: Implementing Booking Widget

PostPosted: Fri Jun 08, 2018 2:13 pm
by MiDigs
yeah I understand the website box is embedded. That is however for a URL link and not a booking widget if you understand me.

It will be coded like this

<div style="color: #2f2f2f; font-size:14px; width: 100%; padding-top: 5px; padding-bottom: 5px; text-align: center; background: #ffcc66;
<input type='hidden' name='referer' value='BookingStrip'></span><input type="hidden" name="redirect" value=""></form></div>
<script type='text/javascript'>var dateNow = new Date();var dateFirst = new Date();dateFirst.setDate(dateFirst.getDate()+14);var numMonths = 24;var selectMonth = dateFirst.getMonth()+dateFirst.getYear()*12-dateNow.getMonth()-dateNow.getYear()*12;if (selectMonth < 0) {selectMonth=selectMonth+12;}var selectDay = dateFirst.getDate();var theList = document.getElementById('fdate944537_monthyear_propid10594');var theDayList = document.getElementById('fdate944537_date_propid10594');var len = theList.length;var i;for (i=len; i>=0; i--) {theList.options[i]=null;}var dateNow = new Date();var monthNow = dateNow.getMonth() + 1;var yearNow = dateNow.getFullYear();var monthName = new Array(12);monthName[0] = 'Jan';monthName[1] = 'Feb';monthName[2] = 'Mar';monthName[3] = 'Apr';monthName[4] = 'May';monthName[5] = 'Jun';monthName[6] = 'Jul';monthName[7] = 'Aug';monthName[8] = 'Sep';monthName[9] = 'Oct';monthName[10] = 'Nov';monthName[11] = 'Dec';var thisYear = yearNow;var thisMonth = monthNow;for (i=0; i<numMonths; i++) {if (thisMonth > 12) {thisMonth = 1;thisYear = thisYear + 1;}var thisMonthLead = thisMonth;if (thisMonth < 10) {thisMonthLead = '0' + thisMonth;}theList.options[i] = new Option(monthName[thisMonth-1]+' '+thisYear, thisYear+'-'+thisMonthLead);if (i == selectMonth) {theList.options[i].selected = true;}thisMonth = thisMonth + 1;}theDayList.options[selectDay-1].selected = true;</script>

I dont have access to the real code just now but do you think it is possible to embed this booking widget in the tour?