Availability Calendar - Revision history

Annette at 11:05, 9 September 2020

2020-09-09T11:05:31Z

← Older revision		Revision as of 11:05, 9 September 2020
Line 51:		Line 51:
	1. start with a normal availability calendar widget from the widgets menu		1. start with a normal availability calendar widget from the widgets menu

	<nowiki><div style="width:auto; padding:0; margin:0;"></nowiki><form id='ap00002048' style='display:inline;' method='GET' target='_blank' action='https://~~www.~~beds24.com/booking.php'><script type='text/javascript' src='https://~~www.~~beds24.com/availcal/cal.jsp?propid=2048&width=200'></script><input type='hidden' name='propid' value='2048'><input type='hidden' name='fdate' value=''><input type='hidden' name='referer' value='Calendar'><input id='beds24sub1411413312' type='submit' STYLE='width:200px' value='Check Availability' title='Click to check availability and make a reservation online'><script type='text/javascript'>document.getElementById('beds24sub1411413312').style.display='none';</script></form></div>		<nowiki><div style="width:auto; padding:0; margin:0;"></nowiki><form id='ap00002048' style='display:inline;' method='GET' target='_blank' action='https://beds24.com/booking.php'><script type='text/javascript' src='https://beds24.com/availcal/cal.jsp?propid=2048&width=200'></script><input type='hidden' name='propid' value='2048'><input type='hidden' name='fdate' value=''><input type='hidden' name='referer' value='Calendar'><input id='beds24sub1411413312' type='submit' STYLE='width:200px' value='Check Availability' title='Click to check availability and make a reservation online'><script type='text/javascript'>document.getElementById('beds24sub1411413312').style.display='none';</script></form></div>


Line 60:		Line 60:
	*we have removed the input button and the script to hide it.		*we have removed the input button and the script to hide it.

	<nowiki><div style="width:auto; padding:0; margin:0;"></nowiki><form id='ap00002048b' style='display:inline;' method='GET' target='_blank' action='https://~~www.~~beds24.com/booking.php'><script>cb00002048[1]=cb00002048[0].clone('ap00002048b');</script><input type='hidden' name='propid' value='2048'><input type='hidden' name='fdate' value=''><input type='hidden' name='referer' value='Calendar'></form></div>		<nowiki><div style="width:auto; padding:0; margin:0;"></nowiki><form id='ap00002048b' style='display:inline;' method='GET' target='_blank' action='https://beds24.com/booking.php'><script>cb00002048[1]=cb00002048[0].clone('ap00002048b');</script><input type='hidden' name='propid' value='2048'><input type='hidden' name='fdate' value=''><input type='hidden' name='referer' value='Calendar'></form></div>

	3. make another clone		3. make another clone

	<nowiki><div style="width:auto; padding:0; margin:0;"><</nowiki>form id='ap00002048c' style='display:inline;' method='GET' target='_blank' action='https://~~www.~~beds24.com/booking.php'><script>cb00002048[2]=cb00002048[0].clone('ap00002048c');</script><input type='hidden' name='propid' value='2048'><input type='hidden' name='fdate' value=''><input type='hidden' name='referer' value='Calendar'></form></div>		<nowiki><div style="width:auto; padding:0; margin:0;"><</nowiki>form id='ap00002048c' style='display:inline;' method='GET' target='_blank' action='https://beds24.com/booking.php'><script>cb00002048[2]=cb00002048[0].clone('ap00002048c');</script><input type='hidden' name='propid' value='2048'><input type='hidden' name='fdate' value=''><input type='hidden' name='referer' value='Calendar'></form></div>

	4. and as many more as you want		4. and as many more as you want

	<nowiki><div style="width:auto; padding:0; margin:0;"></nowiki><form id='ap00002048d' style='display:inline;' method='GET' target='_blank' action='https://~~www.~~beds24.com/booking.php'> <script>cb00002048[3]=cb00002048[0].clone('ap00002048d');</script><input type='hidden' name='propid' value='2048'><input type='hidden' name='fdate' value=''><input type='hidden' name='referer' value='Calendar'></form></div>		<nowiki><div style="width:auto; padding:0; margin:0;"></nowiki><form id='ap00002048d' style='display:inline;' method='GET' target='_blank' action='https://beds24.com/booking.php'> <script>cb00002048[3]=cb00002048[0].clone('ap00002048d');</script><input type='hidden' name='propid' value='2048'><input type='hidden' name='fdate' value=''><input type='hidden' name='referer' value='Calendar'></form></div>

	5. this script which is included after the calendars are cloned increments the displayed date one month at a time		5. this script which is included after the calendars are cloned increments the displayed date one month at a time

Annette at 07:13, 15 May 2020

2020-05-15T07:13:18Z

← Older revision		Revision as of 07:13, 15 May 2020
Line 1:		Line 1:
	[[Category:Legacy_Widgets]]		[[Category:Legacy_Widgets]]
			<div class="heading">Legacy Availability Calendar</div>
	This page explains how to create a legacy availability calendar for your website.		This page explains how to create a legacy availability calendar for your website.

Annette at 07:12, 15 May 2020

2020-05-15T07:12:41Z

← Older revision		Revision as of 07:12, 15 May 2020
Line 1:		Line 1:
	''This page ~~is about the menu SETTINGS ->BOOKING ENGINE-> BOOKING WIDGETS -> AVAILABILITY CALENDAR''~~		[[Category:Legacy_Widgets]]
	~~NOTE: This widget is not supported any longer. You can generate an~~ availability calendar ~~widget using the widget designer in SETTINGS ->BOOKING PAGE-> BOOKING WIDGETS~~		This page explains how to create a legacy availability calendar for your website.

	~~This~~ widget designer ~~lets~~ you ~~create your own availability calendar widget~~.		<div class="warning">{{#fas:exclamation-triangle}} These widgets are depreciated. Use the widget designer in {{#fas:cog}} (SETTINGS) BOOKING ENGINE > BOOKING WIDGETS to create widgets if you can. </div>

			Go to {{#fas:cog}} (SETTINGS) BOOKING ENGINE > BOOKING WIDGETS > BOOKING BUTTON and click on the link at the bottom.

	Use the selector to define if the link should open your booking page displaying all properties (in case you have more than one), a property or a room.		Use the selector to define if the link should open your booking page displaying all properties (in case you have more than one), a property or a room.

Annette at 20:40, 23 January 2020

2020-01-23T20:40:48Z

← Older revision		Revision as of 20:40, 23 January 2020
Line 1:		Line 1:
	''This page is about the menu SETTINGS ->BOOKING ~~PAGE~~-> BOOKING WIDGETS -> AVAILABILITY CALENDAR''		''This page is about the menu SETTINGS ->BOOKING ENGINE-> BOOKING WIDGETS -> AVAILABILITY CALENDAR''
	NOTE: This widget is not supported any longer. You can generate an availability calendar widget using the widget designer in SETTINGS ->BOOKING PAGE-> BOOKING WIDGETS		NOTE: This widget is not supported any longer. You can generate an availability calendar widget using the widget designer in SETTINGS ->BOOKING PAGE-> BOOKING WIDGETS

Annette at 11:39, 28 October 2017

2017-10-28T11:39:54Z

← Older revision		Revision as of 11:39, 28 October 2017
Line 15:		Line 15:
	*available dates hover colour - mouse hover over background colour of available nights		*available dates hover colour - mouse hover over background colour of available nights
	*unavailable dates background color		*unavailable dates background color
	*~~referrer~~ text - If you use widgets on different ~~websites~~ you may use different ~~referrers~~ on each. This text will be recorded with any bookings originating from this widget allowing tracking of booking sources.		*referer text - If you use widgets on different web sites you may use different referers on each. This text will be recorded with any bookings originating from this widget allowing tracking of booking sources.

	If you want to change the first day of the week, for example to Sunday, add the following to your page anywhere before the calendar code. The number can be between 0 and 7 where 0=Sunday, 1=Monday etc.		If you want to change the first day of the week, for example to Sunday, add the following to your page anywhere before the calendar code. The number can be between 0 and 7 where 0=Sunday, 1=Monday etc.

Annette at 14:13, 6 June 2017

2017-06-06T14:13:55Z

← Older revision		Revision as of 14:13, 6 June 2017
Line 1:		Line 1:
	~~[[Category:Widgets]]~~		''This page is about the menu SETTINGS ->BOOKING PAGE-> BOOKING WIDGETS -> AVAILABILITY CALENDAR''
	''This page is about the menu SETTINGS ->BOOKING PAGE-> BOOKING WIDGETS -> AVAILABILITY CALENDAR''		NOTE: This widget is not supported any longer. You can generate an availability calendar widget using the widget designer in SETTINGS ->BOOKING PAGE-> BOOKING WIDGETS

	This widget designer lets you create your own availability calendar widget.		This widget designer lets you create your own availability calendar widget.

Annette at 13:44, 17 February 2017

2017-02-17T13:44:05Z

@@ Line 6: / Line 6: @@
 Use the selector to define if the link should open your booking page displaying all properties (in case you have more than one), a property or a room.
 You can customise defining:
@@ Line 40: / Line 41: @@
   font-size: 20px !important;
+  }

Lesley: updated 'olour' and 'color' to colour, webbsites to websites

2016-07-22T07:02:11Z

updated 'olour' and 'color' to colour, webbsites to websites

← Older revision		Revision as of 07:02, 22 July 2016
Line 8:		Line 8:

	You can customise defining:		You can customise defining:
	*text ~~color~~		*text colour
	*text not in month ~~color~~ -~~olour~~ of dates that are not in the month on the availability calendar widget		*text not in month colour -colour of dates that are not in the month on the availability calendar widget
	*background ~~color~~ - if you dont want a fading effect, set both colours the same		*background colour - if you dont want a fading effect, set both colours the same
	*available dates background color		*available dates background color
	*~~avialabile~~ dates hover colour - mouse hover over background colour of available nights		*available dates hover colour - mouse hover over background colour of available nights
	*unavailable dates background color		*unavailable dates background color
	*referrer text - If you use widgets on different ~~webssites~~ you may use different referrers on each. This text will be recorded with any bookings originating from this widget allowing tracking of booking sources.		*referrer text - If you use widgets on different websites you may use different referrers on each. This text will be recorded with any bookings originating from this widget allowing tracking of booking sources.

	If you want to change the first day of the week, for example to Sunday, add the following to your page anywhere before the calendar code. The number can be between 0 and 7 where 0=Sunday, 1=Monday etc.		If you want to change the first day of the week, for example to Sunday, add the following to your page anywhere before the calendar code. The number can be between 0 and 7 where 0=Sunday, 1=Monday etc.

Annette at 10:42, 2 July 2016

2016-07-02T10:42:43Z

← Older revision		Revision as of 10:42, 2 July 2016
Line 18:		Line 18:
	If you want to change the first day of the week, for example to Sunday, add the following to your page anywhere before the calendar code. The number can be between 0 and 7 where 0=Sunday, 1=Monday etc.		If you want to change the first day of the week, for example to Sunday, add the following to your page anywhere before the calendar code. The number can be between 0 and 7 where 0=Sunday, 1=Monday etc.

	<script>var beds24CalStartDay=0;</script>		<script>var beds24CalStartDay=0;</script>


Line 26:		Line 26:
	If the widget does not fit into its designated place you can override the CSS padding for the buttons and make them smaller with the following CSS		If the widget does not fit into its designated place you can override the CSS padding for the buttons and make them smaller with the following CSS

	.beds24availcal input {padding:5px;}		.beds24availcal input {padding:5px;}

	Either add the above directly to your CSS or add the following to the HEAD section of your page, if necessary change the 5px to a better value.		Either add the above directly to your CSS or add the following to the HEAD section of your page, if necessary change the 5px to a better value.

	Code: Select all		Code: Select all
	<style>		<style>
	.beds24availcal input {padding:5px;}		.beds24availcal input {padding:5px;}
	</style>		</style>

			If you want to change the the style you can do this adding CSS to the stylesheet of your website. For example to change the font size add:

			.beds24availcal td{
			font-size: 20px !important;
			}

Annette at 08:41, 1 September 2015

2015-09-01T08:41:58Z

← Older revision		Revision as of 08:41, 1 September 2015
Line 1:		Line 1:
	[[Category:Widgets]]		[[Category:Widgets]]
	''This page is about the menu SETTINGS -> BOOKING WIDGETS -> AVAILABILITY CALENDAR''		''This page is about the menu SETTINGS ->BOOKING PAGE-> BOOKING WIDGETS -> AVAILABILITY CALENDAR''

	This widget designer lets you create your own availability calendar widget.		This widget designer lets you create your own availability calendar widget.