Iframe Resizing - Revision history

Annette at 14:16, 18 June 2020

2020-06-18T14:16:47Z

← Older revision		Revision as of 14:16, 18 June 2020
Line 17:		Line 17:

	== Beds24.com ==		== Beds24.com ==
	Add the following to the menu {{#fas:cog}} (SETTINGS) > BOOKING PAGE > DEVELOPER "Insert in HTML head"		Add the following to the menu {{#fas:cog}} (SETTINGS) > BOOKING ENGINE > PROPERTY BOOKING PAGE > DEVELOPER "Insert in HTML head"

	<code><script type="text/javascript" src="include/iframeresizer/4.2.10/iframeResizer.contentWindow.min.js"></script> </code>		<code><script type="text/javascript" src="include/iframeresizer/4.2.10/iframeResizer.contentWindow.min.js"></script> </code>

Annette at 14:24, 15 May 2020

2020-05-15T14:24:01Z

← Older revision		Revision as of 14:24, 15 May 2020
Line 2:		Line 2:
	[[Category:Booking_Page]]		[[Category:Booking_Page]]
	[[Category:Widgets]]		[[Category:Widgets]]
			[[Category:Developers]]
	<div class="heading">Resize Iframe</div>		<div class="heading">Resize Iframe</div>
	This page explains how to use the iFrame Resizer		This page explains how to use the iFrame Resizer

Annette at 11:06, 15 May 2020

2020-05-15T11:06:25Z

← Older revision		Revision as of 11:06, 15 May 2020
Line 4:		Line 4:
	<div class="heading">Resize Iframe</div>		<div class="heading">Resize Iframe</div>
	This page explains how to use the iFrame Resizer		This page explains how to use the iFrame Resizer
	'''Requires:''' Ability to upload a file and add code to the html of your web site		<span style="color: #f3e504; font-size: 250%;" >{{#fas:lightbulb}} </span>'''Requires:''' Ability to upload a file and add code to the html of your web site

	<span style="color:#fe746c;“ >{{#fas:exclamation-triangle}} </span> This instruction is for version 4.2.10 of iFrame Resizer. There may be a newer version as documented here https://github.com/davidjbradshaw/iframe-resizer		<span style="color:#fe746c;“ >{{#fas:exclamation-triangle}} </span> This instruction is for version 4.2.10 of iFrame Resizer. There may be a newer version as documented here https://github.com/davidjbradshaw/iframe-resizer

Annette at 11:05, 15 May 2020

2020-05-15T11:05:12Z

← Older revision		Revision as of 11:05, 15 May 2020
Line 2:		Line 2:
	[[Category:Booking_Page]]		[[Category:Booking_Page]]
	[[Category:Widgets]]		[[Category:Widgets]]
			<div class="heading">Resize Iframe</div>
	This page explains how to use the iFrame Resizer		This page explains how to use the iFrame Resizer
	'''Requires:''' Ability to upload a file and add code to the html of your web site		'''Requires:''' Ability to upload a file and add code to the html of your web site

Annette at 11:04, 15 May 2020

2020-05-15T11:04:15Z

← Older revision		Revision as of 11:04, 15 May 2020
Line 12:		Line 12:
	Beds24 can not support or answer questions about this code, for help please refer to the developer site: https://github.com/davidjbradshaw/iframe-resizer		Beds24 can not support or answer questions about this code, for help please refer to the developer site: https://github.com/davidjbradshaw/iframe-resizer

	It has been reported that this solution can cause security warnings in some browsers concerning cross domain scripts. A better solution would be to use a proxy so all scripts use the same domain.		<span style="color:#fe746c;“ >{{#fas:exclamation-triangle}} </span> It has been reported that this solution can cause security warnings in some browsers concerning cross domain scripts. A better solution would be to use a proxy so all scripts use the same domain.

	== Beds24.com ==		== Beds24.com ==

Annette at 11:03, 15 May 2020

2020-05-15T11:03:49Z

← Older revision		Revision as of 11:03, 15 May 2020
Line 5:		Line 5:
	'''Requires:''' Ability to upload a file and add code to the html of your web site		'''Requires:''' Ability to upload a file and add code to the html of your web site

			<span style="color:#fe746c;“ >{{#fas:exclamation-triangle}} </span> This instruction is for version 4.2.10 of iFrame Resizer. There may be a newer version as documented here https://github.com/davidjbradshaw/iframe-resizer
	This instruction is for version 4.2.10 of iFrame Resizer. There may be a newer version as documented here https://github.com/davidjbradshaw/iframe-resizer

	== Introduction ==		== Introduction ==
Line 18:		Line 17:
	Add the following to the menu {{#fas:cog}} (SETTINGS) > BOOKING PAGE > DEVELOPER "Insert in HTML head"		Add the following to the menu {{#fas:cog}} (SETTINGS) > BOOKING PAGE > DEVELOPER "Insert in HTML head"

	<code><script type="text/javascript" src="include/iframeresizer/4.2.10/iframeResizer.contentWindow.min.js"></script> </code>		<code><script type="text/javascript" src="include/iframeresizer/4.2.10/iframeResizer.contentWindow.min.js"></script> </code>

	If you want to use a more recent version, you can host the file externally and include it with a full URL, make sure to use https:// to avoid insecure content warnings.		If you want to use a more recent version, you can host the file externally and include it with a full URL, make sure to use https:// to avoid insecure content warnings.

Annette at 11:02, 15 May 2020

2020-05-15T11:02:52Z

← Older revision		Revision as of 11:02, 15 May 2020
Line 7:		Line 7:

	This instruction is for version 4.2.10 of iFrame Resizer. There may be a newer version as documented here https://github.com/davidjbradshaw/iframe-resizer		This instruction is for version 4.2.10 of iFrame Resizer. There may be a newer version as documented here https://github.com/davidjbradshaw/iframe-resizer


	== Introduction ==		== Introduction ==
Line 17:		Line 16:

	== Beds24.com ==		== Beds24.com ==
	Add the following to the menu SETTINGS -> BOOKING PAGE -> DEVELOPER "Insert in HTML head"		Add the following to the menu {{#fas:cog}} (SETTINGS) > BOOKING PAGE > DEVELOPER "Insert in HTML head"

	<script type="text/javascript" src="include/iframeresizer/4.2.10/iframeResizer.contentWindow.min.js"></script>		<code><script type="text/javascript" src="include/iframeresizer/4.2.10/iframeResizer.contentWindow.min.js"></script> </code>

	If you want to use a more recent version, you can host the file externally and include it with a full URL, make sure to use https:// to avoid insecure content warnings.		If you want to use a more recent version, you can host the file externally and include it with a full URL, make sure to use https:// to avoid insecure content warnings.
Line 32:		Line 31:


	<iframe src="https://beds24.com/booking.php?propid=3103" width="100%" scrolling="no"></iframe>		<code> <iframe src="https://beds24.com/booking.php?propid=3103" width="100%" scrolling="no"></iframe></code>

	<script type="text/javascript" src="iframeResizer.min.js"></script>		<code> <script type="text/javascript" src="iframeResizer.min.js"></script> </code><code><script type="text/javascript">iFrameResize();</script></code>
	<script type="text/javascript">
	iFrameResize();
	</script>

Markkinchin at 21:07, 16 March 2020

2020-03-16T21:07:53Z

Annette at 19:12, 23 January 2020

2020-01-23T19:12:51Z

← Older revision		Revision as of 19:12, 23 January 2020
Line 5:		Line 5:
	'''Requires:''' Ability to upload a file and add code to the html of your web site		'''Requires:''' Ability to upload a file and add code to the html of your web site

	~~== NOTE ==~~
	This instruction is for an old version of iFrame Resizer. We suggest using the latest version as documented here https://github.com/davidjbradshaw/iframe-resizer		This instruction is for an old version of iFrame Resizer. We suggest using the latest version as documented here https://github.com/davidjbradshaw/iframe-resizer

Annette at 19:12, 23 January 2020

2020-01-23T19:12:32Z

← Older revision		Revision as of 19:12, 23 January 2020
Line 2:		Line 2:
	[[Category:Booking_Page]]		[[Category:Booking_Page]]
	[[Category:Widgets]]		[[Category:Widgets]]
	~~[[Category:Booking_Engine]]~~
	This page explains how to use the iFrame Resizer		This page explains how to use the iFrame Resizer
	'''Requires:''' Ability to upload a file and add code to the html of your web site		'''Requires:''' Ability to upload a file and add code to the html of your web site

← Older revision		Revision as of 21:07, 16 March 2020
Line 6:		Line 6:


	This instruction is for ~~an old~~ version of iFrame Resizer. ~~We suggest using the latest~~ version as documented here https://github.com/davidjbradshaw/iframe-resizer		This instruction is for version 4.2.10 of iFrame Resizer. There may be a newer version as documented here https://github.com/davidjbradshaw/iframe-resizer


Line 19:		Line 19:
	Add the following to the menu SETTINGS -> BOOKING PAGE -> DEVELOPER "Insert in HTML head"		Add the following to the menu SETTINGS -> BOOKING PAGE -> DEVELOPER "Insert in HTML head"

	<script type="text/javascript" src="include/iframeresizer/3.5.3/iframeResizer.contentWindow.min.js"></script>		<script type="text/javascript" src="include/iframeresizer/4.2.10/iframeResizer.contentWindow.min.js"></script>

	If you want to use a more recent version, you can host the file externally and include it with a full URL, make sure to use https:// to avoid insecure content warnings.		If you want to use a more recent version, you can host the file externally and include it with a full URL, make sure to use https:// to avoid insecure content warnings.
Line 27:		Line 27:
	Refer to the developers web site for a full set of options, instructions and troubleshooting.		Refer to the developers web site for a full set of options, instructions and troubleshooting.

	*Download the iframeResizer.contentWindow.min.js file from the developer site or from https://beds24.com/include/iframeresizer/3.5.3/iframeResizer.min.js		*Download the iframeResizer.contentWindow.min.js file from the developer site or from https://beds24.com/include/iframeresizer/4.2.10/iframeResizer.min.js
	*Upload the file to your web server and place it in the same directory as your web page.		*Upload the file to your web server and place it in the same directory as your web page.
	*Remove any height parameter from your booking page iframe and add the script after the iframe, if necessary change the src path to the location of your iframeResizer.min.js file.		*Remove any height parameter from your booking page iframe and add the script after the iframe, if necessary change the src path to the location of your iframeResizer.min.js file.
Line 40:		Line 40:


	Make sure to use the same version files on the booking page and your web page. (in this example 3.5.3)		Make sure to use the same version files on the booking page and your web page. (in this example 4.2.10)

	If you prefer, you can set a fixed iframe width in pixels rather than a percentage width.		If you prefer, you can set a fixed iframe width in pixels rather than a percentage width.

	There are many more options available for iframe-resizer, refer to the developer site. This example shows a minimum setup.		There are many more options available for iframe-resizer, refer to the developer site. This example shows a minimum setup.